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

标签 flutter dart

期待圆形的复选框,里面有右边的刻度线

最佳答案

以下是带有圆形区域和中间复选标记的示例 Widget。
您可以使用它来实现圆形复选标记。
此示例最初来自此 SO 答案 here .

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,
                    ),
            ),
        ),
        )),
    );
}

关于flutter - 如何使用 flutter 使复选框形状变为圆形,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57748044/

相关文章:

firebase - Flutter Web - 未创建 Firebase 应用程序 '[DEFAULT]' - 调用 Firebase App.initializeApp() (app/no-app)

flutter - 如何解决Flutter中的窗口小部件溢出问题?

android - flutter 中的响应式用户界面

node.js - Flutter socket.io 连接到 Nodejs socket.io

flutter - 我如何在 flutter 的 child 体内使用if/else语句?

flutter - AlertDialog 关闭后 Statefulwidget 不刷新

import - 如何在 Flutter 中正确导入开源项目?

firebase - 是 Firebase 音乐流应用程序的理想选择。 ( flutter )

flutter - flutter/dart 中的甘特图

Flutter 2 - 设置自动完成 TextFormField 的初始值