一个炫酷的 TabLayout 与 CoordinatorLayout 相结合的自定义控件

CoordinatorTabLayout

项目地址：hugeterry/CoordinatorTabLayout

简介：一个炫酷的 TabLayout 与 CoordinatorLayout 相结合的自定义控件

更多：作者   提 Bug   示例 APK   

标签：

自定义控件-TabLayout-CoordinatorLayout-

 

中文版文档

CoordinatorTabLayout is a custom composite control that quickly implements the combination of TabLayout and CoordinatorLayout. Inherited to the CoordinatorLayout, in the following components used CollapsingToolbarLayout contains TabLayout.

Usage

Step 1

Add the following to your build.gradle:

dependencies {    compile 'cn.hugeterry.coordinatortablayout:coordinatortablayout:1.1.0'}

Step 2

Config in xml:

<cn.hugeterry.coordinatortablayout.CoordinatorTabLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:app="http://schemas.android.com/apk/res-auto"    android:id="@+id/coordinatortablayout"    android:layout_width="match_parent"    android:layout_height="match_parent">    <android.support.v4.view.ViewPager        android:id="@+id/vp"        android:layout_width="match_parent"        android:layout_height="match_parent"        app:layout_behavior="@string/appbar_scrolling_view_behavior" /></cn.hugeterry.coordinatortablayout.CoordinatorTabLayout>

Step 3

Use it in your own code:
1.setTitle(String title):Set the CoordinatorTabLayout's title.
2.setupWithViewPager(ViewPager viewPager):To link the two together.
3.setImageArray(int[] imageArray):Set the image array of the header according to the number of tabs and pass it to the control.

        //Add the fragment to the viewpager        initFragments();        initViewPager();        //Image array        mImageArray = new int[]{                R.mipmap.bg_android,                R.mipmap.bg_ios,                R.mipmap.bg_js,                R.mipmap.bg_other};        mCoordinatorTabLayout = (CoordinatorTabLayout) findViewById(R.id.coordinatortablayout);        mCoordinatorTabLayout.setTitle("Demo")                .setImageArray(mImageArray)                .setupWithViewPager(mViewPager);

Finish, enjoy it.

More

Set the content scrim

setImageArray(int[] imageArray, int[] colorArray):Set the color array to use for the content scrim for each tab.

        mColorArray = new int[]{                android.R.color.holo_blue_light,                android.R.color.holo_red_light,                android.R.color.holo_orange_light,                android.R.color.holo_green_light};        mCoordinatorTabLayout.setImageArray(mImageArray, mColorArray);

Set translucent status bar

setTransulcentStatusBar(Activity activity):Set translucent status bar,Support android4.4 and above.

mCoordinatorTabLayout.setTransulcentStatusBar(activity);

Set back enable

setBackEnable(Boolean canBack):To enable the Up button for an activity that has a parent activity.

    @Override    protected void onCreate(Bundle savedInstanceState) {        ...        mCoordinatorTabLayout.setBackEnable(true);        ...    }    @Override    public boolean onOptionsItemSelected(MenuItem item) {        if (item.getItemId() == android.R.id.home) {            finish();        }        return super.onOptionsItemSelected(item);    }

Load header images from network

setLoadHeaderImagesListener(LoadHeaderImagesListener loadHeaderImagesListener):Set the listener that gets the header images.

    @Override    protected void onCreate(Bundle savedInstanceState) {        ...        mCoordinatorTabLayout.setTitle("Demo")                .setBackEnable(true)                .setContentScrimColorArray(mColorArray)                .setLoadHeaderImagesListener(new LoadHeaderImagesListener() {                    @Override                    public void loadHeaderImages(ImageView imageView, TabLayout.Tab tab) {                        switch (tab.getPosition()) {                            case 0:                                //load header images                                break;                            ...                        }                    }                })                .setupWithViewPager(mViewPager);    }

You also can load header images using glide/picasso，Sample

Gets the child control

getActionBar():get the ActionBar
getTabLayout():get the TabLayout
getImageView():get the ImageView

More code

Attributes

• app:contentScrim -> color.Defaults to ?attr/colorPrimary
• app:tabIndicatorColor -> color.
• app:tabTextColor -> color.

Demo

http://fir.im/ctlayout

LICENSE