这里利用ViewPager实现页面的滑动,下面直接上代码:
1、首先写一个Activity,然后将要滑动的Fragment镶嵌到写好的Activity中。
Activity的布局文件:activity_main.xml:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" > <FrameLayout
android:id="@+id/id_content"
android:layout_weight="1"
android:layout_width="match_parent"
android:layout_height="0dp"/> <android.support.v4.view.ViewPager
android:id="@+id/id_viewpage"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="0.001" >
</android.support.v4.view.ViewPager> <include layout="@layout/bottom" /> </LinearLayout>
activity_main.xml中引入的布局(下面的切换的部分)
bottom.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="55dp"
android:background="@drawable/bottom"
android:orientation="horizontal" > <LinearLayout
android:id="@+id/id_tab_education"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical" > <!-- android:clickable="false" 是为了防止ImageButton截取了触摸事件 ,这里事件要给它的上一级linearlayout --> <ImageButton
android:id="@+id/id_tab_education_img"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#00000000"
android:clickable="false"
android:src="@drawable/tab_bar_01_check" /> <TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/bottom_jurisdiction" />
</LinearLayout> <LinearLayout
android:id="@+id/id_tab_frd"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical" > <ImageButton
android:id="@+id/id_tab_frd_img"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#00000000"
android:clickable="false"
android:src="@drawable/tab_bar_04" /> <TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/bottom_discover" />
</LinearLayout> <LinearLayout
android:id="@+id/id_tab_setting"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical" > <ImageButton
android:id="@+id/id_tab_setting_img"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#00000000"
android:clickable="false"
android:src="@drawable/tab_bar_05" /> <TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/bottom_my" />
</LinearLayout> </LinearLayout>
MainActivity.class(用来镶嵌Fragment)
package com.example.activity; import com.example.fragment.SeekFragment;
import com.example.fragment.ProcedureFragment;
import com.example.fragment.MyFragment;
import com.example.myproject.R; import android.app.Activity;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentTransaction;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.view.KeyEvent;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.Window;
import android.widget.ImageButton;
import android.widget.LinearLayout;
import android.widget.Toast; public class MainActivity extends FragmentActivity implements OnClickListener{ private long lastTime;//退出键的最后时间
private ViewPager mViewPager;// 用来放置界面切换
// 三个Tab,每个Tab包含一个按钮
private LinearLayout mTabEducation;
private LinearLayout mTabFrd;
private LinearLayout mTabSetting;
// 三个按钮
private ImageButton mEducationImg;
private ImageButton mFrdImg;
private ImageButton mSettingImg;
// 初始化3个Fragment
private Fragment jurisdiction;
private Fragment discover;
private Fragment setting; @Override
protected void onCreate(Bundle savedInstanceState) {
// TODO Auto-generated method stub
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.activity_main); initView();
initEvent();
initViewPage(0);
} /*
* 判断哪个要显示,及设置按钮图片
*/
@Override
public void onClick(View arg0) {
switch (arg0.getId()) {
case R.id.id_tab_education:
initViewPage(0);
mViewPager.setCurrentItem(0);
resetImg();
mEducationImg.setImageResource(R.drawable.tab_bar_01_check);
break;
case R.id.id_tab_frd:
initViewPage(1);
mViewPager.setCurrentItem(1);
resetImg();
mFrdImg.setImageResource(R.drawable.tab_bar_04_check);
break;
case R.id.id_tab_setting:
initViewPage(2);
mViewPager.setCurrentItem(2);
resetImg();
mSettingImg.setImageResource(R.drawable.tab_bar_05_check);
break;
default:
break;
}
} /*
* 初始化配置
*/
private void initView() {
mViewPager = (ViewPager) findViewById(R.id.id_viewpage);
// 初始化三个LinearLayout
mTabEducation = (LinearLayout) findViewById(R.id.id_tab_education);
mTabFrd = (LinearLayout) findViewById(R.id.id_tab_frd);
mTabSetting = (LinearLayout) findViewById(R.id.id_tab_setting);
// 初始化三个按钮
mEducationImg = (ImageButton) findViewById(R.id.id_tab_education_img);
mFrdImg = (ImageButton) findViewById(R.id.id_tab_frd_img);
mSettingImg = (ImageButton) findViewById(R.id.id_tab_setting_img);
} /*
* 初始化initViewPage
*/
private void initViewPage(int i) {
FragmentManager fm = getSupportFragmentManager();
FragmentTransaction transaction = fm.beginTransaction();// 创建一个事务
hideFragment(transaction);// 我们先把所有的Fragment隐藏了,然后下面再开始处理具体要显示的Fragment
switch (i) {
case 0:
if (jurisdiction == null) {
jurisdiction = new ProcedureFragment();
transaction.add(R.id.id_content, jurisdiction);// 将微信聊天界面的Fragment添加到Activity中
} else {
transaction.show(jurisdiction);
}
break;
case 1:
if (discover == null) {
discover = new SeekFragment();
transaction.add(R.id.id_content, discover);
} else {
transaction.show(discover);
}
break;
case 2:
if (setting == null) {
setting = new MyFragment();
transaction.add(R.id.id_content, setting);
} else {
transaction.show(setting);
}
break; default:
break;
} transaction.commit();// 提交事务
} private void initEvent() {
mTabEducation.setOnClickListener(this);
mTabFrd.setOnClickListener(this);
mTabSetting.setOnClickListener(this);
mViewPager.setOnPageChangeListener(new OnPageChangeListener() {
@Override
public void onPageSelected(int arg0) {
int currentItem = mViewPager.getCurrentItem();
switch (currentItem) {
case 0:
resetImg();
mEducationImg.setImageResource(R.drawable.tab_bar_01_check);
break;
case 1:
resetImg();
mFrdImg.setImageResource(R.drawable.tab_bar_04_check);
break;
case 2:
resetImg();
mSettingImg.setImageResource(R.drawable.tab_bar_05_check);
default:
break;
}
} @Override
public void onPageScrolled(int arg0, float arg1, int arg2) { } @Override
public void onPageScrollStateChanged(int arg0) { }
});
} /*
* 隐藏所有的Fragment
*/
private void hideFragment(FragmentTransaction transaction) {
if (jurisdiction != null) {
transaction.hide(jurisdiction);
}
if (discover != null) {
transaction.hide(discover);
}
if (setting != null) {
transaction.hide(setting);
}
} /*
* 把所有图片变暗
*/
private void resetImg() {
mEducationImg.setImageResource(R.drawable.tab_bar_01);
mFrdImg.setImageResource(R.drawable.tab_bar_04);
mSettingImg.setImageResource(R.drawable.tab_bar_05);
}
@Override
public boolean onKeyDown(int keyCode, KeyEvent event) { if (keyCode == KeyEvent.KEYCODE_BACK) {
if (System.currentTimeMillis() - lastTime <= 2000) {
finish();
} else {
Toast.makeText(this, "再按一次退出程序", 1000).show();
lastTime = System.currentTimeMillis();
}
return false;
}
return super.onKeyDown(keyCode, event);
}
}
通过以上代码即可实现微信或QQ的那种页面的切换了,具体里面的内容则根据自身情况在相应的fragment中来实现。
下面给一个一个空的Fragment,以此为蓝图,剩余的部分可以在此基础上更改添加。
SeekFragment.java
package com.example.fragment; import com.example.myproject.R; import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
/**
* 查找fragment
* @author admin
*
*/
public class SeekFragment extends Fragment {
private View rootView;
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
if (null == rootView) {
rootView = inflater.inflate(R.layout.fragment_seek, container,
false);
initView(rootView);
}
return rootView;
}
/**
* 用于初始化,具体操作视自己情况而定
* @param rootView
*/
private void initView(View rootView) { }
}