首页 > 代码库 > 使用TabPageIndicator的样式问题
使用TabPageIndicator的样式问题
在使用TabPageIndicator往往会出现一些样式问题,导致看不到字,下面是总结的步骤:
1、布局
<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="atguigu.com.p2pmoney_v1.control.fragment.InvestFragment">
<com.viewpagerindicator.TabPageIndicator
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/invest_tabpageindicator"
>
</com.viewpagerindicator.TabPageIndicator>
<android.support.v4.view.ViewPager
android:id="@+id/vp_invest"
android:layout_width="match_parent"
android:layout_height="match_parent">
</android.support.v4.view.ViewPager>
</LinearLayout>
2、代码
@Bind(R.id.invest_tabpageindicator)
TabPageIndicator investTabpageindicator;//采用BufferKnife绑定布局
@Bind(R.id.vp_invest)
ViewPager vpInvest;
MyPagerAdapter adapter=new MyPagerAdapter(getFragmentManager());
vpInvest.setAdapter(adapter);
investTabpageindicator.setViewPager(vpInvest);
/**
* FragmentStatePagerAdapter:适用于Fragment较多的情况,会适时的销毁已经创建的Fragment
* FragmentPagerAdapter:适用于Fragment不多的情况,不会销毁
*/
class MyPagerAdapter extends FragmentPagerAdapter{
public MyPagerAdapter(FragmentManager fm) {
super(fm);
}
@Override
public Fragment getItem(int position) {
return fragmentList.get(position);
}
@Override
public int getCount() {
return fragmentList==null?0:fragmentList.size();
}
@Override
public CharSequence getPageTitle(int position) {
//从strings.xml中读取String构成的数组
String[] stringArray = UIUtils.getStringArray(R.array.invest_tab);
return stringArray[position];
}
}
3、样式问题
(1)上面的代码运行之后,发现TabIndicator的标签字体背景颜色为白色,看不到字
(2)解决办法:自定义ViewPagerIndicator样式StyledIndicators
将下面的代码复制到styles.xml里面:
<!--自定义viewpagerIndicator样式-->
<style name="StyledIndicators" parent="@android:style/Theme.Light">
<item name="vpiTabPageIndicatorStyle">@style/CustomTabPageIndicator</item>
<item name="android:windowNoTitle">true</item>
</style>
<style name="CustomTabPageIndicator" parent="Widget.TabPageIndicator">
<item name="android:background">@drawable/tab_indicator</item>
<item name="android:textAppearance">@style/CustomTabPageIndicator.Text</item>
<item name="android:textSize">14sp</item>
<item name="android:dividerPadding">8dp</item>
<item name="android:showDividers">middle</item>
<item name="android:paddingLeft">10dp</item>
<item name="android:paddingRight">10dp</item>
<item name="android:fadingEdge">horizontal</item>
<item name="android:fadingEdgeLength">8dp</item>
</style>
<style name="CustomTabPageIndicator.Text" parent="android:TextAppearance.Medium">
<item name="android:typeface">monospace</item>
<item name="android:textColor">@drawable/selector_tabtext</item>
</style>
上面的代码需要用到2个selector,拷贝到drawable目录下:
【selector_tabtext.xml】
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_selected="true" android:color="#EE2C2C"/>
<item android:state_pressed="true" android:color="#EE2C2C"/>
<item android:state_focused="true" android:color="#EE2C2C"/>
<item android:color="@android:color/black"/>
<!--<item>-->
<!--<shape>-->
<!--<gradient ></gradient>-->
<!--</shape>-->
<!--</item>-->
</selector>
【tab_indicator.xml】
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_selected="false" android:state_pressed="false" android:drawable="@android:color/transparent"/>
<item android:state_selected="false" android:state_pressed="true" android:drawable="@android:color/transparent"/>
<item android:state_selected="true" android:state_pressed="false" android:drawable="@color/title_text"/>
<item android:state_selected="true" android:state_pressed="true" android:drawable="@color/title_text"/>
</selector>
4、使用自定义样式StyledIndicators
在注册清单里将application的样式android:theme="@style/AppTheme"修改为:android:theme="@style/StyledIndicators"
5、在加载布局的时候要用Activity而不要用Application,否则上面4步白做了,这是Activity和Application在使用上的一个区别
使用Adapter中初始化convertView时最好使用Activity
View view = View.inflate(getActivity(),getLayoutId(),null);
View view = View.inflate(getActivity().getApplicationContext(),getLayoutId(),null);
另外:在Activity下的Fragment1如果嵌套Fragment2,那么Application的样式没有办法直接作用到Fragment2,在Fragment的加载布局
时候需要使用Activity作为参数,不能用getApplicationContext(),为什么提这点呢?因为很多人使用自定义Application类封装一个全局上下文
,然后只要是遇到上下文参数的,基本上都用这个,其实什么时候用Activity什么时候用getApplicationContext(),还是有很多区别的,需要注意一下。
使用TabPageIndicator的样式问题