首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >如何使用flutter将复选框形状变为圆形

如何使用flutter将复选框形状变为圆形
EN

Stack Overflow用户
提问于 2019-09-02 01:19:05
回答 4查看 6.1K关注 0票数 3

应为内含右勾号的圆形复选框

EN

回答 4

Stack Overflow用户

发布于 2019-09-02 01:26:05

下面是一个带有圆形区域和中间复选标记的示例Widget。您可以使用此选项来实现循环复选标记。

此示例最初来自于此,因此请回答here

代码语言:javascript
运行
复制
bool _value = false;

@override
Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
        title: Text("Circle CheckBox"),
        ),
        body: Center(
            child: InkWell(
        onTap: () {
            setState(() {
            _value = !_value;
            });
        },
        child: Container(
            decoration: BoxDecoration(shape: BoxShape.circle, color: Colors.blue),
            child: Padding(
            padding: const EdgeInsets.all(10.0),
            child: _value
                ? Icon(
                    Icons.check,
                    size: 30.0,
                    color: Colors.white,
                    )
                : Icon(
                    Icons.check_box_outline_blank,
                    size: 30.0,
                    color: Colors.blue,
                    ),
            ),
        ),
        )),
    );
}
票数 4
EN

Stack Overflow用户

发布于 2019-09-02 01:49:02

对于这个需求,pub dev提供了一个包circular_check_box

请参阅此链接https://pub.dev/packages/circular_check_box

详细解释将在上面的链接中提供

票数 3
EN

Stack Overflow用户

发布于 2021-06-18 12:46:18

代码语言:javascript
运行
复制
Theme(
                data: ThemeData(
                    checkboxTheme: CheckboxThemeData(
                        shape: RoundedRectangleBorder(
                            borderRadius: BorderRadius.circular(25)))),
                child: CheckboxListTile(
                  value: model.specialSale,
                  secondary: Icon(
                    CustomIcons.percentage,
                    color: Theme.of(context).primaryColor,
                  ),
                  onChanged: (v) {
                
                  },
                  title: Text("Checked"),
                ),
              ),
票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/57748044

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档