Android Fragment滑动组件ViewPager的实例详解

Android Fragment滑动组件ViewPager的实例详解

1适配器FragmentPagerAdapter的实现

对于FragmentPagerAdapter的派生类，只需要重写getItem(int)和getCount()就可以了。

public class MyFragmentPagerAdapter extends FragmentPagerAdapter {
  private List<Fragment> list;
  public MyFragmentPagerAdapter(FragmentManager fm, List<Fragment> list) {
    super(fm);
    this.list = list;
  }
  //返回了当前要滑动的View的个数
  @Override
  public int getCount() {
    return list.size();
  }
  //在getItem(int arg0)中，根据传来的参数arg0，来返回当前要显示的fragment
  @Override
  public Fragment getItem(int arg0) {
    return list.get(arg0);
  }
}

2两个Fragment类

OrderFragment.java

public class OrderFragment extends Fragment {
  //在onCreateView()中返回要显示的View
  @Override
  public View onCreateView(LayoutInflater inflater, ViewGroup container,
      Bundle savedInstanceState) {
    // TODO Auto-generated method stub
    View view= inflater.inflate(R.layout.fragment_order, container, false);
    //View中控件的操作方法
    refresh = view.findViewById(R.id.order_count_refresh);
    refresh.setOnClickListener(new OnClickListener() {
      @Override
      public void onClick(View v) {
        //操作逻辑
        countStatus();
      }
    });
    return view;
  }
}

fragment_order.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:background="#ffffff"
  android:orientation="vertical" >

  <Button android:id="@+id/fragment1_btn"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="show toast"
    />
</LinearLayout>

MeFragment.java

public class MeFragment extends Fragment {
  //在onCreateView()中返回要显示的View
  @Override
  public View onCreateView(LayoutInflater inflater, ViewGroup container,
      Bundle savedInstanceState) {
    // TODO Auto-generated method stub
    View view= inflater.inflate(R.layout.fragment_me, container, false);
    //View中控件的操作方法
    login = view.findViewById(R.id.me_login);
    login.setOnClickListener(new OnClickListener() {
      @Override
      public void onClick(View v) {
        startActivity(new Intent(MeFragment.this.getActivity(),
            LoginActivity.class));
      }
    });
    return view;
  }
}

fragment_me.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:background="#ffff00"
  android:orientation="vertical" >

</LinearLayout>

3主activity实现

public class MainActivity extends FragmentActivity {
  private ViewPager mPager;
  private List<Fragment> fragmentList;
  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    mPager = (ViewPager) findViewById(R.id.viewpager);
    //初始化fragment
    List<Fragment> fragmentList=new ArrayList<Fragment>();
    fragmentList.add(new OrderFragment());
    fragmentList.add(new MeFragment());
    FragAdapter adapter = new FragAdapter(getSupportFragmentManager(), fragments);

    //给ViewPager设置适配器
    mPager.setAdapter(new MyFragmentPagerAdapter(getSupportFragmentManager(), fragmentList));
    mPager.setCurrentItem(0);// 设置当前显示标签页为第一页
    //MyOnPageChangeListener()是页面变化监听器
    mPager.setOnPageChangeListener(new MyOnPageChangeListener());
    radioGroup = (RadioGroup) findViewById(R.id.main_tab);
    //给radioGroup设置监听器
    radioGroup.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
      @Override
      public void onCheckedChanged(RadioGroup group, int checkedId) {
        if(checkedId == R.id.tab_me){
          mPager.setCurrentItem(INDEX_ME);
        }else if(checkedId == R.id.tab_shoujian){
          mPager.setCurrentItem(INDEX_SHOUJIAN);
        }
      }
    });
  }
  //实现页面变化监听器OnPageChangeListener
  public class MyOnPageChangeListener implements OnPageChangeListener {
    @Override
    //当页面在滑动的时候会调用此方法，在滑动被停止之前，此方法会一直得到调用。
    /**
      * arg0:当前页面，及你点击滑动的页面
      * arg1:当前页面偏移的百分比
      *arg2:当前页面偏移的像素位置
      */
    public void onPageScrolled(int arg0, float arg1, int arg2) {
      // TODO Auto-generated method stub
    }

    @Override
    //当页面状态改变的时候调用
     /**
      * arg0
      * 1:表示正在滑动
      * 2:表示滑动完毕
      * 0:表示什么都没做，就是停在那
      */
    public void onPageScrollStateChanged(int arg0) {
      // TODO Auto-generated method stub
    }

    @Override
    //页面跳转完后调用此方法
    /**
     * arg0是页面跳转完后得到的页面的Position（位置编号）。
     */
    public void onPageSelected(int arg0) {
      // TODO Auto-generated method stub
      switch (arg0) {
      case INDEX_ME:
        radioGroup.check(R.id.tab_me);
        break;
      case INDEX_SHOUJIAN:
        radioGroup.check(R.id.tab_shoujian);
        break;
      }
    }
  }

}

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
 <RelativeLayout
  android:layout_width="fill_parent"
  android:layout_height="fill_parent"
  android:orientation="vertical"
  xmlns:android="http://schemas.android.com/apk/res/android"> 

 <android.support.v4.view.ViewPager
    android:id="@+id/viewpager"
    android:layout_alignParentTop="true"
    android:layout_width="fill_parent"
    android:layout_height="match_parent"
    android:layout_gravity="center"
    android:layout_marginBottom="60dip"
    android:flipInterval="30"
    android:persistentDrawingCache="animation"/> 

  <RadioGroup
    android:id="@+id/main_tab"
    android:orientation="horizontal"
    android:layout_width="fill_parent"
    android:layout_alignParentBottom="true"
    android:layout_height="60dip"> 

    <RadioButton
      style="@style/main_tab"
      android:id="@+id/tab_shoujian"
      <!--图片在文字的上面-->
      android:drawableTop="@drawable/tab_shoujian_selector"
      android:layout_height="match_parent"
      android:checked="true"
      android:text="****" />
    <RadioButton
      style="@style/main_tab"
      android:id="@+id/tab_me"
      android:drawableTop="@drawable/tab_me_selector"
      android:layout_height="match_parent"
      android:text="*" />
  </RadioGroup>
</RelativeLayout>

感谢阅读，希望能帮助到大家，谢谢大家对本站的支持！