Android TabLayout 升级版 SmartTabLayout , 自定义空间大

Android SmartTabLayout worm 蠕虫蠕动/普通平整动画切换动画属性

效果展示

Android SmartTabLayout在github上的开源项目主页：https://github.com/ogaclejapan/SmartTabLayout

项目有点久远 , 直接依赖麻烦 , 我直接将开源项目中的 library 代码复制出来放到新建的 lib 中 , 然后打包成 aar 使用 ,方便.

使用文档见文章最后

aar 打包和使用方法: https://blog.csdn.net/qq_39582021/article/details/82883539

以下是布局 , 界面代码 ,文章结尾是使用文档 (直接在网页 Ctrl + F )

布局 :

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

    <com.fn.library_smart_tablayout.SmartTabLayout
        android:id="@+id/viewpagertab"
        android:layout_width="match_parent"
        android:layout_height="48dp"
        app:stl_indicatorAlwaysInCenter="false"
        app:stl_indicatorWithoutPadding="true"
        app:stl_indicatorInFront="false"
        app:stl_indicatorInterpolation="smart"
        app:stl_indicatorGravity="bottom"
        app:stl_indicatorColor="#40C4FF"
        app:stl_indicatorThickness="4dp"
        app:stl_indicatorWidth="auto"
        app:stl_indicatorCornerRadius="2dp"
        app:stl_overlineColor="#000000"
        app:stl_overlineThickness="4dp"
        app:stl_underlineColor="#f90b0b0b"
        app:stl_underlineThickness="1dp"
        app:stl_dividerColor="#f5434141"
        app:stl_dividerThickness="4dp"
        app:stl_defaultTabBackground="?attr/selectableItemBackground"
        app:stl_defaultTabTextAllCaps="true"
        app:stl_defaultTabTextColor="#fcbc2929"
        app:stl_defaultTabTextSize="14sp"
        app:stl_defaultTabTextHorizontalPadding="16dp"
        app:stl_defaultTabTextMinWidth="10dp"
        app:stl_distributeEvenly="true"
        app:stl_clickable="true"
        app:stl_titleOffset="24dp"
        app:stl_drawDecorationAfterTab="true"
        />

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

界面代码 , fragment 随便写一个 v4 包

import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;

import com.fn.library_smart_tablayout.SmartTabLayout;

import java.util.ArrayList;
import java.util.List;

public class MainActivity extends AppCompatActivity {

    private List<Fragment> mTabFragments;
    private List<String> mTabIndicators;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        initView();
    }

    private void initView() {

        mTabIndicators = new ArrayList<>();
        mTabIndicators.add("任务");
        mTabIndicators.add("圈子");
        mTabIndicators.add("个人");

        mTabFragments = new ArrayList<>();
        mTabFragments.add(new Fragment1());
        mTabFragments.add(new Fragment1());
        mTabFragments.add(new Fragment1());

        ContentPagerAdapter contentAdapter = new ContentPagerAdapter(getSupportFragmentManager());
        ViewPager viewPager = (ViewPager) findViewById(R.id.viewpager);
        viewPager.setAdapter(contentAdapter);

        SmartTabLayout viewPagerTab = (SmartTabLayout) findViewById(R.id.viewpagertab);
        viewPagerTab.setViewPager(viewPager);
        viewPagerTab.setOnPageChangeListener(mPageChangeListener);


    }

    class ContentPagerAdapter extends FragmentPagerAdapter {

        public ContentPagerAdapter(FragmentManager fm) {
            super(fm);
        }

        @Override
        public Fragment getItem(int position) {
            return mTabFragments.get(position);
        }

        @Override
        public int getCount() {
            return mTabIndicators.size();
        }

        @Override
        public CharSequence getPageTitle(int position) {
            return mTabIndicators.get(position);
        }

    }

    private ViewPager.OnPageChangeListener mPageChangeListener=new ViewPager.OnPageChangeListener() {
        @Override
        public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

        }

        @Override
        public void onPageSelected(int position) {

        }

        @Override
        public void onPageScrollStateChanged(int state) {

        }
    };
}

使用文档:

1. stl_indicatorAlwaysInCenter 为 true 时 跟随居中 , 为 false 时 默认靠左
2. stl_indicatorWithoutPadding 为 true 时 指示器左右 有 padding , 为 false 时 , 没有 padding
3. stl_indicatorInFront 为 true 时 没有发生变化  翻译为 : 指标-在前面
4. stl_indicatorInterpolation smart 动画或 linear 默认
5. stl_indicatorGravity 设置指示器的位置 有 bottom center top
6. stl_indicatorColor  指示器颜色 十六进制
7. stl_indicatorThickness 指示器厚度 dp
8. stl_indicatorWidth auto 自动 , 至指定具体的 宽度 dp
9. stl_indicatorCornerRadius 指示器的圆角半径 dp
10. stl_overlineColor 在顶部有一条线的颜色 需要配合 stl_overlineThickness 指定厚度
11. stl_overlineThickness 指定顶部线的厚度
12. stl_underlineColor 在底部有一条线 需要配合 stl_underlineThickness 指定厚度
13. stl_underlineThickness 指定底部线的厚度
14. stl_dividerColor smartTablayout 中 item 之间的竖向线(间隔线) 颜色 需要配合 stl_dividerThickness 指定厚度
15. stl_defaultTabBackground 水波纹点击效果
16. stl_defaultTabTextAllCaps 为 true / false 没有任何效果
17. stl_defaultTabTextColor 默认 tab 中文字的颜色
18. stl_defaultTabTextSize  默认 tab 中文字的大小
19. stl_defaultTabTextHorizontalPadding 默认 tab 之间的横向 padding
20. stl_defaultTabTextMinWidth 默认 tab 中文字的宽度
21. stl_defaultTabTextMinWidth 没有发现有何区别
22. stl_distributeEvenly 为 true 时 指定平分屏幕宽度( 平分布局 ) , 为 false 时 默认靠左排列
23. stl_clickable tab 是否可以点击
24. stl_titleOffset 没有发现有何区别
25. stl_drawDecorationAfterTab 没有发现有何区别 翻译: 在标签后画装饰

Android TabLayout 升级版 SmartTabLayout , 自定义空间大

猜你喜欢