如何改变SlidingTabLayout的文字颜色？

I made an application which use the ActionBarCompat

我创建了一个使用ActionBarCompat的应用程序

I created the tabs using the SlidingTabLayout class.

我使用SlidingTabLayout类创建了选项卡。

the class is this:

这个班是这样的:

SlidingTabLayout.java

but I can not change the color of the tabs...

但我不能改变标签的颜色......

my viewpager fragment is this:

我的viewpager片段是这样的:

<swmovil.fyb.SlidingTabLayout
    android:id="@+id/mTabs"
    android:layout_width="match_parent"
    android:layout_height="48dip" />

<android.support.v4.view.ViewPager
    android:id="@+id/mPager"
    android:layout_width="match_parent"
    android:layout_height="0px"
    android:layout_weight="1"
    android:background="@color/white" />

the application works great, but i can´t change the color text of the tabs...

应用程序工作得很好,但我无法更改选项卡的颜色文本...

I made the application after seeing the following example:

我看了下面的例子后做了一个应用程序:

rudsonlive/Navigation-Drawer-ViewPager-ActionBarCompat

How can i change the text color of the tabs text ?

如何更改选项卡文本的文本颜色?

thanks !!!

8 个解决方案

#1

1) First of all create color folder under res (/res/color)
2) create xml file selector.xml under /res/color folder

1)首先在res(/ res / color)下创建颜色文件夹2)在/ res / color文件夹下创建xml文件selector.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="@android:color/white" />
<item android:state_focused="true" android:color="@android:color/white" />
<item android:state_pressed="true" android:color="@android:color/white" />
<item android:color="#504f4f" /> 
</selector> 

3) Then in the populateTabStrip() method in SlidingTabLayout put this

3)然后在SlidingTabLayout的populateTabStrip()方法中放入此

tabTitleView.setTextColor(getResources().getColorStateList(R.color.selector));

now you have a selector and you can change the color of the text on any event you want

现在你有了一个选择器,你可以在你想要的任何事件上改变文本的颜色

if that is not working add the following lines of code.
a) in populateTabStrip() method at the end add this

如果不起作用,请添加以下代码行。 a)在populateTabStrip()方法的末尾加上这个

if (i == mViewPager.getCurrentItem()) {
    tabView.setSelected(true);
}

and b) change the onPageSelected() method to this

和b)将onPageSelected()方法更改为此方法

    @Override
    public void onPageSelected(int position) {
        if (mScrollState == ViewPager.SCROLL_STATE_IDLE) {
            mTabStrip.onViewPagerPageChanged(position, 0f);
            scrollToTab(position, 0);
        }
        for (int i = 0; i < mTabStrip.getChildCount(); i++) {
            mTabStrip.getChildAt(i).setSelected(position == i);
        }
        if (mViewPagerPageChangeListener != null) {
            mViewPagerPageChangeListener.onPageSelected(position);
        }
    }    

#2

Open your file SlidingTabLayout.java (the default one from Google IO) and find the function populateTabStrip() , then after this code

打开文件SlidingTabLayout.java(来自Google IO的默认文件)并找到函数populateTabStrip(),然后在此代码之后

mTabStrip.addView(tabView);
        if (i == mViewPager.getCurrentItem()) {
            tabView.setSelected(true);
        }

add the following line:

添加以下行:

int color = ContextCompat.getColor(tabView.getContext(), R.color.grey);
tabTitleView.setTextColor(color);

Replace R.color.grey with your preferred color.

用您喜欢的颜色替换R.color.grey。

#3

You should be able to see the TextView the class is using.

您应该能够看到该类正在使用的TextView。

tabTitleView.setTextColor(getResources().getColor(R.color.white));

In my class, the TextView was tabTitleView. If you are using the default example provided by Google, you will find it under populateTabStrip function.

在我的课堂上,TextView是tabTitleView。如果您使用的是Google提供的默认示例,则可以在populateTabStrip函数下找到它。

#4

