一 复选框按钮

 import 'package:flutter/material.dart';

class CheckBoxDemo extends StatefulWidget {
  const CheckBoxDemo({Key? key}) : super(key: key);

  @override
  State<CheckBoxDemo> createState() => _CheckBoxDemoState();
}

class _CheckBoxDemoState extends State<CheckBoxDemo> {
  bool _checkboxItem  = true;
  @override
  Widget build(BuildContext context) {
    return Scaffold(

        appBar: AppBar(
        // TRY THIS: Try changing the color here to a specific color (to
        // Colors.amber, perhaps?) and trigger a hot reload to see the AppBar
        // change color while the other colors stay the same.
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
    // Here we take the value from the MyHomePage object that was created by
    // the App.build method, and use it to set our appbar title.
    title: Text('CheckBoxDemo'),

    ),
          body: Container(
            child: Column(
              children: [
                Checkbox(
                    value: _checkboxItem,
                    onChanged: (value){
                      setState(() {
                        _checkboxItem = value?? true;
                     //   _checkboxItem = value??;
                      });
                },
                  activeColor: Colors.yellow,

                )
              ],
            ),
          ),

    );
  }
}

二 带图标 文字的复选按钮

 import 'package:flutter/material.dart';

class CheckBoxDemo extends StatefulWidget {
  const CheckBoxDemo({Key? key}) : super(key: key);

  @override
  State<CheckBoxDemo> createState() => _CheckBoxDemoState();
}

class _CheckBoxDemoState extends State<CheckBoxDemo> {
  bool _checkboxItem  = true;
  @override
  Widget build(BuildContext context) {
    return Scaffold(

        appBar: AppBar(
        // TRY THIS: Try changing the color here to a specific color (to
        // Colors.amber, perhaps?) and trigger a hot reload to see the AppBar
        // change color while the other colors stay the same.
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
    // Here we take the value from the MyHomePage object that was created by
    // the App.build method, and use it to set our appbar title.
    title: Text('CheckBoxDemo'),

    ),
          body: Container(
            child: Column(
              children: [
                CheckboxListTile(value: _checkboxItem, onChanged: (value){
                 setState(() {
                   _checkboxItem = value ?? false;
                 });
                } ,
                  title:Text('ddfd') ,
                  subtitle: Text('db'),
                  secondary: Icon(Icons.baby_changing_station),
                  selected: _checkboxItem,

                )
                // Checkbox(
                //     value: _checkboxItem,
                //     onChanged: (value){
                //       setState(() {
                //         _checkboxItem = value?? true;
                //      //   _checkboxItem = value??;
                //       });
                // },
                //   activeColor: Colors.yellow,
                //
                // )
              ],
            ),
          ),

    );
  }
}

image.png

三 单选按钮

 import 'package:flutter/material.dart';

class CheckBoxDemo extends StatefulWidget {
  const CheckBoxDemo({Key? key}) : super(key: key);

  @override
  State<CheckBoxDemo> createState() => _CheckBoxDemoState();
}

class _CheckBoxDemoState extends State<CheckBoxDemo> {
   int _radionGroup = 0;
   void _handelRadioValueChange (vale){
     setState(() {
       _radionGroup = vale! ;
     });
   }
  @override
  Widget build(BuildContext context) {
    return Scaffold(

        appBar: AppBar(
        // TRY THIS: Try changing the color here to a specific color (to
        // Colors.amber, perhaps?) and trigger a hot reload to see the AppBar
        // change color while the other colors stay the same.
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
    // Here we take the value from the MyHomePage object that was created by
    // the App.build method, and use it to set our appbar title.
    title: Text('CheckBoxDemo'),

    ),
          body: Container(
            child: Column(
              children: [
                Radio(
              value: 0,
                    groupValue: _radionGroup,
                    onChanged: _handelRadioValueChange,
activeColor: Colors.black,
                ),
                Radio(
                  value: 1,
                  groupValue: _radionGroup,
                  onChanged: _handelRadioValueChange,
                  activeColor: Colors.black,
                ),
              ],
            ),
          ),

    );
  }
}

image.png

四 带标签与图标的单选按钮_

 import 'package:flutter/material.dart';

class CheckBoxDemo extends StatefulWidget {
  const CheckBoxDemo({Key? key}) : super(key: key);

  @override
  State<CheckBoxDemo> createState() => _CheckBoxDemoState();
}

class _CheckBoxDemoState extends State<CheckBoxDemo> {
   int _radionGroup = 0;
   void _handelRadioValueChange (vale){
     setState(() {
       _radionGroup = vale! ;
     });
   }
  @override
  Widget build(BuildContext context) {
    return Scaffold(

        appBar: AppBar(
        // TRY THIS: Try changing the color here to a specific color (to
        // Colors.amber, perhaps?) and trigger a hot reload to see the AppBar
        // change color while the other colors stay the same.
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
    // Here we take the value from the MyHomePage object that was created by
    // the App.build method, and use it to set our appbar title.
    title: Text('CheckBoxDemo'),

    ),
          body: Container(
            child: Column(
              children: [
                RadioListTile(
              value: 0,
                    groupValue: _radionGroup,
                    onChanged: _handelRadioValueChange,
title: Text('ddd'),
subtitle: Text('dss'),
secondary: Icon(Icons.face),
selected: _radionGroup == 0,
activeColor: Colors.black,
                ),
                RadioListTile(
                  value: 1,
                  groupValue: _radionGroup,
                  onChanged: _handelRadioValueChange,
                  title: Text('SS'),
                  subtitle: Text('QQ'),
                  secondary: Icon(Icons.face_4_rounded),
                  selected: _radionGroup == 0,
                  activeColor: Colors.black,
                ),
              ],
            ),
          ),

    );
  }
}

image.png