[Android]创建TabBar

创建一个包含“首页”、“分类”和“我的”选项卡的TabBar并实现切换功能,通常可以通过使用TabLayout结合ViewPager或ViewPager2来完成。以下是一个基本的示例,展示了如何使用Kotlin和XML来实现这个功能。

1.添加依赖项到build.gradle

dependencies {// ...implementation("com.google.android.material:material:1.8.0")implementation("androidx.viewpager2:viewpager2:1.0.0")
}

2.在你的布局XML文件中定义TabLayout和ViewPager2

<?xml version="1.0" encoding="utf-8"?>
<LinearLayoutxmlns: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"><androidx.viewpager2.widget.ViewPager2android:id="@+id/viewPager"android:layout_width="match_parent"android:layout_height="0dp"android:layout_weight="1" /><com.google.android.material.tabs.TabLayoutandroid:id="@+id/tabLayout"android:layout_width="match_parent"android:layout_height="wrap_content"app:tabMode="fixed"app:tabGravity="fill"app:tabIndicatorHeight="0dp" /></LinearLayout>

3.在你的Activity中设置ViewPager2和TabLayout

package com.example.gatestdemol.tabbarimport androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import androidx.fragment.app.Fragment
import androidx.fragment.app.FragmentActivity
import androidx.viewpager2.adapter.FragmentStateAdapter
import com.example.gatestdemol.databinding.ActivityTabBarBinding
import com.google.android.material.tabs.TabLayoutMediatorclass TabBarActivity : AppCompatActivity() {private lateinit var binding: ActivityTabBarBindingoverride fun onCreate(savedInstanceState: Bundle?) {super.onCreate(savedInstanceState)// setContentView(R.layout.activity_tab_bar)binding = ActivityTabBarBinding.inflate(layoutInflater)setContentView(binding.root)val adapter = ViewPagerAdapter(this)binding.viewPager.adapter = adapterTabLayoutMediator(binding.tabLayout, binding.viewPager) { tab, position ->tab.text = when(position) {0 -> "首页"1 -> "分类"2 -> "我的"else -> null}}.attach()}private inner class ViewPagerAdapter(fa: FragmentActivity) : FragmentStateAdapter(fa) {override fun getItemCount(): Int {return 3}override fun createFragment(position: Int): Fragment {return when(position) {0 -> HomeFragment()1 -> CategoryFragment()2 -> ProfileFragment()else -> Fragment()}}}}

在上面的代码中,我们创建了一个ViewPagerAdapter类继承自FragmentStateAdapter,并重写了getItemCount和createFragment方法来分别返回选项卡的数量和对应的Fragment。TabLayoutMediator用于将TabLayout和ViewPager2绑定起来,并设置每个选项卡的标题。

4.创建对应的Fragment类

package com.example.gatestdemol.tabbarimport android.os.Bundle
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import androidx.fragment.app.Fragment
import com.example.gatestdemol.databinding.FragmentHomeBindingclass HomeFragment: Fragment() {private var binding: FragmentHomeBinding? = nulloverride fun onCreateView(inflater: LayoutInflater,container: ViewGroup?,savedInstanceState: Bundle?): View? {binding = FragmentHomeBinding.inflate(inflater,container,false)return binding?.root}override fun onDestroy() {super.onDestroy()binding = null}}
class CategoryFragment : Fragment() {// 实现分类Fragment的布局和逻辑
}class ProfileFragment : Fragment() {// 实现我的Fragment的布局和逻辑
}

每个Fragment对应一个页面,在这里你可以实现各自的布局和业务逻辑。

这是一个基本的TabBar实现,你可以根据自己的需求添加图标、自定义样式等。

简单TabBar示意图:

5.TabBar添加Icon

package com.example.gatestdemol.tabbarimport androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import androidx.core.content.ContextCompat
import androidx.fragment.app.Fragment
import androidx.fragment.app.FragmentActivity
import androidx.viewpager2.adapter.FragmentStateAdapter
import com.example.gatestdemol.R
import com.example.gatestdemol.databinding.ActivityTabBarBinding
import com.google.android.material.tabs.TabLayout
import com.google.android.material.tabs.TabLayoutMediatorclass TabBarActivity : AppCompatActivity() {private lateinit var binding: ActivityTabBarBindingoverride fun onCreate(savedInstanceState: Bundle?) {super.onCreate(savedInstanceState)binding = ActivityTabBarBinding.inflate(layoutInflater)setContentView(binding.root)val adapter = ViewPagerAdapter(this)binding.viewPager.adapter = adapterTabLayoutMediator(binding.tabLayout, binding.viewPager) { tab, position ->tab.text = when(position) {0 -> "首页"1 -> "分类"2 -> "我的"else -> null}tab.icon = when(position) {0 -> ContextCompat.getDrawable(this@TabBarActivity, R.drawable.ic_home_default)1 -> ContextCompat.getDrawable(this@TabBarActivity, R.drawable.ic_category_default)2 -> ContextCompat.getDrawable(this@TabBarActivity, R.drawable.ic_profile_default)else -> null}}.attach()binding.tabLayout.addOnTabSelectedListener(object : TabLayout.OnTabSelectedListener {override fun onTabSelected(tab: TabLayout.Tab?) {// 一套Icon时用这种方式//tab?.icon?.setTint(ContextCompat.getColor(applicationContext, R.color.your_selected_text_color))// 两套Icon时用这种方式,XML中不要配置app:tabIconTint="@color/your_icon_tint_color"tab?.icon = when(tab?.position) {0 -> ContextCompat.getDrawable(this@TabBarActivity, R.drawable.ic_home_selected)1 -> ContextCompat.getDrawable(this@TabBarActivity, R.drawable.ic_category_selected)2 -> ContextCompat.getDrawable(this@TabBarActivity, R.drawable.ic_profile_selected)else -> null}}override fun onTabUnselected(tab: TabLayout.Tab?) {// 一套Icon时用这种方式//tab?.icon?.setTint(ContextCompat.getColor(applicationContext, R.color.your_icon_tint_color))// 两套Icon时用这种方式,XML中不要配置app:tabIconTint="@color/your_icon_tint_color"tab?.icon = when(tab?.position) {0 -> ContextCompat.getDrawable(this@TabBarActivity, R.drawable.ic_home_default)1 -> ContextCompat.getDrawable(this@TabBarActivity, R.drawable.ic_category_default)2 -> ContextCompat.getDrawable(this@TabBarActivity, R.drawable.ic_profile_default)else -> null}}override fun onTabReselected(tab: TabLayout.Tab?) {// Do nothing}})}private inner class ViewPagerAdapter(fa: FragmentActivity) : FragmentStateAdapter(fa) {override fun getItemCount(): Int {return 3}override fun createFragment(position: Int): Fragment {return when(position) {0 -> HomeFragment()1 -> CategoryFragment()2 -> ProfileFragment()else -> Fragment()}}}}
<?xml version="1.0" encoding="utf-8"?>
<LinearLayoutxmlns: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"><androidx.viewpager2.widget.ViewPager2android:id="@+id/viewPager"android:layout_width="match_parent"android:layout_height="0dp"android:layout_weight="1" /><com.google.android.material.tabs.TabLayoutandroid:id="@+id/tabLayout"android:layout_width="match_parent"android:layout_height="wrap_content"app:tabIndicatorColor="@color/your_indicator_color"app:tabSelectedTextColor="@color/your_selected_text_color"app:tabTextColor="@color/your_default_text_color"app:tabIconTint="@color/your_icon_tint_color"app:tabMode="fixed"app:tabGravity="fill"app:tabIndicatorHeight="0dp"app:tabRippleColor="@android:color/transparent" /></LinearLayout>
<resources>......<color name="your_indicator_color">#FF0000</color><color name="your_selected_text_color">#FF3700B3</color><color name="your_default_text_color">#FFBB86FC</color><color name="your_icon_tint_color">#FFBB86FC</color>
</resources>

示意图:

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/196755.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

STM32与ZigBee无线通信技术在工业自动化中的应用

工业自动化是指利用电子技术、计算机技术和通信技术等手段&#xff0c;对工厂、设备和生产过程进行自动化控制和管理的过程。在工业自动化中&#xff0c;可靠的无线通信技术对于实时数据的传输和设备的协同控制至关重要。本文将介绍STM32微控制器与ZigBee无线通信技术在工业自动…

专业数据标注公司:景联文科技领航数据标注行业,满足大模型时代新需求

随着大模型的蓬勃发展和相关政策的逐步推进&#xff0c;为数据要素市场化配置的加速推进提供了有力的技术保障和政策支持。数据要素生产力度的不断提升&#xff0c;为数据标注产业带来了迅速发展的契机。 根据国家工信安全发展研究中心测算&#xff0c;2022年中国数据加工环节的…

【Mysql学习笔记】1 - Mysql入门

一、Mysql5.7安装配置 下载后会得到zip 安装文件解压的路径最好不要有中文和空格这里我解压到 D:\hspmysql\mysql-5.7.19-winx64 目录下 【根据自己的情况来指定目录,尽量选择空间大的盘】 添加环境变量 : 电脑-属性-高级系统设置-环境变量&#xff0c;在Path 环境变量增加mysq…

NET8 ORM 使用AOT SqlSugar

.NET AOT8 基本上能够免强使用了, SqlSugar ORM也支持了CRUD 能在AOT下运行了 Nuget安装 SqlSugarCore 具体代码 StaticConfig.EnableAot true;//启用AOT 程序启动执行一次就好了//用SqlSugarClient每次都new,不要用单例模式 var db new SqlSugarClient(new ConnectionC…

【Qt开发流程】之HelloWorld程序

【Qt开发流程】之HelloWorld程序 目的编写程序新建项目文件说明及界面设计 程序运行及发布程序运行程序发布手动构建使用windeployqt进行构建 设置应用程序图标修改快捷键类型列表命令行编译程序命令行编译.ui文件自定义类项目模式及项目文件介绍项目模式项目文件 目的 从Hell…

Kafka学习笔记(三)

目录 第5章 Kafka监控&#xff08;Kafka Eagle&#xff09;5.2 修改kafka启动命令5.2 上传压缩包5.3 解压到本地5.4 进入刚才解压的目录5.5 将kafka-eagle-web-1.3.7-bin.tar.gz解压至/opt/module5.6 修改名称5.7 给启动文件执行权限5.8 修改配置文件5.9 添加环境变量5.10 启动…

【Java 进阶篇】深入理解 JQuery 事件绑定:标准方式

在前端开发中&#xff0c;处理用户与页面的交互是至关重要的一部分。JQuery作为一个广泛应用的JavaScript库&#xff0c;为我们提供了简便而强大的事件绑定机制&#xff0c;使得我们能够更加灵活地响应用户的行为。本篇博客将深入解析 JQuery 的标准事件绑定方式&#xff0c;为…

解决Redis分布式锁宕机出现不可靠问题-zookeeper分布式锁

核心思想&#xff1a;当客户端要获取锁&#xff0c;则创建节点&#xff0c;使用完锁&#xff0c;则删除该节点。 客户端获取锁时&#xff0c;在 lock 节点下创建临时顺序节点。然后获取 lock下面的所有子节点&#xff0c;客户端获取到所有的子节点之后&#xff0c;如果发现自己…

【C++】:STL——标准模板库介绍 || string类

&#x1f4da;1.什么是STL STL(standard template libaray-标准模板库)&#xff1a;是C标准库的重要组成部分&#xff0c;不仅是一个可复用的组件库&#xff0c;而且 是一个包罗数据结构与算法的软件框架 &#x1f4da;2.STL的版本 原始版本 Alexander Stepanov、Meng Lee 在…

基于SpringBoot的SSMP整合案例(业务层基础开发与快速开发)

业务层基础开发 接口类public interface BookService {boolean save(Book book);boolean update(Book book);boolean delete(Integer id);Book getById(Integer id);List<Book> getAll();IPage<Book> getByPage(int currentPage,int pageSize);IPage<Book> …

计算机算法分析与设计(23)---二分搜索算法(C++)

文章目录 1. 算法介绍2. 代码编写 1. 算法介绍 1. 二分搜索&#xff08;英语&#xff1a;binary search&#xff09;&#xff0c;也称折半搜索&#xff08;英语&#xff1a;half-interval search&#xff09;、对数搜索&#xff08;英语&#xff1a;logarithmic search&#xf…

RIP路由信息协议

RIP路由信息协议(Routing Information Protocol) 最先得到广泛应用的协议&#xff0c;最大优点是简单要求网络中的每个路由器都要维护一张表&#xff0c;表中记录了从它自己到其他每一个目的网络的距离RIP是应用层协议&#xff0c;它在传输层使用UDP&#xff0c;RIP报文作为UD…

pdf如何让多张图片在一页

pdf保存为一页六张图片的方法是&#xff1a; 1、打开pdf查看器,打开文档。 2、点击【打印】图标进入打印程序&#xff0c;选择打印范围。 3、在【打印处理】选项,选择【每张张上放置多页】。 4、自定义每页放置的图片张数为六张&#xff0c;并对打印排版预览设置。 5、设置打印…

SpringBoot-配置文件properties/yml分析+tomcat最大连接数及最大并发数

SpringBoot配置文件 yaml 中的数据是有序的&#xff0c;properties 中的数据是无序的&#xff0c;在一些需要路径匹配的配置中&#xff0c;顺序就显得尤为重要&#xff08;例如在 Spring Cloud Zuul 中的配置&#xff09;&#xff0c;此时一般采用 yaml。 Properties ①、位…

Nginx(六) Nginx location 匹配顺序及优先级深究(亲测有效)

Nginx配置文件详解请参考另一篇文章 Nginx(三) 配置文件详解 本篇文章主要是探讨Nginx location的匹配顺序&#xff0c;依照惯例&#xff0c;我们还是先贴结论再看测试结果。 匹配顺序 匹配location的过程&#xff0c;其实可以理解成一个在众多选项中寻找最佳答案的过程。当然…

ElasticSearch 安装(单机版本)

文章目录 ElasticSearch 安装&#xff08;单机版本&#xff09;环境配置下载安装包调整系统参数安装启动并验证 ElasticSearch 安装&#xff08;单机版本&#xff09; 此文档演示 ElasticSearch 的单机版本在 CentOS 7 环境下的安装方式以及相关的配置。 环境配置 Linux 主机一…

物联网网关在工业行业的应用案例

物联网网关在工业行业的应用案例 随着物联网技术的不断发展&#xff0c;物联网网关在工业行业的应用越来越广泛。本文将介绍一个物联网网关在工业行业的应用案例&#xff0c;以期为相关领域的研究和实践提供借鉴和启示。 一、案例背景 某大型制造企业是一家全球知名的汽车制…

【MySQL】运行报错:ERROR 1193 (HY000): Unknown system variable ‘tx_isolation‘ 查看隔离级别报错

1、查看事务隔离级别的时候报错&#xff1a; 原因&#xff1a; 老版本 MySQL 比如 5 中用的是 tx_isolation&#xff0c;而应该是在 5.7.20 版本之后&#xff0c;用的是 transaction_isolation。 所以&#xff1a;在 MySQL 8 及之后的版本中&#xff0c;只需将语句中的 tx_isol…

学习c#的第十四天

目录 C# 接口&#xff08;Interface&#xff09; 接口的特点 定义接口 接口继承 接口和抽象类的区别 C# 命名空间&#xff08;Namespace&#xff09; using 关键字 定义命名空间 嵌套命名空间 C# 接口&#xff08;Interface&#xff09; 接口定义了所有类继承接口时应…

LeetCode47-全排列II-剪枝逻辑

参考链接: &#x1f517;:卡尔的代码随想录:全排列II 这里第一层,used只有一个元素为1,代表只取出了1个元素作为排列,第二层used有两个元素为1,代表取出了2个元素作为排列,因为数组有序,所以重复的元素都是挨着的,因此可以使用如下语句去重. 其中visit[i-1]False的话,就是代表…