tabBar设置底部导航栏

news2024/11/15 8:09:28

如果应用是一个多 tab 应用,可以通过 tabBar 配置项指定一级导航栏,以及 tab 切换时显示的对应页,简单来说就是像美团外卖下面的导航栏一样可以任意切换

1.首先创建三个页面,在页面里面可以写一些东西或者放一张图片方便区分。

2.在pages.json文件中globalStyle后面添加一个tabBar,记得要加上豆号。

3.在我们的tabBar里面还得写一个list用[]括号括起来因为我们有多个页面就是多个对象就得用数组的方式存起来。

在我们的tabBar里面可以看到有很多的属性它们都是干什么用的呢。

(1)color它是默认的颜色就是我们没选中时候的颜色,selectedColor是选中后的颜色就是我们选中这个导航栏时的颜色。

(2)backgroundColor是当导航栏的背景颜色,borderStyle是导航栏的边框颜色它只有两种颜色黑色和白色。

(3)咱们对象里面的的属性pagesPath是咱们页面的地址,text就是导航的文字显示,iconPath是图片路径可以给每个导航元素添加一个图片,selectedIconPath是选中后的图片显示比如选中前是一个灰色的选中后就可以给一个便于识别的颜色图片表示选中。

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

JavaScript高级进阶(二)

JS弹窗 弹窗与语法 警告窗 window.alert()//用于确保用户可以得到某些信息 确认窗 window.confirm()//用于验证是否接受用户操作 提示窗 window.prompt()//用于提示用户在进入页面前输入某个值 <script> //警告窗 alert(欢迎光临); //提示框 var str prompt(是不是…

秒懂:进程切换——O(1)调度算法

情景理解&#xff1a; 上面这张图展示的就是Linux内核中的调度队列示意图&#xff0c;那么具体是如何进行队列调度的呢&#xff1f; 首先&#xff0c;图中有两个queue[140]&#xff0c;这个就是所谓的队列结构&#xff0c;&#xff08;蓝色和红色扩出来的&#xff09;其中有一…

(Arxiv-2022)eDiff-I:具有一组专家降噪器的文本到图像扩散模型

eDiff-I&#xff1a;具有一组专家降噪器的文本到图像扩散模型 Paper Title&#xff1a;eDiff-I: Text-to-Image Diffusion Models with an Ensemble of Expert Denoisers Paper是NVIDIA 公司发表在arxiv 2022的工作 Paper地址 项目页面地址 图 1. 我们提出的方法 eDiff-I 的示例…

电子连接器接触电阻仿真教程

电子连接器接触电阻是指连接器连接通路中公母端子接点处电阻与公母端子导体的电阻总和。接触电阻是电子连接器的重要电气特性参数,对同款连接器,接触电阻则是衡量其品质优劣的重要指标。接触电阻过大时会导致传输信号在连接器上的能量损耗过大,电压降过大,发热过大等不利于…

【计网】计算机网络基础

当自律变成一种本能的习惯&#xff0c; 你就会享受到它的快乐。 --- 村上春树 --- 初识计算机网络 1 初识协议1.1 协议分层1.2 OSI七层模型1.3 TCP / IP协议 2 初识局域网2.1 什么是局域网2.2 MAC地址2.3 局域网通信 3 简单认识IP地址 1 初识协议 1.1 协议分层 首先&#…

Xilinx SDK入门示例

本文以测试PS端的UART和DDR3&#xff0c;介绍Xilinx SDK的简单用法。 1 创建VIVADO工程 Step1&#xff1a;新建工程 Step2&#xff1a; Step3&#xff1a;选择器件 Step4&#xff1a;在接下来的页面中&#xff0c;点击Finish完成工程的创建 Step5&#xff1a;点击IP INTERGA…

JavaScript 编程精粹:JavaScript 事件处理

JavaScript 编程精粹&#xff1a;JavaScript 事件处理 一 . BOM1.1 Window1.1.1 alert()1.1.2 confirm()1.1.3 setInterval()1.1.4 setTimeout()1.1.5 小案例 - 通过定时器来控制灯的亮暗 1.2 History1.3 Location 二 . DOM2.1 获取 Element 对象2.2 常见 Element 对象的使用 三…

【Qt】实现一个小闹钟

widget.h #ifndef WIDGET_H #define WIDGET_H#include <QWidget> #include <QPushButton>//按钮类 #include <QLineEdit>//行编辑器 #include <QLabel>//标签类 #include <QTextEdit>//输入框 #include <QTimerEvent>//定时器事件类 #inc…

【Java】SpringCloud中使用set方法报错空指针

前言&#xff1a;今天在交流群中看见了一个空指针报错&#xff0c;想着哪里为空点过去看看为什么赋不上值就行&#xff0c;没想到啪啪打脸了&#xff0c;今天总结一下。 以下是他的RedisTempate注入和方法 可以看到&#xff0c;89行报错空指针。先分析一下&#xff0c; ①赋值…

