更改所选选项卡中的文本颜色
Change text color in selected tab
我的应用程序中的选项卡有问题。当我 select 一个选项卡时,我想更改它的图标和文本颜色。当我切换到另一个选项卡时,图标和文本颜色需要更改为中性色。
我试过这样做,但虽然图标确实发生了变化,但文本颜色保持不变。
final TabLayout tabs = (TabLayout) findViewById(R.id.tabs);
tabs.addTab(tabs.newTab().setIcon(R.mipmap.destacados_act).setText("Destacados"));
tabs.setSelectedTabIndicatorColor(Color.rgb(255,170,0));
tabs.addTab(tabs.newTab().setIcon(R.mipmap.secciones).setText("Secciones"));
tabs.addTab(tabs.newTab().setIcon(R.mipmap.descargas).setText("Descargas"));
final ViewPager view_pager = (ViewPager) findViewById(R.id.pager);
final ViewPagerAdapterPrincipal adapter = new ViewPagerAdapterPrincipal(getSupportFragmentManager(), tabs.getTabCount());
view_pager.setAdapter(adapter);
view_pager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(tabs));
tabs.addOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
@Override
public void onTabSelected(TabLayout.Tab tab) {
view_pager.setCurrentItem(tab.getPosition());
switch (tab.getPosition()) {
case 0:
tab.setIcon(R.mipmap.destacados_act);
tabs.setSelectedTabIndicatorColor(Color.rgb(255,170,0));
break;
case 1:
tab.setIcon(R.mipmap.secciones_act);
tabs.setSelectedTabIndicatorColor(Color.rgb(0,255,255));
break;
case 2:
tab.setIcon(R.mipmap.descargas_act);
tabs.setSelectedTabIndicatorColor(Color.rgb(170,255,0));
break;
}
}
public void onTabUnselected(TabLayout.Tab tab) {
switch (tab.getPosition()) {
case 0:
tab.setIcon(R.mipmap.destacados);
break;
case 1:
tab.setIcon(R.mipmap.secciones);
break;
case 2:
tab.setIcon(R.mipmap.descargas);
break;
}
}
public void onTabReselected(TabLayout.Tab tab) {
}
});
这是我的适配器代码
public class ViewPagerAdapterPrincipal extends FragmentStatePagerAdapter {
int numOfTabs;
public ViewPagerAdapterPrincipal(FragmentManager fm, int numOfTabs) {
super(fm);
this.numOfTabs = numOfTabs;
}
public Fragment getItem(int position) {
switch(position){
case 0 :
DestacadosPrincipal tab1 = new DestacadosPrincipal();
return tab1;
case 1 :
Secciones tab2 = new Secciones();
return tab2;
case 2 :
Descargas tab3 = new Descargas();
return tab3;
default:
return null;
}
}
public int getCount() {
return numOfTabs;
}
}
问题来了
OnTabUnselected
如果我删除
tab.setIcon();
文字颜色没问题,但明显图标没变。
您可以使用选择器为选项卡上的 TextView 设置样式
这假设您使用了自定义选项卡布局,其中包含带有 style="@style/tabText" 的 TextView。
values/styles.xml
<style name="tabText">
<item name="android:textColor">@drawable/text_selector_tab</item>
<item name="android:textSize">@dimen/fontTab</item>
<item name="android:textAllCaps">true</item>
</style>
然后使用选择器设置文本颜色:
drawable/text_selector_tab.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="@color/colorSelected" />
<item android:color="@color/colorDeselected" />
</selector>
然后为选中和未选中状态设置颜色属性(即此处显示为 colorSelected 和 colorDeselected。
您可以使用自定义布局自定义选项卡:
layoutTab = (LinearLayout)inflater.inflate(R.layout.layout_tab, null);
TabLayout.Tab tab = mTabLayout.newTab();
tab.setCustomView(layoutTab);
mTabLayout.addTab(tabHome);
layout/layout_tab.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="match_parent"
android:layout_width="wrap_content"
android:orientation="horizontal"
android:gravity="center"
android:clipToPadding="false">
<TextView
android:id="@+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
style="@style/tabText" />
</LinearLayout>
这就是选项卡中的 TextView 与样式相关联的方式。您可以深入研究平台 SDK 中的标准选项卡布局 XML,了解图标和文本的工作原理并相应地调整此布局。
我的应用程序中的选项卡有问题。当我 select 一个选项卡时,我想更改它的图标和文本颜色。当我切换到另一个选项卡时,图标和文本颜色需要更改为中性色。
我试过这样做,但虽然图标确实发生了变化,但文本颜色保持不变。
final TabLayout tabs = (TabLayout) findViewById(R.id.tabs);
tabs.addTab(tabs.newTab().setIcon(R.mipmap.destacados_act).setText("Destacados"));
tabs.setSelectedTabIndicatorColor(Color.rgb(255,170,0));
tabs.addTab(tabs.newTab().setIcon(R.mipmap.secciones).setText("Secciones"));
tabs.addTab(tabs.newTab().setIcon(R.mipmap.descargas).setText("Descargas"));
final ViewPager view_pager = (ViewPager) findViewById(R.id.pager);
final ViewPagerAdapterPrincipal adapter = new ViewPagerAdapterPrincipal(getSupportFragmentManager(), tabs.getTabCount());
view_pager.setAdapter(adapter);
view_pager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(tabs));
tabs.addOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
@Override
public void onTabSelected(TabLayout.Tab tab) {
view_pager.setCurrentItem(tab.getPosition());
switch (tab.getPosition()) {
case 0:
tab.setIcon(R.mipmap.destacados_act);
tabs.setSelectedTabIndicatorColor(Color.rgb(255,170,0));
break;
case 1:
tab.setIcon(R.mipmap.secciones_act);
tabs.setSelectedTabIndicatorColor(Color.rgb(0,255,255));
break;
case 2:
tab.setIcon(R.mipmap.descargas_act);
tabs.setSelectedTabIndicatorColor(Color.rgb(170,255,0));
break;
}
}
public void onTabUnselected(TabLayout.Tab tab) {
switch (tab.getPosition()) {
case 0:
tab.setIcon(R.mipmap.destacados);
break;
case 1:
tab.setIcon(R.mipmap.secciones);
break;
case 2:
tab.setIcon(R.mipmap.descargas);
break;
}
}
public void onTabReselected(TabLayout.Tab tab) {
}
});
这是我的适配器代码
public class ViewPagerAdapterPrincipal extends FragmentStatePagerAdapter {
int numOfTabs;
public ViewPagerAdapterPrincipal(FragmentManager fm, int numOfTabs) {
super(fm);
this.numOfTabs = numOfTabs;
}
public Fragment getItem(int position) {
switch(position){
case 0 :
DestacadosPrincipal tab1 = new DestacadosPrincipal();
return tab1;
case 1 :
Secciones tab2 = new Secciones();
return tab2;
case 2 :
Descargas tab3 = new Descargas();
return tab3;
default:
return null;
}
}
public int getCount() {
return numOfTabs;
}
}
问题来了
OnTabUnselected
如果我删除
tab.setIcon();
文字颜色没问题,但明显图标没变。
您可以使用选择器为选项卡上的 TextView 设置样式
这假设您使用了自定义选项卡布局,其中包含带有 style="@style/tabText" 的 TextView。
values/styles.xml
<style name="tabText">
<item name="android:textColor">@drawable/text_selector_tab</item>
<item name="android:textSize">@dimen/fontTab</item>
<item name="android:textAllCaps">true</item>
</style>
然后使用选择器设置文本颜色:
drawable/text_selector_tab.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="@color/colorSelected" />
<item android:color="@color/colorDeselected" />
</selector>
然后为选中和未选中状态设置颜色属性(即此处显示为 colorSelected 和 colorDeselected。
您可以使用自定义布局自定义选项卡:
layoutTab = (LinearLayout)inflater.inflate(R.layout.layout_tab, null);
TabLayout.Tab tab = mTabLayout.newTab();
tab.setCustomView(layoutTab);
mTabLayout.addTab(tabHome);
layout/layout_tab.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="match_parent"
android:layout_width="wrap_content"
android:orientation="horizontal"
android:gravity="center"
android:clipToPadding="false">
<TextView
android:id="@+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
style="@style/tabText" />
</LinearLayout>
这就是选项卡中的 TextView 与样式相关联的方式。您可以深入研究平台 SDK 中的标准选项卡布局 XML,了解图标和文本的工作原理并相应地调整此布局。