Android开发之使用TabLayout快速实现选项卡切换功能(附源码下载)

最新推荐文章于 2024-07-26 21:24:56 发布

xiayiye5

最新推荐文章于 2024-07-26 21:24:56 发布

阅读量5.5k

点赞数 2

分类专栏： Android总结文章标签： TabLayout android 切换fragment

本文链接：https://blog.csdn.net/xiayiye5/article/details/95619117

版权

本文展示了如何在Android应用中使用TabLayout快速实现选项卡切换功能，并结合Fragment进行页面切换。提供了布局设计、Activity代码及Fragment代码的详细说明，同时还包括了自定义折线图的实现。文章附带源码下载链接，可在CSDN和GitHub获取。

摘要由CSDN通过智能技术生成

看下效果图：

先看下布局：

TabLayout的简单使用：
当选项卡过少时候设置填充全屏
 app:tabGravity="fill"
 设置下面切换选项卡的小滑片颜色
 app:tabIndicatorColor="#8B1C21"
 设置下面切换选项卡的小滑片高度
 app:tabIndicatorHeight="1dp"
 app:tabMaxWidth="0dp"
 app:tabSelectedTextColor="#8B1C21"

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              xmlns:app="http://schemas.android.com/apk/res-auto"
              android:layout_width="match_parent"
              android:layout_height="match_parent"
              android:background="@null"
              android:orientation="vertical">


    <android.support.design.widget.TabLayout
            android:id="@+id/tb_monetary"
            android:layout_width="match_parent"
            android:layout_height="40dp"
            android:background="#ffffff"
            app:tabGravity="fill"
            app:tabIndicatorColor="#8B1C21"
            app:tabIndicatorHeight="1dp"
            app:tabMaxWidth="0dp"
            app:tabSelectedTextColor="#8B1C21"/>

    <FrameLayout
            android:id="@+id/fl_monetary_replace"
            android:layout_width="match_parent"
            android:layout_height="match_parent"/>

</LinearLayout>

再看下首页activity代码：

package kotlin.yhsh.cn.tablayoutandline;

import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.design.widget.TabLayout;
import android.support.v4.app.FragmentTransaction;
import android.support.v7.app.AppCompatActivity;

/**
 * @author DELL
 */
public class MainActivity extends AppCompatActivity {
    private TabLayout tbMonetary;

    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initView();
    }

    private void initView() {
        tbMonetary = findViewById(R.id.tb_monetary);
        tbMonetary.addTab(tbMonetary.newTab().setText("近七日年化"));
        tbMonetary.addTab(tbMonetary.newTab().setText("万份收益"));
        //默认七日收益
        getSupportFragmentManager().beginTransaction().replace(R.id.fl_monetary_replace, SevenDayMoneyFragment.newInstance()).commit();
        initListener();
    }

    private void initListener() {
        tbMonetary.addOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
            @Override
            public void onTabSelected(TabLayout.Tab tab) {
                FragmentTransaction transaction = getSupportFragmentManager().beginTransaction();
                if (tab.getPosition() == 0) {
                    //七日年化
                    transaction.replace(R.id.fl_monetary_replace, SevenDayMoneyFragment.newInstance()).commit();
                } else if (tab.getPosition() == 1) {
                    //万份收益
                    transaction.replace(R.id.fl_monetary_replace, OneYearMoneyFragment.newInstance()).commit();
                }
            }

            @Override
            public void onTabUnselected(TabLayout.Tab tab) {

            }

            @Override
            public void onTabReselected(TabLayout.Tab tab) {

            }
        });
    }
}

然后看下两个切换的fragment代码：

package kotlin.yhsh.cn.tablayoutandline;

import android.os.Bundle;
import android.support.annotation.NonNull;
import android.support.annotation.Nullable;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.RadioButton;

impor