Flutter 组单选Radio

作者: 王俏 | 来源:发表于2019-10-10 10:49 被阅读0次

    Radio

    class RadioDemo extends StatefulWidget {
      @override
      _RadioDemoState createState() => _RadioDemoState();
    }
    
    class _RadioDemoState extends State<RadioDemo> {
      int _radioGroupA = 0;
    
      void _handleRadioValueChanged(int value) {
        setState(() {
          _radioGroupA = value;
        });
      }
    
      @override
      Widget build(BuildContext context) {
        var radioDemo = Row(
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: <Widget>[
                        Radio(
                          value: 0,
                          groupValue: _radioGroupA,//权组值
                          onChanged: _handleRadioValueChanged,
                          activeColor: Colors.black,//选中的颜色
                        ),
                        Radio(
                          value: 1,
                          groupValue: _radioGroupA,//权组值
                          onChanged: _handleRadioValueChanged,
                          activeColor: Colors.black,//选中的颜色
                        )
                      ],
                    );
            return Scaffold(
              appBar: AppBar(
                title: Text('RadioDemo'),
                elevation: 0.0,
              ),
              body: Container(
                padding: EdgeInsets.all(16.0),
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: <Widget>[
                   radioDemo,
              ],
            ),
          ),
        );
      }
    }
    
    

    RadioListTile

    Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: <Widget>[
                    Text('RadioGroupValue:$_radioGroupA'),
                    SizedBox(height: 32.0),
                   RadioListTile(
                     value: 0,
                     groupValue: _radioGroupA,
                     onChanged: _handleRadioValueChanged,
                     title:Text('Option A') ,
                     subtitle: Text('Description'),
                     secondary: Icon(Icons.filter_1),//右侧图标
                     selected: _radioGroupA == 0,
                   ),
                   RadioListTile(
                     value: 1,
                     groupValue: _radioGroupA,
                     onChanged: _handleRadioValueChanged,
                     title:Text('Option B') ,
                     subtitle: Text('Description'),
                     secondary: Icon(Icons.filter_2),//右侧图标
                     selected: _radioGroupA == 1,
                   ),
              ],
            ),
    
    
    RadioGroupList.png

    相关文章

      网友评论

        本文标题:Flutter 组单选Radio

        本文链接:https://www.haomeiwen.com/subject/zgddyctx.html