android中头部导航栏下边框设置方法

先上效果图

• 可以左右滑动切换样式
• 可以点击按钮设置样式

xml文件

 <LinearLayout
        android:id="@+id/tab_container"
        android:layout_gravity="top"
        android:paddingRight="6dp"
        android:paddingLeft="6dp"
        android:background="@color/white"
        android:gravity="center_vertical"
        android:orientation="horizontal"
        android:layout_width="match_parent"
        android:layout_height="40dp">
        <TextView
            android:id="@+id/tab1"
            android:text="全部"
            android:textColor="@drawable/order_tab_tv"
            android:gravity="center"
            android:layout_weight="1.0"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"/>
        <TextView
            android:id="@+id/tab2"
            android:text="待付款"
            android:textColor="@drawable/order_tab_tv"
            android:gravity="center"
            android:layout_weight="1.0"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"/>
        <TextView
            android:id="@+id/tab3"
            android:text="待发货"
            android:textColor="@drawable/order_tab_tv"
            android:gravity="center"
            android:layout_weight="1.0"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"/>
        <TextView
            android:id="@+id/tab4"
            android:text="待收货"
            android:textColor="@drawable/order_tab_tv"
            android:gravity="center"
            android:layout_weight="1.0"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"/>
        <TextView
            android:id="@+id/tab5"
            android:text="已完成"
            android:textColor="@drawable/order_tab_tv"
            android:gravity="center"
            android:layout_weight="1.0"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"/>
    </LinearLayout>

这里设置字体样式，我是新建一个drawable文件，然后存放选择和默认状态的样式，如下

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="@color/theme_color" android:state_selected="true"/>
    <item android:color="@color/theme_defaultText"/>
</selector>

而最重要的底部边框，我也是通过新建drawable文件来弄的，这里创建2个，分别是激活和默认状态，（我本想只用一个，但我不知如何用，看到的大佬知道的话可以留言噢，万分感谢）具体如下：

<!--  激活状态-->
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape>//边框的颜色
            <solid android:color="@color/theme_color" />
        </shape>
    </item>
    <item
        android:bottom="2dp">//这里有四个方向可以选择，这里因为只要显示底部边框，所以就设置bottom
        <shape>
            <solid android:color="@color/white" />
            //整个空间的背景颜色
        </shape>
    </item>
</layer-list>

<!-- 默认状态 -->
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape>//边框的颜色
            <solid android:color="@color/them_backColor" />
        </shape>
    </item>
    <item
        android:bottom="2dp">//这里有四个方向可以选择，这里因为只要显示底部边框，所以就设置bottom
        <shape>
            <solid android:color="@color/white" />
            //整个空间的背景颜色
        </shape>
    </item>
</layer-list>

java文件

我这里是通过滑动/点击去设置边框的，每一次点击之前都会把所有背景样式重置，然后再根据点击的按钮去设置边框（通过背景的方式）和字体样式，话不多说，具体看下面代码：

public class MyOrder extends AppCompatActivity implements View.OnClickListener{
    private ViewPager2 myOrder_vp;
    private List<Fragment> list = new ArrayList<>();
    private TextView tab1,tab2,tab3,tab4,tab5,tab_current;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_my_order);
        initView();

    }

    /**
     * 初始化 控件
     */
    private void initView() {
        tab1 = findViewById(R.id.tab1);
        tab2 = findViewById(R.id.tab2);
        tab3 = findViewById(R.id.tab3);
        tab4 = findViewById(R.id.tab4);
        tab5 = findViewById(R.id.tab5);
        myOrder_vp  = findViewById(R.id.myOrder_vp);
        initTab();
        initPager();
    }

    /**
     * 初始化 顶部导航栏，并设置点击监听
     */
    private void initTab() {
        tab1.setSelected(true);
        tab_current = tab1;
        tab1.setOnClickListener(this);
        tab2.setOnClickListener(this);
        tab3.setOnClickListener(this);
        tab4.setOnClickListener(this);
        tab5.setOnClickListener(this);

        tab1.setBackgroundResource(R.drawable.order_tab_active_border); //设置tab1当前背景
    }


    /**
     * 初始化 ViewPager2
     */
    private void initPager() {
        list.add(MyOrderFragment.newInstance("全部"));
        list.add(MyOrderFragment.newInstance("待付款"));
        list.add(MyOrderFragment.newInstance("待发货"));
        list.add(MyOrderFragment.newInstance("待收货"));
        list.add(MyOrderFragment.newInstance("已完成"));

        MyOrderAdapter myOrderAdapter =  new MyOrderAdapter(getSupportFragmentManager(),getLifecycle(),list);
        myOrder_vp.setAdapter(myOrderAdapter);
        myOrder_vp.registerOnPageChangeCallback(new ViewPager2.OnPageChangeCallback() {
            @Override
            public void onPageSelected(int position) {
                super.onPageSelected(position);
                pageChange(position);
            }
        });
    }

    /**
     * 自定义方法，作为滑动监听事件
     * @param position
     */
    private void pageChange(int position) {
        tab_current.setSelected(false);
        switch (position){
            case R.id.tab1:
                clearBack();
                tab1.setBackgroundResource(R.drawable.order_tab_active_border);
                myOrder_vp.setCurrentItem(0,false);
                break;
            case 0:
                clearBack();
                tab1.setBackgroundResource(R.drawable.order_tab_active_border);
                tab1.setSelected(true);
                tab_current = tab1;
                break;
            case R.id.tab2:
                clearBack();
                tab2.setBackgroundResource(R.drawable.order_tab_active_border);
                myOrder_vp.setCurrentItem(1,false);
                break;
            case 1:
                clearBack();
                tab2.setBackgroundResource(R.drawable.order_tab_active_border);
                tab2.setSelected(true);
                tab_current = tab2;
                break;
            case R.id.tab3:
                clearBack();
                tab3.setBackgroundResource(R.drawable.order_tab_active_border);
                myOrder_vp.setCurrentItem(2,false);
                break;
            case 2:
                clearBack();
                tab3.setBackgroundResource(R.drawable.order_tab_active_border);
                tab3.setSelected(true);
                tab_current = tab3;
                break;
            case R.id.tab4:
                clearBack();
                tab4.setBackgroundResource(R.drawable.order_tab_active_border);
                myOrder_vp.setCurrentItem(3,false);
                break;
            case 3:
                clearBack();
                tab4.setBackgroundResource(R.drawable.order_tab_active_border);
                tab4.setSelected(true);
                tab_current = tab4;
                break;
            case R.id.tab5:
                clearBack();
                tab5.setBackgroundResource(R.drawable.order_tab_active_border);
                myOrder_vp.setCurrentItem(4,false);
                break;
            case 4:
                clearBack();
                tab5.setBackgroundResource(R.drawable.order_tab_active_border);
                tab5.setSelected(true);
                tab_current = tab5;
                break;
        }
    }

    /**
     * 清除背景
     */
    private void clearBack() {
       tab1.setBackgroundResource(R.drawable.order_tab_default_border);
       tab2.setBackgroundResource(R.drawable.order_tab_default_border);
       tab3.setBackgroundResource(R.drawable.order_tab_default_border);
       tab4.setBackgroundResource(R.drawable.order_tab_default_border);
       tab5.setBackgroundResource(R.drawable.order_tab_default_border);

    }

    @Override
    public void onClick(View v) {
        pageChange(v.getId());

    }