8、button组件

Flutter提供了几种类型的按钮组件：

• RaisedButton
• FloatingActionButton
• FlatButton IconButton
• PopupMenuButton

下面用一段代码说明这几种按钮的用法：

main() {
  runApp(new MyApp());
}

enum WhyFarther { harder, smarter, selfStarter, tradingCharter }

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
        title: 'Test',
        home: new Scaffold(
            appBar: new AppBar(
                title: new Text('Test')
            ),
            body: new Column(
              children: [
                new RaisedButton(
                  child: new Text("Raised Button"),
                  onPressed: (){},
                ),
                new FloatingActionButton(
                  child: new Icon(Icons.add),
                  onPressed: (){},
                ),
                new FlatButton(
                    onPressed: (){},
                    child: new Text("Flat Button")
                ),
                new IconButton(
                    icon: new Icon(Icons.list),
                    onPressed: (){}
                ),
                new PopupMenuButton(
                  onSelected: (WhyFarther result) {},
                  itemBuilder: (BuildContext context) => >[
                    const PopupMenuItem(
                      value: WhyFarther.harder,
                      child: const Text('Working a lot harder'),
                    ),
                    const PopupMenuItem(
                      value: WhyFarther.smarter,
                      child: const Text('Being a lot smarter'),
                    ),
                    const PopupMenuItem(
                      value: WhyFarther.selfStarter,
                      child: const Text('Being a self-starter'),
                    ),
                    const PopupMenuItem(
                      value: WhyFarther.tradingCharter,
                      child: const Text('Placed in charge of trading charter'),
                    ),
                  ],
                )
              ],
            )
        )
    );
  }
}

image.png