flutter Material风格-按钮-摩杜云开发者社区

1.MaterialButton

MaterialApp(
      home: Scaffold(
          appBar: AppBar(
            title: Text("测试"),
          ),
          body: Center(
              child: MaterialButton(
            color: Colors.blue,
            textColor: Colors.white,
            child: Text('按钮'),
            onPressed: () {},
          ))),
    );

flutter Material风格-按钮_Text

2.RaisedButton

MaterialApp(
      home: Scaffold(
          appBar: AppBar(
            title: Text("测试"),
          ),
          body: Center(
              child: RaisedButton(
            color: Colors.blue,
            textColor: Colors.white,
            child: Text('按钮'),
            onPressed: () {},
          ))),
    );

flutter Material风格-按钮_Text_02

3.FlatButton

MaterialApp(
      home: Scaffold(
          appBar: AppBar(
            title: Text("测试"),
          ),
          body: Center(
              child: FlatButton(
            color: Colors.blue,
            textColor: Colors.white,
            child: Text('按钮'),
            onPressed: () {},
          ))),
    );

flutter Material风格-按钮_Text_03

4.IconButton

MaterialApp(
      home: Scaffold(
          appBar: AppBar(
            title: Text("测试"),
          ),
          body: Center(
              child: IconButton(
            color: Colors.green,
            icon: Icon(Icons.pets),
            //长按提示
            tooltip: "ok",
            onPressed: () {},
          ))),
    );

flutter Material风格-按钮_Text_04

5.FloatingActionButton

MaterialApp(
      home: Scaffold(
          appBar: AppBar(
            title: Text("测试"),
          ),
          body: Center(
              child: FloatingActionButton(
            backgroundColor: Colors.red,
            child: Icon(Icons.arrow_upward),
            onPressed: () {},
          ))),
    );

flutter Material风格-按钮_Text_05

6.OutlineButton

MaterialApp(
      home: Scaffold(
          appBar: AppBar(
            title: Text("测试"),
          ),
          body: Center(
              child: OutlineButton(
            child: Icon(Icons.pets),
            onPressed: () {},
          ))),
    );

flutter Material风格-按钮_sed_06

7.DropdownButton

下拉按钮

MaterialApp(
      home: Scaffold(
          appBar: AppBar(
            title: Text("测试"),
          ),
          body: Center(
              child: DropdownButton(
            value: value,
            icon: Icon(Icons.arrow_upward),
            onChanged: (String newValue) {
              setState(() {
                value = newValue;
              });
            },
            items: <String>['a', 'b', 'c', 'd']
                .map<DropdownMenuItem<String>>((String value) {
              return DropdownMenuItem<String>(
                value: value,
                child: Text(value),
              );
            }).toList(),
          ))),
    );

flutter Material风格-按钮_sed_07

flutter Material风格-按钮_Text_08