7_flutter_Switch(开关),Radio(单选框),Checkbox(复选框)

3,057 阅读1分钟

1_Switch(开关)


import 'package:flutter/material.dart';

void main() => runApp(SnackBarDemo());

class SnackBarDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('SnackBar Demo'),
        ),
        body: SnackBarPage(),
      ),
    );
  }
}

class SnackBarPage extends StatefulWidget {
  @override
  _SnackBarPageState createState() => _SnackBarPageState();
}

class _SnackBarPageState extends State<SnackBarPage> {
 bool _value=false;

  @override
  Widget build(BuildContext context) { 
    
    return Container(
      child: Center(
    child: Switch(
        value: _value,
        onChanged: (bool value) {
               setState(() {
                _value=value;
              if (_value==true) {
             final snackBar = SnackBar(content: Text('开'),);
              Scaffold.of(context).showSnackBar(snackBar); 
          } else {
            final snackBar = SnackBar(content: Text('关'),);
              Scaffold.of(context).showSnackBar(snackBar); 
          }
              });
            },
      )
    )
    );
   
  }
}

2_Radio(单选框)


import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('RadioListTile Demo'),
        ),
        body: SnackBarPage(),
      ),
    );
  }
}

class SnackBarPage extends StatefulWidget {
  @override
  _SnackBarPageState createState() => _SnackBarPageState();
}

class _SnackBarPageState extends State<SnackBarPage> {
 String _groupValue='升压';

  @override
  Widget build(BuildContext context) { 
    
    return Container(
      child: Column(
        children: <Widget>[
          RadioListTile<String>(
            value: '升压',
            title: Text('升压'),
            groupValue: _groupValue,
            onChanged: (value){
              setState(() {
                _groupValue=value;
              });
            },
          ),

            RadioListTile<String>(
            value: '升降压',
            title: Text('升降压'),
            groupValue: _groupValue,
            onChanged: (value){
              setState(() {
                _groupValue=value;
              });
            },
          ),

            RadioListTile<String>(
            value: '降压',
            title: Text('降压'),
            groupValue: _groupValue,
            onChanged: (value){
              setState(() {
                _groupValue=value;
              });
            },
          ),
          RaisedButton(
            onPressed: (){
              final snackBar = SnackBar(content: Text('你选择的是$_groupValue'),);
              Scaffold.of(context).showSnackBar(snackBar);
            },
            child: Text('确定'),
          ),
        ],
      )
    );
   
  }
}

3_Checkbox(复选框)


import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('RadioListTile Demo'),
        ),
        body: SnackBarPage(),
      ),
    );
  }
}

class SnackBarPage extends StatefulWidget {
  @override
  _SnackBarPageState createState() => _SnackBarPageState();
}

class _SnackBarPageState extends State<SnackBarPage> {
 bool _value=false;
 bool _value1=false;
 bool _value2=false;
  @override
  Widget build(BuildContext context) { 
    
    return Container(
      child: Column(
        children: <Widget>[

        CheckboxListTile(
          value: _value,
          title: Text('升压'),
          onChanged: (value){
            setState(() {
              _value=value;
            });
          },
        ),

        CheckboxListTile(
          value: _value1,
          title: Text('升降压'),
          onChanged: (value){
            setState(() {
              _value1=value;
            });
          },
        ),

   CheckboxListTile(
          value: _value2,
          title: Text('降压'),
          onChanged: (value){
            setState(() {
              _value2=value;
            });
          },
        ),
        RaisedButton(
            onPressed: (){
              final snackBar = SnackBar(content: Text('升压$_value,升降压$_value1,降压$_value2'),);
              Scaffold.of(context).showSnackBar(snackBar);
            },
            child: Text('确定'),
          ),

        ],
      )
    );
   
  }
}