VerticalTabLayout 开源项目教程

VerticalTabLayout 开源项目教程

VerticalTabLayout垂直纵向的TabLayout、轻松创建纵向导航项目地址:https://gitcode.com/gh_mirrors/ve/VerticalTabLayout

项目介绍

VerticalTabLayout 是一个 Android 开源库，用于实现垂直方向的标签布局。它支持自定义指示器大小、位置、圆角，支持标签设置徽章，支持通过适配器的方式创建标签，并且可以方便地与 ViewPager 和 Fragment 结合使用。

项目快速启动

添加依赖

首先，在项目的 build.gradle 文件中添加以下依赖：

implementation 'q.rorbin:VerticalTabLayout:1.2.5'

布局文件

在布局文件中添加 VerticalTabLayout：

<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:orientation="vertical">

    <q.rorbin.verticaltablayout.VerticalTabLayout
        android:id="@+id/vertical_tab"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:indicator_color="#30000000"
        app:indicator_corners="20dp"
        app:indicator_gravity="fill"/>
</LinearLayout>

代码实现

在 Activity 或 Fragment 中初始化 VerticalTabLayout 并设置标签：

VerticalTabLayout verticalTabLayout = findViewById(R.id.vertical_tab);
verticalTabLayout.addTab(verticalTabLayout.newTab().setText("Tab 1"));
verticalTabLayout.addTab(verticalTabLayout.newTab().setText("Tab 2"));
verticalTabLayout.addTab(verticalTabLayout.newTab().setText("Tab 3"));

应用案例和最佳实践

与 ViewPager 结合使用

VerticalTabLayout 可以与 ViewPager 结合使用，实现标签页的切换效果。以下是一个简单的示例：

ViewPager viewPager = findViewById(R.id.view_pager);
viewPager.setAdapter(new MyPagerAdapter(getSupportFragmentManager()));
verticalTabLayout.setupWithViewPager(viewPager);

自定义标签样式

可以通过自定义布局文件来设置标签的样式：

<q.rorbin.verticaltablayout.TabView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="?attr/selectableItemBackground"
    android:padding="16dp">

    <TextView
        android:id="@+id/tab_title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textColor="@color/tab_text_color"
        android:textSize="16sp"/>
</q.rorbin.verticaltablayout.TabView>

典型生态项目

VerticalViewPager

VerticalViewPager 是一个可以实现垂直方向滑动切换页面的 ViewPager，与 VerticalTabLayout 结合使用可以实现完整的垂直标签页切换效果。

Fragment 结合使用

VerticalTabLayout 可以与 Fragment 结合使用，实现标签页对应的 Fragment 切换效果。以下是一个简单的示例：

verticalTabLayout.addOnTabSelectedListener(new VerticalTabLayout.OnTabSelectedListener() {
    @Override
    public void onTabSelected(TabView tab, int position) {
        Fragment fragment = MyFragment.newInstance(position);
        getSupportFragmentManager().beginTransaction()
            .replace(R.id.fragment_container, fragment)
            .commit();
    }

    @Override
    public void onTabReselected(TabView tab, int position) {}
});

通过以上步骤，您可以快速启动并使用 VerticalTabLayout 开源项目，并结合 ViewPager 和 Fragment 实现丰富的应用场景。

VerticalTabLayout垂直纵向的TabLayout、轻松创建纵向导航项目地址:https://gitcode.com/gh_mirrors/ve/VerticalTabLayout