Android组件ViewPagerIndicator学习

写之前，先吐槽两点。

Android Studio真是难搞，下了1.2的版本。先不说内存使劲的飙升，新建一个Application的时候，一直卡，电脑完全不能反应。除了等待个二三十分钟，就只能关电源了。这种情况还不是偶然，导入工程出现问题可以慢慢找原因，改一点修一点。但这种情况完全就是不让玩了。算了，先不理它，继续用Eclipse吧。主要是一些开源的项目用Android Studio来开发，这样给学习带来麻烦。

其中有个ZoomView的开源 项目，没怎么进去看，好像不能很快的搞清。更何况，这个效果自己也可以去实现。算了，过。

ViewPagerIndicator项目的地址在这里，它可以实现多种的形式的内容指示。比如可以运用到图片的播放，引导页的使用，常用的Tab+Viewpager的指示。使用起来还是很容易上手，并且定制不难。项目中自带的例程很好的揭示了用法。自己主要练习了CircleIndicator和TabIndicator这两种。

以CircleIndicator为例：

这是layout中的布局：

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

    <!-- 一开始我设置了高度位0，结果出现了问题 -->
    
    <com.viewpagerindicator.CirclePageIndicator
        android:id="@+id/circle_pager_indicator"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" >
    </com.viewpagerindicator.CirclePageIndicator>

在Activity中也很简单：

		mViewPager = (ViewPager) findViewById(R.id.viewpager);
		mPagerAdapter = new MyFragmentAdapter(getSupportFragmentManager());
		mPageIndicator = (CirclePageIndicator) findViewById(R.id.circle_pager_indicator);
		
		mViewPager.setAdapter(mPagerAdapter);
		mPageIndicator.setViewPager(mViewPager);

而TabIndicator也是很类似，layout中的布局如下：

    <com.viewpagerindicator.TabPageIndicator
        android:id="@+id/tab_indicator"
        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>

在Activity中类似。

其中，设置indicator的样式是在layout中来实现的，比如：

        <activity
            android:name=".TabIndicator"
            android:theme="@style/Theme.PageIndicatorDefaults" >
        </activity>

<resources>
    <style name="Theme.PageIndicatorDefaults" parent="android:Theme">
        <item name="vpiIconPageIndicatorStyle">@style/Widget.IconPageIndicator</item>
        <item name="vpiTabPageIndicatorStyle">@style/Widget.TabPageIndicator</item>
    </style>

    <style name="Widget">
    </style>

    <style name="Widget.TabPageIndicator" parent="Widget">
        <item name="android:gravity">center</item>
        <item name="android:background">@drawable/vpi__tab_indicator</item>
        <item name="android:paddingLeft">22dip</item>
        <item name="android:paddingRight">22dip</item>
        <item name="android:paddingTop">12dp</item>
        <item name="android:paddingBottom">12dp</item>
        <item name="android:textAppearance">@style/TextAppearance.TabPageIndicator</item>
        <item name="android:textSize">12sp</item>
        <item name="android:maxLines">1</item>
    </style>

    <style name="TextAppearance.TabPageIndicator" parent="Widget">
        <item name="android:textStyle">bold</item>
        <item name="android:textColor">@color/vpi__dark_theme</item>
    </style>

    <style name="Widget.IconPageIndicator" parent="Widget">
        <item name="android:layout_marginLeft">6dp</item>
        <item name="android:layout_marginRight">6dp</item>
    </style>
</resources>

当然，如果自己要定制，可以依葫芦画瓢。例子中也提供了一个自己定制的例子。

基本，很快的就能构建好这个主体的UI框架了。

1. 项目地址

2. 源码下载

3. 一些参考（百度，谷歌）