AndroidのSlidingTabsBasicのタブの色や区切り線（divider）、インジケーター（indicator）、余白（padding、margin）をカスタマイズする方法

SlidingTabsBasicのタブとタブの中に入るテキスト周りをカスタマイズする方法のメモです。

#indicatorの色と線の幅、dividerの線の縦幅と横幅を変える
```SlidingTabStrip.java
//indicator
private static final int DEFAULT_BOTTOM_BORDER_THICKNESS_DIPS = 2;//底の線の太さ
private static final byte DEFAULT_BOTTOM_BORDER_COLOR_ALPHA = 0x26;
private static final int SELECTED_INDICATOR_THICKNESS_DIPS = 8;//indicatorの太さ
private static final int DEFAULT_SELECTED_INDICATOR_COLOR = 0xFF33B5E5;//色

//divider
private static final int DEFAULT_DIVIDER_THICKNESS_DIPS = 1;//線の太さ（横幅）
private static final byte DEFAULT_DIVIDER_COLOR_ALPHA = 0x20;
private static final float DEFAULT_DIVIDER_HEIGHT = 0.5f;//線の高さ 1.0fで100%の高さ（縦幅）
```
* 各設定値を変えれば変更できます。

#indicatorとdividerの色をsetCustomTabColorizerで変える
```SlidingTabsBasicFragment.java
mSlidingTabLayout.setCustomTabColorizer(new SlidingTabLayout.TabColorizer() {
    @Override
    public int getIndicatorColor(int position) {
        return  SlidingTabsBasicFragment.this.getResources().getColor(R.color.black);
    }
    @Override
    public int getDividerColor(int position) {
        return SlidingTabsBasicFragment.this.getResources().getColor(R.color.white);
    }
});
```
* indicatorは`SlidingTabsBasicFragment`の`mSlidingTabLayout`に`setCustomTabColorizer`しても色を変えられます。

#タブの中のテキストのfontsizeとpadding（左上右上）、テキスト色、背景色を変える
```SlidingTabLayout.java
private static final int TAB_VIEW_PADDING_DIPS = 16;//padding全方向
private static final int TAB_VIEW_TEXT_SIZE_SP = 12;//fontsize

protected TextView createDefaultTabView(Context context) {
    
    /*
    省略
    */
    
    //背景色の設定
    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.HONEYCOMB) {
        // If we're running on Honeycomb or newer, then we can use the Theme's
        // selectableItemBackground to ensure that the View has a pressed state
        TypedValue outValue = new TypedValue();
        getContext().getTheme().resolveAttribute(android.R.attr.selectableItemBackground,outValue, true);
            textView.setBackgroundResource(outValue.resourceId);
    }

    /*
    省略
    */
    
    //paddingの設定
    int padding = (int) (TAB_VIEW_PADDING_DIPS * getResources().getDisplayMetrics().density);
    textView.setPadding(padding, padding, padding, padding);//左上右下の順

    //テキスト色の設定
    textView.setTextColor(getResources().getColor(R.color.white));

    return textView;
}
```
* 余白`TAB_VIEW_PADDING_DIPS`とフォントの大きさは`TAB_VIEW_TEXT_SIZE_SP`で設定できます。
* 各方向でpaddingを変えたい場合は、`createDefaultTabView`の中の`setPadding`しているところに各方向の値を作成して代入します。
* テキストの色を変えたい場合はtextViewに`setTextColor`をセットします。
* 背景色はsetBackgroundResourceのところで設定してあるので、お好みにカスタマイズしたい場合は、上の背景色のところはすべてコメントアウトして、別にbackground.xml（下記）を作って、`textView.setBackgroundResource(R.drawable.background)`してあげれば変更できます。focusの色などを設定すればタップした時に色を変えられます。しかし、これを設定するとindicatorとdividerの上に色をかぶせることになるっぽいので、indicatorと区切り線（divider）が見えなくなります（透過させたらいい感じになるかも）。

```background.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_focused="true" android:drawable="@color/tabfocus"></item>
    <item android:state_selected="true" android:drawable="@color/tabselected"></item>
    <item android:state_pressed="true" android:drawable="@color/tabpressed"></item>
    <item android:state_pressed="false" android:drawable="@color/tab"></item>
</selector>
```

#テキスト（タブ）の外にmarginを入れる
```SlidingTabLayout.java
//タブの外側に余白を入れる
LinearLayout.LayoutParams txtParams = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT);
float margin = getContext().getResources().getDisplayMetrics().density * 2;//2dp
txtParams.setMargins((int)margin, (int)margin, (int)margin, (int)margin);//左,上,右,上

textView.setLayoutParams(txtParams);
//textView.invalidate();//再描画が必要な場合は入れる
```
```fragment_sample.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="match_parent"
    android:orientation="vertical">

    <com.example.android.common.view.SlidingTabLayout
        android:id="@+id/sliding_tabs"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/white" />

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

</LinearLayout>
```

* 余白を単位dpに変換して、最終的に先ほど出てきた上述のtextViewにセットします。
* 何番目のタブと何番目のタブだけ・・・とかに設定したい場合は、`populateTabStrip()`のfor文の中の`tabTitleView`にセットすれば変更できます。
* 空いた隙間の色は、`com.example.android.common.view.SlidingTabLayout`に`android:background="@color/white"`を入れると良いです。dividerとindicatorなどが少し見える場合があるので、その時は線の幅を0にしておけば見えなくなります。

#SlidingTabsBasicのサンプルダウンロード
Android Developers - SlidingTabsBasic
[http://developer.android.com/samples/SlidingTabsBasic/index.html](http://developer.android.com/samples/SlidingTabsBasic/index.html)