Fragment点击和滑动切换页面
转载请标明出处：http://blog.csdn.net/wu_wxc/article/details/48163203
本文出自【吴孝城的CSDN博客】
需要编辑到的文件如下
activity_main.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="@+id/id_page1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:text="页卡一"
android:textSize="18sp"
android:layout_weight="1"/>
<TextView
android:id="@+id/id_page2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:text="页卡二"
android:textSize="18sp"
android:layout_weight="1"/>
<TextView
android:id="@+id/id_page3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:text="页卡三"
android:textSize="18sp"
android:layout_weight="1"/>
</LinearLayout>
<View
android:id="@+id/id_bar"
android:layout_width="match_parent"
android:layout_height="3dp"
android:background="#77A0DD"/>
<include layout="@layout/line"/>
<android.support.v4.view.ViewPager
android:id="@+id/id_viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:flipInterval="30"
android:persistentDrawingCache="animation"/>
</LinearLayout>
line.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="2dp"
android:background="#E6E6E6">
</LinearLayout>
pager_one.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:gravity="center">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="页卡一"
android:textSize="30sp"/>
</LinearLayout>
然后是Java程序代码
MainActivity.java
package cn.wuxiaocheng.fragment;
import java.util.ArrayList;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.util.DisplayMetrics;
import android.view.Display;
import android.view.View;
import android.widget.LinearLayout;
import android.widget.LinearLayout.LayoutParams;
import android.widget.TextView;
public class MainActivity extends FragmentActivity {
private ArrayList<Fragment> fragmentlist;
private ViewPager mviewpager;
private View viewbar;
private int currIndex;//当前页卡编号
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();
initBar();
InitViewPager();
}
//初始化标签
private void initView() {
TextView pager1 = (TextView) findViewById(R.id.id_page1);
TextView pager2 = (TextView) findViewById(R.id.id_page2);
TextView pager3 = (TextView) findViewById(R.id.id_page3);
pager1.setOnClickListener(new txListner(0));
pager2.setOnClickListener(new txListner(1));
pager3.setOnClickListener(new txListner(2));
}
//监听页面切换
private class txListner implements View.OnClickListener {
private int index = 0;
public txListner (int i){
index = i;
}
public void onClick(View v){
mviewpager.setCurrentItem(index);
}
}
//页面切换时滚动条移动
public void initBar() {
viewbar = (View) super.findViewById(R.id.id_bar);
Display display = getWindow().getWindowManager().getDefaultDisplay();
// 得到显示屏宽度
DisplayMetrics metrics = new DisplayMetrics();
display.getMetrics(metrics);
// 设置滚动条宽度为屏幕宽度的1/3
int tabLineLength = metrics.widthPixels / 3;
LayoutParams lp = (LayoutParams) viewbar.getLayoutParams();
lp.width = tabLineLength;
viewbar.setLayoutParams(lp);
}
/*
* 初始化ViewPager
*/
public void InitViewPager(){
mviewpager = (ViewPager)findViewById(R.id.id_viewpager);
fragmentlist = new ArrayList<Fragment>();
Fragment OneFragment = new OneFragment();
Fragment TwoFragment = new TwoFragment();
Fragment ThreeFragment = new ThreeFragment();
fragmentlist.add(OneFragment);
fragmentlist.add(TwoFragment);
fragmentlist.add(ThreeFragment);
//给ViewPager设置适配器
mviewpager.setAdapter(new MyFragmentPagerAdapter(getSupportFragmentManager(), fragmentlist));
mviewpager.setCurrentItem(0);//设置当前显示标签页为第一页
mviewpager.setOnPageChangeListener(new MyOnPageChangeListener());//页面变化时的监听器
}
public class MyOnPageChangeListener implements OnPageChangeListener {
@Override
public void onPageScrolled(int arg0, float arg1, int arg2) {
// TODO Auto-generated method stub
// 取得该控件的实例
LinearLayout.LayoutParams ll = (android.widget.LinearLayout.LayoutParams) viewbar.getLayoutParams();
if(currIndex == arg0){
ll.leftMargin = (int) (currIndex * viewbar.getWidth() + arg1
* viewbar.getWidth());
}else if(currIndex > arg0){
ll.leftMargin = (int) (currIndex * viewbar.getWidth() - (1 - arg1)* viewbar.getWidth());
}
viewbar.setLayoutParams(ll);
}
@Override
public void onPageScrollStateChanged(int arg0) {
// TODO Auto-generated method stub
}
@Override
public void onPageSelected(int arg0) {
currIndex = arg0;
}
}
}
MyFragmentPagerAdapter.java
package cn.wuxiaocheng.fragment;
import java.util.ArrayList;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
public class MyFragmentPagerAdapter extends FragmentPagerAdapter{
ArrayList<Fragment> list;
public MyFragmentPagerAdapter (FragmentManager fm, ArrayList<Fragment> list){
super(fm);
this.list = list;
}
//获得也没总个数
@Override
public int getCount() {
return list.size();
}
//得到每个页面
@Override
public Fragment getItem(int arg0) {
return list.get(arg0);
}
}
三个activity代码这只发一个，
OneFragment.java
package cn.wuxiaocheng.fragment;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
public class OneFragment extends Fragment {
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.pager_one,null);
return view;
}
}
Fragment用的是v4的包。别导错
效果如下图
源码