Android的TabLayout右上角展示数量

Posted 拖鞋王子猪

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Android的TabLayout右上角展示数量相关的知识,希望对你有一定的参考价值。

先直接上图


主要使用了TabLayout、ViewPager、Fragment
这三个控件的使用就不多介绍了,如有不熟悉的朋友,可自行先去了解一下这三个控件的使用。
activity_main的布局如下:

<?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"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical"
    android:background="#AAEBEBEB">

    <android.support.design.widget.TabLayout
        android:id="@+id/tablayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:tabSelectedTextColor="@color/green"
        android:background="@color/white"/>

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


</LinearLayout>

MainActivity.java代码也比较简单,主要是TabLayout.Tab.setCustomView()方法。
核心代码:

private void init(){
        viewPager = findViewById(R.id.viewpager);
        tabLayout =  findViewById(R.id.tablayout);
        for(int i=0;i<titles.length;i++){
            fragments.add(new TabFragment());
            tabLayout.addTab(tabLayout.newTab());
        }

        tabLayout.setupWithViewPager(viewPager,false);
        pagerAdapter = new FmPagerAdapter(fragments,getSupportFragmentManager());
        viewPager.setAdapter(pagerAdapter);

        for(int i=0;i<titles.length;i++){
            tabLayout.getTabAt(i).setText(titles[i]);
            tabLayout.getTabAt(i).setCustomView(makeTabViewText(i));
        }
    }
/**
     * 引入布局设置图标和标题
     * @param position
     * @return
     */
    private View makeTabViewText(int position){
        View tabView = LayoutInflater.from(this).inflate(R.layout.tab_text_value,null);
        TextView textView = tabView.findViewById(R.id.textview);
        TextView textviewValue = tabView.findViewById(R.id.textview_value);
        textView.setText(titles[position]);
        textviewValue.setText(picText[position]);
        textviewValue.setTextColor(getResources().getColor(R.color.white));
        return tabView;
    }

tab_text_value.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="40dp"
    android:layout_gravity="center"
    android:orientation="horizontal">
    <TextView
        android:id="@+id/textview"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:gravity="center"
        android:textColor="#000000"
        android:textSize="17sp" />

    <TextView
        android:id="@+id/textview_value"
        android:layout_toRightOf="@+id/textview"
        android:layout_width="15dp"
        android:layout_height="15dp"
        android:layout_marginTop="10dp"
        android:gravity="center"
        android:visibility="visible"
        android:textSize="10sp"
        android:textColor="@android:color/white"
        android:background="@drawable/bg_red_dot" />
</RelativeLayout>

FragmentPagerAdapter这个使用就自己去看看,
Demo下载地址

欢迎关注下面公众号,里面有大量免费的android进阶资料,回复 资料 即可领取。

以上是关于Android的TabLayout右上角展示数量的主要内容,如果未能解决你的问题,请参考以下文章

Android的TabLayout右上角展示数量

Android TabLayout 实战

用TabLayout+ViewPager+Fragment控件实现简单的翻页效果 --Android--

用TabLayout+ViewPager+Fragment控件实现简单的翻页效果 --Android--

记录TabLayout的一些用法(android)

android设计TabLayout标签的文字大小