您的位置:首页 > 汽车 > 新车 > Flutter【组件】标签

Flutter【组件】标签

2024/10/19 5:10:40 来源:https://blog.csdn.net/weixin_42731928/article/details/140262523  浏览:    关键词:Flutter【组件】标签

简介

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
}

版权声明:

本网仅为发布的内容提供存储空间,不对发表、转载的内容提供任何形式的保证。凡本网注明“来源:XXX网络”的作品,均转载自其它媒体,著作权归作者所有,商业转载请联系作者获得授权,非商业转载请注明出处。

我们尊重并感谢每一位作者,均已注明文章来源和作者。如因作品内容、版权或其它问题,请及时与我们联系,联系邮箱:809451989@qq.com,投稿邮箱:809451989@qq.com