TabLayout

Tablayout是什么


Tablayout

Tablayout的使用

1.首先必须导入谷歌的依赖包


Material design设计模式

2. 创建布局(2种方式)

I.在 Xml 文件里创建 (静态创建)

< android.support.design.widget.TabLayout

     android:id="@+id/tabLayout"

     android:layout_width="match_parent"

     android:layout_height="wrap_content" >

     < android.support.design.widget.TabItem

          android:layout_width="wrap_content"

          android:layout_height="wrap_content"

            android:text="新闻"/>

     < android.support.design.widget.TabItem

          android:layout_width="wrap_content"

          android:layout_height="wrap_content"

          android:text="娱乐"/>

</android.support.design.widget.TabLayout>

II.在代码里创建 (动态创建)

tabLayout= (TabLayout) findViewById(R.id.tabLayout);

tabLayout.addTab(tabLayout.newTab().setText("新闻"));

tabLayout.addTab(tabLayout.newTab().setText("娱乐"));

tabLayout.addTab(tabLayout.newTab().setText("军事"));

tabLayout.addTab(tabLayout.newTab().setText("生活"));

Tablayout的属性

app:tabMod    设置Tab模式

fixed :固定模式,无法滑动,每个选项卡平均分配空间,适合较少Tab选项卡的情况,当选项卡较多时,会出现每个选项卡内容无法显示完整的情况,请大家大家根据情况选择。

scrollable:滑动模式,向左对齐,如今日头条,网易新闻就是scrollable,但是在Tab选项卡较少时会无法填满TabLayout栏。

app:tabTextAppearance   改变字体大小

本来以为可以直接设置 sp,结果不行,只能调用 style 里的设置

@android:style/TextAppearance.Holo.Large                     22sp

@android:style/TextAppearance.Holo.Medium                 18sp

@android:style/TextAppearance.Holo.Small                     14sp

app:tabTextColor   设置文本颜色

app:tabSelectedTextColor    设置选中文本颜色

app:tabIndicatorColor     设置下滑条颜色

app:tabMaxWidth="xxdp"    设置最大的tab宽度

app:tabMinWidth="xxdp"    设置最小的tab宽度

TabLayout的监听事件

tabLayout.setOnTabSelectedListener(newTabLayout.OnTabSelectedListener() {

     @Override

     public voidonTabSelected(TabLayout.Tab tab) {

         //选中了tab

     }

     @Override

     public voidonTabUnselected(TabLayout.Tab tab) {

         //未选中tab

     }

     @Override

     public voidonTabReselected(TabLayout.Tab tab) {

        //再次选中tab

     }

} );

Tablayout 配合 Viewpager

简单粗暴一句代码

tabLayout.setupWithViewPager(Viewpager);

有些时候可能会出现不显示文本的情况,这时候需要在 PagerAdapter 里面重写一个方法

String mStrings = new String[ ]{"新闻","IT","军事","娱乐"};

@Override

public CharSequence getPageTitle(int position) {

    return mStrings[position];

}

推荐阅读更多精彩内容