Android 之ViewPagerIndicator框架的引用及样式的修改

1.导入的工作就不多说了，相信大伙都是老手中的战斗机了。
在这里插入图片描述

2.启动ViewPagerIndicator的模板应用，寻找你想要的功能

在这里插入图片描述

看完想要的功能，就去寻找相应的类。

在这里插入图片描述
在ViewPagerIndicator 找到TabsDefault这个类，看看源码了解一下

public class SampleTabsDefault extends FragmentActivity {
    private static final String[] CONTENT = new String[] { "Recent", "Artists", "Albums", "Songs", "Playlists", "Genres" };

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.simple_tabs);

        FragmentPagerAdapter adapter = new GoogleMusicAdapter(getSupportFragmentManager());

        ViewPager pager = (ViewPager)findViewById(R.id.pager);
        pager.setAdapter(adapter);

        TabPageIndicator indicator = (TabPageIndicator)findViewById(R.id.indicator);
        indicator.setViewPager(pager);
    }

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

        @Override
        public Fragment getItem(int position) {
            return TestFragment.newInstance(CONTENT[position % CONTENT.length]);
        }

        @Override
        public CharSequence getPageTitle(int position) {
            return CONTENT[position % CONTENT.length].toUpperCase();
        }

        @Override
        public int getCount() {
          return CONTENT.length;
        }
    }
}

ViewPagerIndicator在Github中也有使用方法可以查看。
在这里插入图片描述

3.了解完基础的用法后，就可以开始我们的ViewPagerIndicator的引用之旅了

<?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">

    <com.viewpagerindicator.TabPageIndicator
        android:id="@+id/tabPageIndicator"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

    </com.viewpagerindicator.TabPageIndicator>

    <android.support.v4.view.ViewPager
        android:id="@+id/viewpager"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1">

    </android.support.v4.view.ViewPager>
</LinearLayout>

        //设置Viewpager的适配器
        viewPager.setAdapter(new MyNewsMenuDeatailPagerAdapter());

        //ViewPager和TabPagerIndicator关联
        tabPageIndicator.setViewPager(viewPager);

其实很简单，只要在布局中创建TabPagerIndicator控件，再viewpager设置适配器后，再使用控件的实例去使用“ .setViewPager ”这方法。

    class MyNewsMenuDeatailPagerAdapter extends PagerAdapter {
       @Override
        public CharSequence getPageTitle(int position) {
            return children.get(position).getTitle();
        }
        
        .............此处省略该适配器中其他方法
					
}

重写 PagerAdapter 中的 getPageTile( )这个方法，方法相应的数据，就成了。

在这里插入图片描述

4.修改TabPageIndicator的样式
找到ViewPagerIndicator库中清单文件对应的类那一部分

        <activity
            android:name=".SampleTabsDefault"
            android:label="Tabs/Default"
            android:theme="@style/Theme.PageIndicatorDefaults">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="com.jakewharton.android.viewpagerindicator.sample.SAMPLE" />
            </intent-filter>
        </activity>

我只需要android:theme="@style/Theme.PageIndicatorDefaults"这一条去替换或添加到原来app的功能清单中的android:theme就大功告成了。

在这里插入图片描述

在布局中设置android:background="@android:color/white"背景为白
再找到android:theme="@style/Theme.PageIndicatorDefaults"这个主题的xml文件，设置一个字体的选择器。

大功告成！！！！！
在这里插入图片描述

Android 之ViewPagerIndicator框架的引用及样式的修改

猜你喜欢