如何在你的 Flutter 中使用 input chip 标签组件


lang: zh-CN title: 如何在你的 Flutter 中使用 input chip 标签组件 description: 译文

如何在你的 Flutter 中使用 input chip 标签组件

alt
alt

这里有一些拥有属性的 chip,其中之一就是 input chip。input chip 通常用于以保守的结构处理客户端输入或向客户端提供想法。除了 label 和 avtar 之外,input chip 还可以有一个删除图标。在 Flutter 中,您可以利用 InputChip widget 制作这种 chip。

原文 https://medium.flutterdevs.com/input-chip-in-flutter-5e5d98a9eb5d

前言

InputChip 是一个 material widget ,它以保守的结构处理令人难以置信的数据片段。Flutter 提供了一个名为 InputChip 的 widget ,它允许我们在应用程序中添加一个 input chip。

默认情况下,input chip 是禁用的。我们可以通过设置为“选择”来增强它的能力。我们可以给出一个标签,以及它的引导和尾随符号。不同种类的 chip 有 Chip、 ChoiceChip、 ActionChip 和 FilterChip。

https://api.flutter.dev/flutter/material/InputChip-class.html

  • 演示:
alt

这个演示视频显示了如何在 Flutter 中使用 input chip,并显示了 input chip 将如何在 Flutter 应用程序中工作。我们将显示一个用户按下 chip,然后 chip 将被选中,并且用户将删除 chip。它会显示在你们的设备上。

正文

类构造

要利用 InputChip,您需要调用下面的构造函数:

要在 Flutter 中制作 input chip,我们需要利用 Flutter 给出的 InputChip 类的构造函数。

const InputChip({
   

  Key? key,

  this.avatar,

  required this.label,

  this.labelStyle,

  this.labelPadding,

  this.selected &#
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值