本文实例为大家分享了TabLayout ViewPager2简单使用的实现代码,供大家参考,具体内容如下

学习之前我们先看一下显示的效果

这里显示的底部导航栏,如果想实现的顶部导航栏,只需要调整一下TabLayout的位置即可。

1、导入依赖

使用ViewPager2之前需要先导入依赖,这里的依赖可能不是最新的,可以自己查找最新的版本。TabLayout不需要导入。

implementation "androidx.viewpager2:viewpager2:1.0.0"

2、布局

<androidx.viewpager2.widget.ViewPager2
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:layout_constraintTop_toBottomOf="@id/tablayout"
    android:id="@ id/viewpager2"/>

<com.google.android.material.tabs.TabLayout
    android:layout_width="match_parent"
    android:layout_height="30dp"
    app:layout_constraintTop_toTopOf="parent"
    app:tabTextAppearance="@style/tabLayoutTheme"
    android:id="@ id/tablayout"
    app:tabMode="fixed">

</com.google.android.material.tabs.TabLayout>

我们只需要控制TabLayout的布局位置,就可以实现它是底部导航还是顶部导航了,需要注意一下viewPager和TabLayout的布局,不要让它们产生重叠。

3、使用方法

viewPager需要为其提供一个适配器,通过setAdapter()方法添加适配器,这个适配器它必须继承自FragmentStateAdapter, 这里一定要用写一个类去继承FragmentStateAdapter,否则会出现奇怪的错误, 适配器中主要完成页面的设置。

class ViewPager2Adapter extends FragmentStateAdapter{

    public ViewPager2Adapter(@NonNull FragmentActivity fragmentActivity) {
        super(fragmentActivity);
    }

    @NonNull
    @Override
    public Fragment createFragment(int position) {
        // 每个页面对应的fragment
        switch (position){
            // 这里我随便写了两个Fragment
            case 0:return new Fragment1();
            case 1:return new Fragment2();
        }

        return null;
    }

    @Override
    public int getItemCount() {
        // 有几个页面就返回几
        return 2;
    }
}

创建一个适配器实例设置为ViewPager2对象。
代码中为TabLayout添加Tab,如果在布局中已经添加就不需要了

for (int i = 0; i < 2; i  ) {
    tabLayout.addTab(tabLayout.newTab());
}

上面需要特别注意,是tabLayout.newTab().

最后使用TabLayoutMeditor将TabLayout和ViewPager组合起来。

TabLayoutMediator mediator = new TabLayoutMediator(binding.tabLayout, binding.viewPager2, new TabLayoutMediator.TabConfigurationStrategy() {
    @Override
    public void onConfigureTab(@NonNull TabLayout.Tab tab, int position) {
        tab.setText(tabs[position]);
    }
});
mediator.attach();

到这里,基本上就可以进行展示了,可以进行滑动切换和点击导航栏切换,下面继续看看其他功能。

5、tabLayout添加一个监听器

监听各个页面之间的切换以做出不同的处理。

tabLayout.addOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
    // 页面被选中
    @Override
    public void onTabSelected(TabLayout.Tab tab) {
        Log.d(TAG, "onTabSelected: " tab.getText());
    }
    // 页面切换到其他
    @Override
    public void onTabUnselected(TabLayout.Tab tab) {
        Log.d(TAG, "onTabUnselected: " tab.getText());
    }

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

    }
});

6、自定义tablayout的显示样式

很多时候我们会觉得tabLayout导航栏只能显示文字太单调了,因此想要为其添加其他样式,比如添加图 文字的显示效果,步骤如下:

1、自定义一个底部导航的显示样式,比如图片 文字

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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">

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@ id/icon"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="parent"/>

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@ id/text"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toBottomOf="@id/icon"/>

</androidx.constraintlayout.widget.ConstraintLayout>

2、我们再定义一个方法,该方法可以根据不同的位置构造返回不同的底部显示样式

private View getViewAtI(int position){
    View view = getLayoutInflater().inflate(R.layout.bottom_layout, null, false);
    ImageView  imageView = view.findViewById(R.id.icon);
    TextView textView = view.findViewById(R.id.text);
    // 这个icons就是一个简单的图片保存的数组,保存如R.drawable.touxiang
    imageView.setImageResource(icons[position]);
    textView.setText(tabs[position]);

    return view;
}

3、在TabLayoutMediator中为每个tab设置不同的CustomView, 就能显示底部视图了。

TabLayoutMediator mediator = new TabLayoutMediator(tabLayout, viewPager2, new TabLayoutMediator.TabConfigurationStrategy() {
    @Override
    public void onConfigureTab(@NonNull TabLayout.Tab tab, int position) {
        //tab.setText(tabs[position]);
        tab.setCustomView(getViewAtI(position));
    }
});

mediator.attach();

TabLayout还有许多的属性可以设置,这里就不一一的展示了。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持Devmax。

