Flutter基础(前端教程①①-底部导航栏)

1. 主页面(BottomNavBarPage)
  • 用 _currentBarIndex 记录当前选中的导航索引(默认 0,即首页)。
  • 用 IndexedStack 管理 4 个页面,通过 _currentBarIndex 控制显示哪个页面(比如索引 1 就显示 NodePage)。
  • 底部导航栏用 CustomNavigationBar 组件,传递当前索引和点击回调。
2. 底部导航栏(CustomNavigationBar)
  • 定义了 4 个导航项(NavItem),每个包含标题、图标、是否选中(isHighlighted)。
  • 通过 Row 横向排列 4 个导航项,每个占满屏幕宽度的 1/4(Expanded 组件实现)。
  • 点击导航项时,触发 onTap 回调,更新 _currentBarIndex 切换页面。
3. 导航项样式(选中 / 未选中)
  • 未选中状态_buildIconContainer):灰色图标,无背景。
  • 选中状态_buildHighlightedIconContainer):白色图标,带渐变绿色椭圆形背景(有边框),文字也变为亮绿色。
  • 通过 isHighlighted 判断状态,动态切换样式。

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

HTML 入门教程:从零开始学习网页开发基础

一、HTML简介 1.1 什么是HTML? HTML全称是Hyper Text Markup Language(超文本标记语言),由Tim Berners-Lee和同事Daniel W. Connolly于1990年创立。它是一种用于创建网页的标准标记语言,而不是编程语言。 1.2 HTML的…

LeetCode Hot100【4. 寻找两个正序数组的中位数】

4. 寻找两个正序数组的中位数 自己做 分析 解1&#xff1a;归并思想 class Solution { public:double findMedianSortedArrays(vector<int>& nums1, vector<int>& nums2) {int sum 0;double value;queue<double> value2;int i 0, j 0;if ((nums…

JobSet:Kubernetes 分布式任务编排的统一解决方案

JobSet–Kubernetes 分布式任务编排的统一解决方案 在 Kubernetes 生态中&#xff0c;分布式机器学习训练和高性能计算&#xff08;HPC&#xff09;工作负载的编排一直是技术难点。随着大语言模型&#xff08;LLM&#xff09;等大型 AI 模型的兴起&#xff0c;单主机资源已无法…

【电脑】显示器的基础知识

显示器是计算机系统中用于显示图像、文本和其他视觉内容的重要组件。它将电子信号转化为可见的图像&#xff0c;使用户可以直观地查看和操作数据。以下是关于显示器的一些详细知识&#xff1a;1. 显示器的基本类型CRT显示器&#xff08;阴极射线管显示器&#xff09;工作原理&a…

【删库跑路】一次删除pip的所有第三方库

进入命令行&#xff0c;先list看下库存pip list导出所有的第三方库至一文件列表pip freeze >requirements.txt按照列表卸载所有库pip uninstall -r requirements.txt -y再list看下&#xff0c;可见库存已清空

19.如何将 Python 字符串转换为 Slug

如何将 Python 字符串转换为 Slug(URL 友好格式) 什么是 Slug? Slug 是一种 URL 友好、便于人类阅读的字符串。只包含小写字母、数字和连字符(-)。常见于文章标题、商品名等生成的网址路径中。例如: "Hello World!" → "hello-world"1. Slugify 的…

3.2数据库-关系代数-函数依赖-范式

1、关系代数基础1、并U&#xff1a;记录合并&#xff0c;相同记录只显示一次2、交&#xff1a;两张表都有的记录。3、差&#xff1a;S1-S2 表示S1减去S2中也有的数据。笛卡尔积&#xff08;重要&#xff09;1、笛卡尔积&#xff1a;S1*S2 :列是所有列全部加起来&#xff0c;重复…

[ROS 系列学习教程] ROS动作通讯(Action):通信模型、Hello World与拓展

ROS 系列学习教程(总目录) ROS2 系列学习教程(总目录) 文章目录一、动作通讯模型二、动作通讯流程2.1 任务添加阶段2.2 任务执行阶段2.3 任务完成阶段三、Action Hello World3.1 创建并初始化功能包3.2 确定Action名称及消息格式3.3 配置编译文件3.4 实现服务端与客户端&#x…

【C++】初识C++(1)

个人主页&#xff1a;我要成为c嘎嘎大王 希望这篇小小文章可以让你有所收获&#xff01; 目录 前言 一、C的第一个程序 二、命名空间 2.1 namespace 的价值 2.2 namespace 的定义 2.2.1 正常的命名空间定义 2.2.2 命名空间可以嵌套 2.2.3 匿名命名空间 2.2.4 同名的name…

Spark Expression codegen

Expression codegen src/main/scala/org/apache/spark/sql/catalyst/expressions/Expression.scala def genCode(ctx: CodegenContext): ExprCode = {ctx.subExprEliminationExprs.get(ExpressionEquals(

02 51单片机之LED闪烁

文章目录1、单片机1-1、简介1-2、应用场景2、51单片机2-1、背景2-2、主要品牌及其产品2-3、基本组成2-4、命名规则3、单片机内部结构3-1、单片机内部结构图3-2、单片机内部结构3-3、单片机内部管脚图3-4、单片机最小系统3-5、开发板介绍4、点亮LED4-1、新建工程4-1-1、创建工程…

穿透、误伤与回环——Redis 缓存防御体系的负向路径与治理艺术

一、写在前面&#xff1a;当“防御”成为新的“攻击” 在构建 Redis 缓存防线时&#xff0c;我们往往陷入一个悖论&#xff1a;为了拦截 0.1% 的幽灵查询&#xff0c;引入了布隆过滤器、空值缓存、限流器&#xff0c;结果却让 5% 的正常请求被误杀&#xff0c;甚至引发更复杂的…