ViewPagerIndicator 之TabPageIndicator的简单使用（顺带导库方法）

先蛋疼的描述一下AS导入这个库的艰辛历程吧？搜索了网上各种帖子，花了接近一天的时间，终于找到了一个合适的导入方法吧！~~
1.把库压缩文件下载解压后，把其中的library文件夹复制到随便一个盘，重命名为ViewPagerIndicator
2.然后右击项目–>Module–>Import Eclipse ADT Project–>选择盘里ViewPagerIndicator,一路next到底
3.next到底会发现报错提示：原因是SDK版本不一致。修改即可
4.修改：切换到Project视图：把ViewPagerIndicator中src目录下的build.gradle中的版本号改成和项目中的版本号一致
此外，下面的这句也需要修改： compile ‘com.android.support:support-v4:18.+’
例如你当前的Sdk版本是21，就修改成compile ‘com.android.support:support-v4:21.+’
例如我的，修改完了以后就是这样

然后 Try Again

最后一步应该都懂

搞定~~ 接下来就疯狂的撸吧！

MainActivity代码：

package com.example.lenovo.viewpagerindicator;import android.support.v4.app.Fragment;import android.support.v4.app.FragmentActivity;import android.support.v4.app.FragmentManager;import android.support.v4.app.FragmentPagerAdapter;import android.support.v4.view.ViewPager;import android.os.Bundle;import android.view.View;import android.view.Window;import com.viewpagerindicator.TabPageIndicator;public class MainActivity extends FragmentActivity {    private  String[] title = {"房产","头条","体育","新闻","经济","财经","军事"};    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        requestWindowFeature(Window.FEATURE_NO_TITLE);        setContentView(R.layout.activity_main);        initView();    }    private void initView() {        ViewPager viewpager = (ViewPager) findViewById(R.id.viewpager);        TabPageIndicator indicator = (TabPageIndicator) findViewById(R.id.indicator);        TabAdapter adapter = new TabAdapter(getSupportFragmentManager());        viewpager.setAdapter(adapter);        indicator.setViewPager(viewpager);        //这里是为了清楚TabPageIndicator时报的ViewPager has not been bound异常，先给TabPageIndicator设置android:visibility="gone"        indicator.setVisibility(View.VISIBLE);    }    /**     * 适配器代码     */    class TabAdapter extends FragmentPagerAdapter {        public TabAdapter(FragmentManager fm) {            super(fm);        }        @Override        public Fragment getItem(int position) {            Fragment fragment = new TabFragment();            Bundle args = new Bundle();            args.putString("args",title[position]);            fragment.setArguments(args);            return fragment;        }        @Override        public int getCount() {            return title.length;        }        @Override        public CharSequence getPageTitle(int position) {            return title[position];        }    }}

main_xml代码：

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical"    tools:context="com.example.lenovo.viewpagerindicator.MainActivity">    <com.viewpagerindicator.TabPageIndicator        android:id="@+id/indicator"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:visibility="gone">    </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>

Fragment代码：

package com.example.lenovo.viewpagerindicator;import android.os.Bundle;import android.support.v4.app.Fragment;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import android.widget.TextView;/** * Created by lenovo on 2016/6/14. */public class TabFragment extends Fragment {    @Override    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {        View view = inflater.inflate(R.layout.tab,null);        TextView textView = (TextView) view.findViewById(R.id.textview);        Bundle args = getArguments();        String title = args.getString("args");        textView.setText(title);        return view;    }}

tab_xml代码（很简单，一个父布局居中的TextView）：

<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent">    <TextView        android:id="@+id/textview"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_centerInParent="true"        android:text="hello"        android:textSize="20sp"/></RelativeLayout>

注意：前方高能！！！到此为止，基本上大功告成了，只需要一个indicator的样式就OK了，在values/styles.xml中添加一个样式即可，代码如下

<style parent="Theme.AppCompat.Light.DarkActionBar" name="MyIndicatorColor">        <item name="vpiTabPageIndicatorStyle">@style/MyWidget.TabPageIndicator</item>        <item name="android:windowNoTitle">true</item>        <item name="android:animationDuration">5000</item>        <item name="android:windowContentOverlay">@null</item>    </style>    <style parent="Widget" name="MyWidget.TabPageIndicator">        <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">8dp</item>        <item name="android:paddingBottom">8dp</item>        <item name="android:textAppearance">@style/MyTextAppearance.TabPageIndicator</item>        <item name="android:textSize">16sp</item>        <item name="android:maxLines">1</item>    </style>    <style parent="Widget" name="MyTextAppearance.TabPageIndicator">        <!-- 设置文本字体加粗 -->        <item name="android:textStyle">bold</item>        <!-- 设置文本字体颜色选择器 -->        <item name="android:textColor">@drawable/textcolor</item>    </style>

此外，我设置了一个字体选中时的颜色选择器，代码如下：

<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android">    <item android:color="#969696" android:state_selected="false" android:state_pressed="false" android:state_focused="false"/>    <item android:color="#ff0000" android:state_selected="true" android:state_pressed="false" android:state_focused="false"/>    <!-- Focused states -->    <item android:color="#969696" android:state_selected="false" android:state_pressed="false" android:state_focused="true"/>    <item android:color="#ff0000" android:state_selected="true" android:state_pressed="false" android:state_focused="true"/>    <!-- Pressed -->    <item android:color="#ff0000" android:state_pressed="true"/></selector>

最后一步：在清单文件中设置android:theme=”@style/MyIndicatorColor”
OK~~~，至此已经全部搞定~~