第四百二十回

文章目录

  • 1. 概念介绍
  • 2. 思路与方法
    • 2.1 实现思路
    • 2.2 实现方法
  • 3. 示例代码
  • 4. 内容总结

我们在上一章回中介绍了"自定义标题栏"相关的内容,本章回中将介绍自定义Action菜单.闲话休提,让我们一起Talk Flutter吧。

在这里插入图片描述

1. 概念介绍

我们在这里提到的Action菜单是指AppBar中actions属性对应的组件。它和上一章回中介绍的标题栏类似,都位于页面上方,它们都受AppBar组件的控制。一个完整
的AppBar包含导航(返回箭头),标题和Actcons.他们从左到右依次排列。这三个内容中导航是自动生成的,比如从A页面导航到B页面时会 在页面B上显示一个导航图标,
也就是我们常见的返回箭头。标题是页面必备的内容,主要用来显示当前页面的主题。Actions是可选择的内容,它通常用来在AppBar中添加一些附加功能,比如分享
或者下载。本章回中将介绍如何自定义Action菜单,进而打造出功能丰富的AppBar。

2. 思路与方法

2.1 实现思路

我们自定义Action菜单并不是重写相关的组件,而是使用把多个组件组合在一起的形成新的Actions。组合的内容依据自己的需求来制定,这点和上一章回中自定义标题
栏的思路相同。比如,我们对Actions的需求是:显示文本,点击文本后需要弹出功能菜单。有了这个需求后,我们就可以自定义Actions,文本通过TextButton组件
实现,它既可以显示文本内容,又可以响应点击事件。弹出功能菜单通过showMenu和PopupMenu一起实现。

2.2 实现方法

  • 创建TextButton组件,并且把它赋值给AppBar的Actions属性;
  • 创建popMenu,并且通过showMenu来显示,menu的内容可以自定义;
  • 把showMenu赋值给TextButton的onPress属性,用来响应按钮的点击事件;
  • 把TextButton组件赋值给Actions属性,它会显示在AppBar的最右侧;
    我们在上面步骤中使用了pupMenu功能,这里只是概要描述,具体的细节可以参考五十一回介绍相关内容.上面步骤中只是文本描述,内容比较抽象,不容易理解,我们将
    在接下来的小节中通过具体的示例代码来演示。

3. 示例代码

appBar: AppBar(title: Widget(), ///标题栏的内容省略,或者使用上一章回中的示例代码///Action的优先级大于Title,它会占用Title的空间,如果它的空间过大时会把Title覆盖掉///比如把action3-5打开后就会覆盖Title的内容.actions: [SizedBox(width: 80,child: TextButton(onPressed: (){showMenu(context:context,///这个坐标值不好调整,下面我的经验值,位置在手指点击点的左下方,想往左移动给110+数字 往下移动180加数字position: const RelativeRect.fromLTRB(170, 180, 110, 10),items: [///建议指定value属性PopupMenuItem<String>(value: 'one',onTap: ()=> debugPrint('tap one'),child: const Text('1'),),PopupMenuItem<String>(value:'two',onTap: ()=> debugPrint('tap two'),child: const Text('2'),),PopupMenuItem<String>(value:'three',onTap: ()=> debugPrint('tap three'),child: const Text('3'),),],);},child: const Text("action1")),),const SizedBox(width: 80,child: Text("action2"),),// const SizedBox(//   width: 80,//   child: Text("action3"),// ),// const SizedBox(//   width: 80,//   child: Text("action4"),// ),// const SizedBox(//   width: 60,//   child: Text("action5"),// ),],
),

上面的示例代码完全按照实现方法中的步骤来实现,代码中popMenu包含了三个选项,没有具体的功能,只是简单地打印一行日志。菜单的内容大家可以依据自身需求来决
定。代码中还省略了Scaffold以及其它的代码,只保留了AppBar相关的代码。编译并且运行上面的程序可以看到一个标题栏,标题左边是返回箭头,然后就是标题和我
们自定义的Actions菜单。我在这里就不演示程序的运行结果了,建议大家自己动手去实践。
此外,我们再补充一些Action的内容,Action可以包含多个组件,类似Row组件,也就是说可以在AppBar中的显示多个Action,我们在代码中尝试显示五个Action,
结果发现Action会占用Title的空间,如果它的空间过大时会把Title覆盖掉。因此我们推断:Action的优先级比标题(Title)高,当它的宽度过大时会覆盖标题。

4. 内容总结