TabLayout+ViewPager2的简单使用详解的更多相关文章

  1. 选项卡图标和文本均使用android设计支持库

    解决方法你是什么意思未被选中.你能分享一下你想要达到的目标以及你现在所处的位置.我不推荐你的做法.它做了很多不需要的东西来解决你的问题.我建议使用TabLayout类中的图标和文本,只需设置图标和文本.或者,如果需要,甚至是自定义布局,但使用TabLayout中的text1和图标.这样做有什么问题吗?

  2. 如何在TabLayout android中的活动中获取tab click事件

    这是我的活动中onCreate函数的实现.我需要动态创建标签.为简单起见,我制作了两个标签.我想在点击选项卡时更改编辑文本值.editText处于同一活动中.如何在活动中获得Tabclick事件?

  3. android – 在两个选项卡之间共享ViewPager

    我尝试了很多种方式来分享viewpager但是失败了.请给我一个想法解决方法首先,这是针对谷歌材料指南.你可以阅读它here.最近我有一个自定义的TabLayout设计工作,我有红色的所有TabLayout代码.这与设计支持库无关.反思是一种选择,但是你需要做很多工作,最后它并不是你所需要的,因为设计支持库并不是为此而设计的.我还想这样做,你应该考虑创建一个自定义TabLayout.

  4. android – 使TabLayout文本变为粗体

    我正在使用Android设计支持库中的TabLayout并想要设置其文本样式(标题).特别是大胆.如何在XML中实现这一点?解决方法首先,必须将其添加到styles.xml:即使您不想更改文本大小,也必须将其包含在样式中,否则不会显示任何内容.然后必须使用app:tabTextAppearance而不是style属性将样式应用于TabLayout!要启用allcaps,您可以将以下内容添加到TabLayoutTextStyle:

  5. android – 获取TabLayout选项卡的textview

    我想以编程方式更改选项卡的textview.有没有办法做到这一点?解决方法这是有效的解决方案只需将最后一个索引零改为一,现在上面的代码就可以了删除了崩溃

  6. android – 禁用Tablayout上的材质波纹

    我正在尝试删除TabLayout选项卡上的材质波纹效果.我想知道是否可以这样做?我已经尝试将stateListAnimator设置为null但它仍然无效解决方法尝试更改背景,例如,使用android的透明色.

  7. 切换片段后,Android TabLayout不再显示内容

    我在我的项目中使用导航抽屉,里面有5个片段.在一个片段中,我在设计支持库中引入了TabLayout,其中包括2个片段.一切正常,除非我离开具有TabLayout的片段并切换回它,所有内容都消失了.在TabLayout的每个片段中,我有一个带有ListView的SwipeRefreshLayout,它们都不会在切换时显示任何内容.我也注意到TabLayout开始表现得很奇怪.奇怪的是我的意思是白色指示器开始跳跃,你能够将它仍然保持在两个标签的中间……

  8. 当我在片段之间滑动时,android-tabindicator不会在tablayout中从一个选项卡滑动到另一个选项卡.字体的突出显示也没有改变

    当我滑过片段时,标签的高光不会改变,但是当我触摸标签时它会正常工作.当我触摸它们时,标签指示器从左向右滑动很好,标签的字体颜色也会突出显示.我认为问题在于这段代码我该怎么做才能突出显示当前标签…解决方法我找到了解决办法.这种方法很容易设置一切.

  9. android-viewpager – android中心在tablayout中对齐选定的选项卡

    我正在使用android支持设计tablayout.这是我的代码:我的问题是标签总是左对齐.但是,我想将选定的选项卡居中.有没有办法做到这一点?谢谢.解决方法我看了一下TabLayout,tabContentStart只为其第一个孩子设置了填充–>SlidingTabStrip,所以我在两边手动设置:TabLayout的第一个0索引子项是SlidingTabStrip.

  10. android – FragmentManager在使用方法setOffscreenPageLimit()后已经在执行事务

    我有一个带有多个片段的导航抽屉,其中一个是带有两个recyclerview片段的tablayout,在导航抽屉片段之间切换后,RecyclerView项目消失了,我找到了一个解决方案,我需要使用方法setoffscreenPageLimit()和ViewPager但它给了我问题标题中提到的错误这是我的logcat这是标签布局片段代码解决方法我遇到了类似的问题,经过几个小时的研究,我发现了这个问题.

随机推荐

  1. Flutter 网络请求框架封装详解

    这篇文章主要介绍了Flutter 网络请求框架封装详解,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

  2. Android单选按钮RadioButton的使用详解

    今天小编就为大家分享一篇关于Android单选按钮RadioButton的使用详解,小编觉得内容挺不错的,现在分享给大家,具有很好的参考价值,需要的朋友一起跟随小编来看看吧

  3. 解决android studio 打包发现generate signed apk 消失不见问题

    这篇文章主要介绍了解决android studio 打包发现generate signed apk 消失不见问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧

  4. Android 实现自定义圆形listview功能的实例代码

    这篇文章主要介绍了Android 实现自定义圆形listview功能的实例代码,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

  5. 详解Android studio 动态fragment的用法

    这篇文章主要介绍了Android studio 动态fragment的用法,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

  6. Android用RecyclerView实现图标拖拽排序以及增删管理

    这篇文章主要介绍了Android用RecyclerView实现图标拖拽排序以及增删管理的方法,帮助大家更好的理解和学习使用Android,感兴趣的朋友可以了解下

  7. Android notifyDataSetChanged() 动态更新ListView案例详解

    这篇文章主要介绍了Android notifyDataSetChanged() 动态更新ListView案例详解,本篇文章通过简要的案例,讲解了该项技术的了解与使用,以下就是详细内容,需要的朋友可以参考下

  8. Android自定义View实现弹幕效果

    这篇文章主要为大家详细介绍了Android自定义View实现弹幕效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  9. Android自定义View实现跟随手指移动

    这篇文章主要为大家详细介绍了Android自定义View实现跟随手指移动,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  10. Android实现多点触摸操作

    这篇文章主要介绍了Android实现多点触摸操作,实现图片的放大、缩小和旋转等处理,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

返回
顶部