copy code of slidingtablayout and slidingtabstrip and put it in a java file.then make a customtab_title.xml in your layout folder and a selector.xml file in your drawable folder. `

复制slidingtablayout和slidingtabstrip的代码并将其放在java文件中。然后在layout文件夹中创建customtab_title.xml,在drawable文件夹中创建一个selector.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"
           android:orientation="horizontal"
           android:padding="10dp"
   >


<TextView
    android:id="@+id/textView2"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="New Text"
    android:textColor="@drawable/slidingtab_title_color"/>


</LinearLayout>

selector.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/unpressed" />
    <item android:state_focused="true" android:color="@color/unpressed" />
    <item android:state_pressed="true" android:color="@color/unpressed" />
    <item android:color="@android:color/black" />
</selector> 

And in your mainactivity or where u r showing your tabs add one line of code - tabs.setCustomTabView(R.layout.customtab_title, R.id.textView2);

在你的主要活动或你显示你的标签的地方添加一行代码 - tabs.setCustomTabView(R.layout.customtab_title,R.id.textView2);

here tabs is slidingtablayout tabs;

这里的标签是slidingtablayout标签;

to change indicator color add - tabs.setSelectedIndicatorColors(getResources().getColor(R.color.unpressed));

更改指示符颜色添加 - tabs.setSelectedIndicatorColors(getResources()。getColor(R.color.unpressed));

#5

   @Override
    public void onPageSelected(int position) {

for (int i = 0; i < mTabStrip.getChildCount(); i++) {

  TextView tv = (TextView) mTabStrip.getChildAt(i);
 if (i==position)
  tv.setTextColor(getResources().getColorStateList(R.color.white));
 else                             
  tv.setTextColor(getResources().getColorStateList(R.color.tab_text_color));

        }

this may be help you

这可能会对你有所帮助

#6

Unfortunately this class doesn't support customizing the tab text color without editing the code and always uses the default text color of the theme. You'll have to patch the class to allow setting the tabs text color by code or by style attribute. One alternative is to use the PagerSlidingTabStrip library.

不幸的是,这个类不支持自定义选项卡文本颜色而不编辑代码,并且始终使用主题的默认文本颜色。您必须修补该类以允许按代码或样式属性设置选项卡文本颜色。另一种方法是使用PagerSlidingTabStrip库。

#7

Looking at the code for the SlidingTabLayout...You can set a custom tab view, which allows you to control the content of the tab and set a custom tab text color. Have a look at slidingTabLayout.setCustomTabView(int layoutResId, int textViewId).

查看SlidingTabLayout的代码...您可以设置自定义选项卡视图,该视图允许您控制选项卡的内容并设置自定义选项卡文本颜色。看一下slidingTabLayout.setCustomTabView(int layoutResId,int textViewId)。

#8

I use Panayiotis Irakleous solution but I think it is better to avoid looping part in onPageSelected procedure.

我使用Panayiotis Irakleous解决方案,但我认为最好避免在onPageSelected过程中循环部分。

The steps are the same, you need to add an int class member (example: mCurrentTabIndex) to save current tab index.

步骤相同,您需要添加一个int类成员(例如:mCurrentTabIndex)来保存当前选项卡索引。

In steps 3.a, you need to add

在步骤3.a中,您需要添加

mCurrentTabIndex = i;

So it will be like this:

所以它会是这样的:

if (i == mViewPager.getCurrentItem()) {
    tabView.setSelected(true);
    mCurrentTabIndex = i;
}

Last, in steps 3.b, replace the looping part to this:

最后,在步骤3.b中,将循环部分替换为:

mTabStrip.getChildAt(mCurrentTabIndex).setSelected(false);
mTabStrip.getChildAt(position).setSelected(true);
mCurrentTabIndex = position;

So the code will be like this:

所以代码将是这样的:

@Override
public void onPageSelected(int position) {
    if (mScrollState == ViewPager.SCROLL_STATE_IDLE) {
        mTabStrip.onViewPagerPageChanged(position, 0f);
        scrollToTab(position, 0);
    }

    mTabStrip.getChildAt(mCurrentTabIndex).setSelected(false);
    mTabStrip.getChildAt(position).setSelected(true);
    mCurrentTabIndex = position;

    if (mViewPagerPageChangeListener != null) {
        mViewPagerPageChangeListener.onPageSelected(position);
    }
}