如何动态地更改Viewpager标签的颜色?颜色、标签、动态、Viewpager

2023-09-12 02:21:47 作者:爲伱√剃度

如何改变这样的标签的颜色?当我点击/滑动绿色或任何其它标签,标签颜色应更改为相应的颜色和其他选项卡的颜色剩下的应该改为黑色。我怎样才能做到这一点?即时通讯使用Viewpager。

How to change colour of Tabs like this? When I click/swipe to green or any other tab, the tab colour should change to that appropriate colour and rest of other tabs colour should change to black. How can I do this? Im using Viewpager.

我想里面onpagelistener这code:

I tried this code inside onpagelistener:

  if(position == 0) {
                   viewpager.getChildAt(position).setBackgroundColour(getResources().getcolor(R.color.red);
         }        
  else if(position == 1) { 
                   viewpager.getChildAt(position).setBackgroundColour(getResources().getcolor(R.color.green);
         }

但上面的code没有任何影响。

But above code has no effect.

和使用即时通讯这个code:的 Android的Viewpager教程Androidhive

And Im using this code : Android Viewpager tutorial Androidhive

推荐答案

有教程的样式选项卡,在Android操作栏。你可以选择你的父主题 Theme.Holo 的API> = 3或主题.AppCompat 支持库V7等。

There is tutorial Styling tabs in the Android action bar. You can choose your parent theme as Theme.Holo for API>=3, or Theme.AppCompat for support library V7, etc.

除此之外,对于<项目名称=机器人:背景> ,你可以将其设置为您创建选项卡状态变化的选择:

And besides, for <item name="android:background">, you could set it to a selector you create for tab state change:

android:background="@drawable/selector_tab"

有关 selector_tab 可以是这样的:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="@color/pressed_color"
       android:state_pressed="true" />
    <item android:color="@color/selected_color"
       android:state_selected="true" /> 

    <item android:color="@color/normal_color" />
</selector>

[更新]

[UPDATE]

有关变更标签颜色动态,建议使用带有标签的自定义视图:

For change tab color dynamically, suggest to use custom view with tab:

//your_custom_tab.xml
<?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="wrap_content"
  >


  <TextView
    android:id="@+id/tab_name"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="center_horizontal"
    android:maxLines="1" />

</LinearLayout>

LinearLayout customView = (LinearLayout) getLayoutInflater().inflate(R.layout.your_custom_tab, null);

然后 setCustomeView(customView)增加标签,动作条。而在你的选项卡/页变化监听器:

then setCustomeView(customView) when add tab to ActionBar. And in your tab/page change listener:

Tab selectedTab = yourActionBar.getSelectedTab();
View tabView = selectedTab.getCustomView();
tabView.setBackgroundColor(your_select_color);  

要除去周围的标签可能差距所造成的自定义视图,可以设置标签的风格:

To remove possible gap around tab caused by custom view, you can set tab style:

<style name="ActionBarTabStyle" parent="@android:style/Widget.AppCompat.Light.ActionBar.TabView">
   <item name="android:paddingLeft">0dp</item>
   <item name="android:paddingRight">0dp</item>
   <item name="android:paddingTop">0dp</item>
   <item name="android:paddingBottom">0dp</item>
</style>

和相应地使用你的主题父母。

and use your theme parent accordingly.

希望这有助于!