android4.4 Fragment +ViewPager+actionbar 使用

    在app开发中，我们可能会想要这样一个activiy——上面是actionbar，下面是fragment。这样实现的界面往往是要点击actionbar的对应item才能跳到对应的fragment中，但是不能滑动切换，甚是不便。那如何实现滑动切换，这就是这里要讲到的 ，Fragment +ViewPager+actionbar 使用。下面是我在某个界面开发中，实现这个功能的具体步骤：

         1. 首先要特别要注意几个包的引人，否则已一直报错（当时一直报错时，我甚至差点放弃了这个做法），

            正确的组合使用如下：

  import android.support.v13.app.FragmentPagerAdapter;
  import android.support.v4.view.ViewPager;
  import android.support.v4.view.PagerAdapter;
  import android.support.v4.view.ViewPager.OnPageChangeListener;

          2. 建一个viewpager，xml文件代码如下：

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
    </FrameLayout>

           3. 在activity的oncreate方法中获取viewPager，并且增加Adapter，PageChangeListener：

        ViewPager viewPager = (ViewPager) findViewById(R.id.pager);
        viewPager.setAdapter(new ViewPagerAdapter(getFragmentManager()));
        viewPager.setOnPageChangeListener(mPageChangeListener);
        mViewPager = viewPager;</span>

          4. 实现ViewPagerAdapter

public class ViewPagerAdapter extends FragmentPagerAdapter {
     public ViewPagerAdapter(FragmentManager fm) {
         super(fm);
     }

     @Override
     public Fragment getItem(int position) {
         switch (position) {
             case 0:
                 return mNetWorkFragment;//这是滑到第几就显示对应的Fragment
             case 1:
                 return mDeviceFragment;
             case 2:
                 return mPersonFragment;
             case 3:
                 return mMoreFragment;
          }
          return null;
     }

     @Override
     public int getCount() {
         return 4; //这是 Fragment的数量
     }

 }

           5. OnPageChangeListener 的实现

       private OnPageChangeListener mPageChangeListener = new OnPageChangeListener() {
            @Override
            public void onPageScrollStateChanged(int state) {
            }

           @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
            }

            @Override
            public void onPageSelected(int position) {
                mActionBar.setSelectedNavigationItem(position);//这是当viewpager滑到不同的fragment时，actionbar要显示对应的tab
            }

 

         6. actionbar的实例话：

        mActionBar = getActionBar();
        mActionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
        final Tab tab = mActionBar.newTab();
        LayoutInflater inflater = getLayoutInflater();
        View view = inflater.inflate(R.layout.setting_tab_new_ui, null);//setting_tab_new_ui 自定义的tab样式上面是图，下面是字
        ImageView dialView = (ImageView) view.findViewById(R.id.tab_icon);
        if (dialView != null) {
            dialView.setImageResource(R.drawable.tab_network);
        }

        TextView dialText = (TextView) view.findViewById(R.id.tab_text);

        </span>if (dialText != null) {
            dialText.setText(R.string.status_operator);
        }

        tab.setCustomView(view);
        tab.setTabListener(mTabListener);
        mActionBar.addTab(tab);</span>

             7. setting_tab_new_ui 如下：

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

                   <ImageView android:id="@+id/tab_icon"
                       android:layout_width="wrap_content"
                       android:layout_height="wrap_content"
                       android:layout_gravity="center"
                       android:scaleType="centerInside"
                       android:focusable="true"
                   />

                   <TextView
                       android:id="@+id/tab_text"
                       android:layout_width="48dip"
                       android:layout_height="wrap_content"
                       android:layout_gravity="center"
                       android:gravity="center"
                       android:textSize="9sp"
                       android:textColor="@color/tab_text_color_normal_newui"
                       android:singleLine="true"
                       android:ellipsize="end"
                       android:scrollHorizontally="true"
                    />

                 </LinearLayout>

               8. actionbar的监听，TabListener 实现

 

[java] view plain copy