机器学习:opencv--图像旋转、模版匹配多项

目录 一、图像旋转 1.numpy方法 2.opencv方法 二、模版匹配多项 1.完整代码 2.步骤解析 3.结果 三、图像旋转模版匹配 一、图像旋转 图像旋转有两种方式 1.numpy方法 import cv2 import numpy as npimg cv2.imread(suda.jpg) img cv2.resize(img, (300, 300))# np…

解决Windows Server 2012加密套件过时的问题

给自己网站加了SSL证书后&#xff0c;发现在360极速浏览器浏览时&#xff0c;会显示加密套件已经过时。一直以为是.cn域名的问题&#xff0c;后面才发现是IIS上面加密套件过时的问题。 TLS/SSL (Schannel SSP) 中的密码套件 - Win32 apps | Microsoft Learn 一开始我以为切换到…

力扣518-零钱兑换 II(Java详细题解)

题目链接&#xff1a;518. 零钱兑换 II - 力扣&#xff08;LeetCode&#xff09; 前情提要&#xff1a; 因为本人最近都来刷dp类的题目所以该题就默认用dp方法来做。 最近刚学完背包&#xff0c;所以现在的题解都是以背包问题为基础再来写的。 如果大家不懂背包问题的话&am…

【重点】抓取三次握手的数据报文,分析每次握手的交互过程

1、制造三次握手的报文 三次握手是TCP&#xff08;传输控制协议&#xff09;建立连接的过程。它包括以下三个步骤&#xff1a; 1&#xff09;SYN&#xff08;同步&#xff09;&#xff1a;客户端发送一个SYN报文&#xff0c;请求与服务器建立连接。 2&#xff09;SYN-ACK&am…

text2video的step1出错,与纠正

也就是配置RWKV向外提供API访问权;并将openai的api_base改为本地访问地址。 # 设置 OpenAI 的 API 密钥 openai.api_key = "free"#os.getenv(OPENAI_API_KEY) #老版本,过时了,1.2已经不支持了 openai.api_base = "http://127.0.0.1:8000/v1" #在这里设置…

Java入门:08.Java中的static关键字

1 static关键字 可以修饰属性变量&#xff0c;方法和代码段 static修饰的属性称为静态属性或类属性&#xff0c; 在类加载时就在方法区为属性开辟存储空间&#xff0c;无论创建多少个对象&#xff0c;静态属性在内存中只有一份。 可以使用 类名.静态属性 的方式引用 static修饰…

图的基础概念

图和树一样&#xff0c;是一种十分重要的算法思想&#xff0c;是很多算法比如floyd算法&#xff0c;Dijkstra算法等的实现基础 一、节点和边 节点和边是图的基本组成部分&#xff0c;以公交路线图为例&#xff0c;每一个站点相当与图的节点&#xff0c;连接每一个站点的路线相…

【03】深度学习——神经网络原理 | 多层感知机 | 前向传播和反向传播 | 多层感知机代码实现 | 回归问题、分类问题 | 多分类问题代码实现

深度学习 1.神经网络原理1.1神经元模型1.2神经网络结构1.3隐藏层1.3.1激活函数层 1.4输出层1.4.1softmax层 1.5损失函数1.6反向传播 2.多层感知机2.1线性网络的局限性2.2引入非线性2.3多层感知机&#xff08;Multi-Layer Perceptron&#xff0c;MLP&#xff09;2.4激活函数&…

卷轴模式系统源码开发在当今时代的多重益处

随着信息技术的飞速发展&#xff0c;数字化转型已成为各行各业不可逆转的趋势。在这一背景下&#xff0c;卷轴模式系统&#xff08;这里的“卷轴模式”可理解为一种以滚动、分层或模块化展示信息的界面设计方式&#xff0c;类似于古代卷轴展开的过程&#xff0c;但更多地是指其…

2024金砖展 | 蓝卓:“1+2+N”智能企业新架构,赋能全球工业数字化转型

2024金砖国家新工业革命展——工业互联网专题展览作为2024金砖国家新工业革命展聚焦工业互联网的专题展示区域&#xff0c;全面展示工业互联网新技术、新产品、新方案、新应用、新项目、新生态等。 展览时间&#xff1a;2024年9月8日-9月11日 展览地点&#xff1a;厦门国际会展…

FreeRTOS学习记录——持续更新

目录 入门知识&#xff1a; 裸机与FreeRTOS: 裸机&#xff1a; RTOS系统&#xff1a; 基础知识: 任务调度&#xff1a; 分类&#xff1a; 时间片调度&#xff1a; 任务状态&#xff08;四种&#xff09;&#xff1a; 四种状态图片&#xff1a; 入门知识&#xff1a; …