Flutter【组件】标签

ops/2024/10/20 16:04:46/

简介

flutter 标签组件。标签组件是一种常见的 UI 元素,用于显示和管理多个标签(或标签集合)。

github地址: https://github.com/ThinkerJack/jac_uikit

pub地址:https://pub.dev/packages/jac_uikit

使用方式:

              Row(children: const [JacTag(paddingVertical: 1,paddingHorizontal: 6,tagType: JacTagType.text,tagShapeType: JacTagShapeType.rectangle,tagColorType: JacTagColorType.blue,text: "标签",fontSize: 12,),SizedBox(width: 20,),JacTag(paddingVertical: 1,paddingHorizontal: 6,tagType: JacTagType.text,tagShapeType: JacTagShapeType.rectangle,tagColorType: JacTagColorType.gray,text: "标签",fontSize: 12,),SizedBox(width: 20,),JacTag(paddingVertical: 1,paddingHorizontal: 6,tagType: JacTagType.text,tagShapeType: JacTagShapeType.rectangle,tagColorType: JacTagColorType.green,text: "标签",fontSize: 12,),SizedBox(width: 20,),JacTag(paddingVertical: 1,paddingHorizontal: 6,tagType: JacTagType.text,tagShapeType: JacTagShapeType.rectangle,tagColorType: JacTagColorType.black,text: "标签",fontSize: 12,),SizedBox(width: 20,),JacTag(paddingVertical: 1,paddingHorizontal: 6,tagType: JacTagType.text,tagShapeType: JacTagShapeType.rectangle,tagColorType: JacTagColorType.red,text: "标签",fontSize: 12,),SizedBox(width: 20,),JacTag(paddingVertical: 1,paddingHorizontal: 6,tagType: JacTagType.text,tagShapeType: JacTagShapeType.rectangle,tagColorType: JacTagColorType.yellow,text: "标签",fontSize: 12,),],),space,Row(children: const [SizedBox(width: 30,),JacTag(paddingVertical: 5,paddingHorizontal: 10,tagType: JacTagType.icon,tagShapeType: JacTagShapeType.semicircle,tagColorType: JacTagColorType.blue,text: "标签",icon: Icon(Icons.ac_unit,size: 14,color: Color(0XFF5590F6),),fontSize: 14,),SizedBox(width: 30,),JacTag(paddingVertical: 5,paddingHorizontal: 10,tagType: JacTagType.icon,tagShapeType: JacTagShapeType.rectangle,tagColorType: JacTagColorType.blue,text: "标签",icon: Icon(Icons.ac_unit,size: 14,color: Color(0XFF5590F6),),fontSize: 14,),SizedBox(width: 30,),JacTag(paddingVertical: 5,paddingHorizontal: 10,tagType: JacTagType.icon,tagShapeType: JacTagShapeType.capsule,tagColorType: JacTagColorType.blue,text: "标签",icon: Icon(Icons.ac_unit,size: 14,color: Color(0XFF5590F6),),fontSize: 14,),],),

图片示例:

参数:

  final double paddingVertical; //垂直内边距final double paddingHorizontal; //水平内边距final JacTagType tagType; //tag类型final JacTagShapeType tagShapeType; //tag形状类型final JacTagColorType tagColorType; //tag颜色类型final String text; //文字内容final double fontSize; //字体大小final Widget? icon; //左侧图标
​
//tag颜色类型
enum JacTagColorType { black, blue, green, yellow, red, gray }
​
//tag形状类型
enum JacTagShapeType {//半圆semicircle,//矩形rectangle,//胶囊capsule
}
​
//tag类型
enum JacTagType {//纯文字text,//icon+文字icon
}

http://www.ppmy.cn/ops/56265.html

相关文章

MSPM0G3507——超声波模块移植代码

超声波没有做单独的代码文件 直接自己创建.c.h文件,将这些复制粘贴即可,然后进行SYSCFG配置按照这些配置即可,有啥问题直接评论区提出,如果看不懂的话评论区说一下,再出讲解 超声波.c文件 #include "ti_msp_dl…

【MySQL】MySQL索引失效场景

文章目录 前言一、说明举例1. 函数操作与索引失灵2. 数据类型错配3. LIKE操作符与通配符的陷阱4. OR逻辑运算的索引挑战5. 复合索引与最左前缀规则6. 特定比较操作符的局限 二、总结 前言 在数据库管理和优化的天地里,索引如同图书的目录,极大地加速了数…

appium 实战问题 播放视频时无法定位到元素

背景 在做UI自动化时,有播放详情页的用例,但是发现视频在播放的时候无法定位到元素或者很慢,了解到appium在动态的页面实时获取布局元素导致定位变慢。所以只能将视频暂停在操作元素,点击到暂停按钮又是个问题,通过ad…

LLM - Transformer 的 多头自注意力(MHSA) 理解与源码

欢迎关注我的CSDN:https://spike.blog.csdn.net/ 本文地址:https://spike.blog.csdn.net/article/details/140281680 免责声明:本文来源于个人知识与公开资料,仅用于学术交流,欢迎讨论,不支持转载。 在 Transformer 中,多头自注意力机制 (MHSA, Multi-Head Self-Attenti…

SAP PS学习笔记01 - PS概述,创建Project和WBS

本章开始学习PS(Project System)。 1,PS的概述 PS(Project System)是SAP企业资源规划系统中的一个关键模块,主要用于项目管理。 它提供了一个全面的框架来规划、控制和执行项目,涵盖了从项目启…

数据结构第08小节:双端队列

双端队列(deque,double-ended queue)是一种具有队列和栈特性的数据结构,允许在其两端进行插入和删除操作。在Java中,java.util.Deque接口就是双端队列的实现,而ArrayDeque和LinkedList是其中的具体实现类。…

压测jmeter 插件 之 tps和响应时间图

1. 背景 进行压测ing 2. 需要插件 TPS 和 响应时间 3. 插件 在 选项-最下面-plugins Manager 在 Available Plugins 中 搜索 :jpgc - Standard Set 重启安装就好啦

dify/api/models/web.py文件中的数据表

源码位置:dify/api/models/web.py SavedMessage 表结构 字段英文名数据类型字段中文名字备注idStringUUIDIDUUID生成app_idStringUUID应用ID非空message_idStringUUID消息ID非空created_by_roleString创建者角色非空,默认值为’end_user’created_bySt…