我们在本章回中演示了如何自定义Acton菜单,并且通过一个需求:显示文本,点击文本后需要弹出功能菜单,介绍了自定义Action的思路和方法。大家可以结合自己在
项目中的需求来自定义Action,自定义的思路就是依据需求组合现有的组件形成新的组件。总之,只要是组件就可以,因为AppBar的actions属性是Widget类型,我
们只需要把自定义的Action值给该属性就可以实现自定义Acttion菜单的功能。
看官们,与"自定义Action菜单"相关的内容就介绍到这里,欢迎大家在评论区交流与讨论!

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

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

相关文章

Excel使用VLOOKUP函数

VLOOKUP(lookup_value,table_array,col_index_num,range_lookup) 释义&#xff1a; lookup_value&#xff1a;要查找的值&#xff0c;包括数字&#xff0c;文本等 table_array&#xff1a;要查找的值以及预期返回的内容所在的区域 col_index_num&#xff1a;查找的区域的列…

第 6 章 ROS-xacro练习(自学二刷笔记)

重要参考&#xff1a; 课程链接:https://www.bilibili.com/video/BV1Ci4y1L7ZZ 讲义链接:Introduction Autolabor-ROS机器人入门课程《ROS理论与实践》零基础教程 6.4.3 Xacro_完整使用流程示例 需求描述: 使用 Xacro 优化 URDF 版的小车底盘模型实现 结果演示: 1.编写 X…

《优化接口设计的思路》系列:第九篇—用好缓存,让你的接口速度飞起来

一、前言 大家好&#xff01;我是sum墨&#xff0c;一个一线的底层码农&#xff0c;平时喜欢研究和思考一些技术相关的问题并整理成文&#xff0c;限于本人水平&#xff0c;如果文章和代码有表述不当之处&#xff0c;还请不吝赐教。 作为一名从业已达六年的老码农&#xff0c…

如何用联合(共用体)union验证系统大小端

一&#xff1a;思路 由联合体的特点&#xff0c;可知上图&#xff0c;char c 和 int i 共用四个字节&#xff0c;假设是小端&#xff0c;则由左到右是低地址到高地址&#xff0c;四个字节的内容如图所示01 00 00 00 代码展示&#xff1a; 如果第一个字节是1&#xff0c;则证明…

体育竞赛成绩管理系统设计与实现|jsp+ Mysql+Java+ B/S结构(可运行源码+数据库+设计文档)

本项目包含可运行源码数据库LW&#xff0c;文末可获取本项目的所有资料。 推荐阅读100套最新项目 最新ssmjava项目文档视频演示可运行源码分享 最新jspjava项目文档视频演示可运行源码分享 最新Spring Boot项目文档视频演示可运行源码分享 2024年56套包含java&#xff0c;…

南京大学AI考研,宣布改考408!

官网还没通知 附上南大与同层次学校近四年的分数线对比&#xff0c;整体很难 添加图片注释&#xff0c;不超过 140 字&#xff08;可选&#xff09; 添加图片注释&#xff0c;不超过 140 字&#xff08;可选&#xff09; 如果确定要冲南大的话建议提早调整自己的复习路线&…

sqlite3 交叉编译

#1.下载源码并解压 源码路径如下&#xff0c;下载autoconf版本 SQLite Download Page 解压 tar -zxvf sqlite-autoconf-3450200.tar.gz cd sqlite-autoconf-3450200 mkdir build # 2. 配置源代码 # 假设你已经安装了交叉编译工具链&#xff0c;如gcc-arm-linux-gnueabih…

Python爬取歌曲宝音乐:轻松下载Jay的歌

歌曲宝是一个不用付费就能听jay的歌曲&#xff0c;但是每次都只能播放一首不方便&#xff0c;于是今天想把它下载下来&#xff0c;本地循环播放&#xff0c;它所用到的接口是某我的还不错哈 获取搜索接口 分析html请求接口&#xff0c;获取到的数据是直接渲染好的HTML内容&…

Python-VBA编程500例-016(入门级)

移动石子算法(Stone-moving Algorithm)是一类在计算机科学和数学中广泛研究的算法问题&#xff0c;通常涉及在特定规则下移动石子以达到某种目标。虽然这些问题本身可能看起来是抽象的&#xff0c;但它们在实际应用中有多种体现&#xff0c;包括但不限于以下领域&#xff1a; …

stable diffusion 提示词进阶语法-年龄身材肤色-学习小结

stable diffusion 提示词进阶语法-年龄&身材&肤色 前言年龄提示词青年&#xff08;18-25岁&#xff09;幼年、少年&#xff08;1-18&#xff09;中年&#xff08;35-60岁&#xff09;老年&#xff08;65-80岁 老爷爷 老奶奶&#xff09; 身材提示词肤色关键词(人物基础…

【现代C++】nullptr用法

在C11之前&#xff0c;NULL被用来表示空指针&#xff0c;但它只是一个宏&#xff0c;定义为0或((void*)0)&#xff0c;这在某些情况下可能会导致类型混淆和错误。为了解决这些问题&#xff0c;C11引入了nullptr关键字&#xff0c;它是一种特殊的空指针字面量&#xff0c;具有自…

一次完整的 HTTP 请求所经历的步骤

1&#xff1a; DNS 解析(通过访问的域名找出其 IP 地址&#xff0c;递归搜索)。 2&#xff1a; HTTP 请求&#xff0c;当输入一个请求时&#xff0c;建立一个 Socket 连接发起 TCP的 3 次握手。如果是 HTTPS 请求&#xff0c;会略微有不同。 3&#xff1a; 客户端向服务器发…

一文详解Rust中的字符串

有人可能会说&#xff0c;字符串这么简单还用介绍&#xff1f;但是很多人学习rust受到的第一个暴击就来自这浓眉大眼、看似毫无难度的字符串。 请看下面的例子。 fn main() {let my_name "World!";greet(my_name); }fn greet(name: String) {println!("Hello…

【Mysql数据库基础03】分组函数(聚合函数)、分组查询

分组函数(聚合函数&#xff09;、分组查询 0 该博客所要用的数据库表的属性1 分组函数1.1 简单的使用1.2 是否忽略null值1.3 和关键字搭配使用1.4 count函数的详细介绍1.5 练习 2 分组查询Group by2.1 简单的分组查询2.2 练习 3 格式投票:yum: 0 该博客所要用的数据库表的属性 …

基于SpringBoot+Redis实现接口限流

前言 业务中需要对一些接口进行限流处理&#xff0c;防止机器人调用或者保证服务质量&#xff1b; 实现方式 基于redis的lua脚本 引入依赖 <dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-data-redis&…

javaWeb点餐平台系统功能介绍说明

开发工具&#xff1a;IDEA 、Eclipse 编程语言: Java 数据库: MySQL5.7 框架&#xff1a;ssm、Springboot 前端&#xff1a;Vue、ElementUI 关键技术&#xff1a;springboot、SSM、vue、MYSQL、MAVEN 数据库工具&#xff1a;Navicat、SQLyog 项目关键技术 1、JSP技术 JSP(Java…

pytest简介以及命令行执行

pytest简介以及安装 pytest简介导入第三方库修改工具类 pytest命令方式执行函数执行pytest中的参数详解 pytest简介 pytest有很多强大的插件 pytest-html &#xff08;生成html格式的自动化测试报告&#xff09; pytest-xdist &#xff08;测试用例分布式执行&#xff0c;多cpu…

鸿蒙Harmony应用开发—ArkTS-@Provide装饰器和@Consume装饰器:与后代组件双向同步

Provide和Consume&#xff0c;应用于与后代组件的双向数据同步&#xff0c;应用于状态数据在多个层级之间传递的场景。不同于上文提到的父子组件之间通过命名参数机制传递&#xff0c;Provide和Consume摆脱参数传递机制的束缚&#xff0c;实现跨层级传递。 其中Provide装饰的变…

目标检测——PP-YOLO算法解读

PP-YOLO系列&#xff0c;均是基于百度自研PaddlePaddle深度学习框架发布的算法&#xff0c;2020年基于YOLOv3改进发布PP-YOLO&#xff0c;2021年发布PP-YOLOv2和移动端检测算法PP-PicoDet&#xff0c;2022年发布PP-YOLOE和PP-YOLOE-R。由于均是一个系列&#xff0c;所以放一起解…

重学SpringBoot3-MyBatis的三种分页方式

更多SpringBoot3内容请关注我的专栏&#xff1a;《SpringBoot3》 期待您的点赞&#x1f44d;收藏⭐评论✍ 重学SpringBoot3-MyBatis的三种分页方式 准备工作环境搭建数据准备未分页效果 1. 使用MyBatis自带的RowBounds进行分页演示 2. 使用物理分页插件演示 3. 手动编写分页SQL…