简体   繁体   中英

PagerTabStrip title background color

I changed the background color in PagerTabStrip, but the tabs titles have a white background

<android.support.v4.view.ViewPager xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity" >

<android.support.v4.view.PagerTabStrip
    android:id="@+id/pager_tab_strip"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="top"
    android:background="#c9c9c9"
    android:padding="4dp"
    android:textColor="#000000"
    />

where do I change it?

尝试插入以下XML代码:

android:textColor="#<COLOR-CODE>"

Create a resource file if it does not exist (for colors) at res/values/colors.xml with a color having the value you want.

<?xml version="1.0" encoding="utf-8"?>

<resources>
    <color name="tabstrip_bg">#ff6d9850</color>
</resources>

In your layout file (holding respective ViewPager and TabStrip) modify the android:background parameter that refers to above color, as shown below.

<android.support.v4.view.ViewPager
    android:id="@+id/pager_charts"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <android.support.v4.view.PagerTabStrip
        android:id="@+id/pager_header"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="top"
        android:background="@color/tabstrip_bg" />
</android.support.v4.view.ViewPager>

You can do it in code with PagerTabStrip.setDrawFullUnderline(boolean drawFull) .

Here's a post on styling the PagerTabStrip.

http://blog.stylingandroid.com/archives/1378

Update: Looking at the source for PagerTabStrip, it doesn't appear this is possible. The onDraw() method calls to the super class, which draws the text, then PagerTabStrip draws the indicator at the bottom of the view. To change the background of the text that is currently selected you would need to draw the indicator at full height before the text was drawn.

This would require a custom class, probably using the code from PagerTabStrip and it's super class, and customizing the onDraw method for your needs.

The code for onDraw() from PagerTabStrip is below.

@Override
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);

    final int height = getHeight();
    final int bottom = height;
    final int left = mCurrText.getLeft() - mTabPadding;
    final int right = mCurrText.getRight() + mTabPadding;
    final int top = bottom - mIndicatorHeight;

    mTabPaint.setColor(mTabAlpha << 24 | (mIndicatorColor & 0xFFFFFF));
    canvas.drawRect(left, top, right, bottom, mTabPaint);

    if (mDrawFullUnderline) {
        mTabPaint.setColor(0xFF << 24 | (mIndicatorColor & 0xFFFFFF));
        canvas.drawRect(getPaddingLeft(), height - mFullUnderlineHeight,
                getWidth() - getPaddingRight(), height, mTabPaint);
    }
}

只需在分页器标签条java类中将ImageButton背景设置为黑色即可。

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM