一个典型的AppBar，带有标题、操作和溢出的下拉菜单。

    Android screenshot
    Android 截图

    一个应用程序有六种操作选项，选项由图标和标题组成。两个最常用的选项可用作操作按钮，其余选项包含在溢出下拉菜单中。

    通过flutter create命令创建一个新项目，并用下面的代码替换lib/main.dart的内容来尝试运行一下。

    1. // Copyright 2017 The Chromium Authors. All rights reserved.
    2. // Use of this source code is governed by a BSD-style license that can be
    3. // found in the LICENSE file.
    5. import 'package:flutter/material.dart';
    7. // This app is a stateful, it tracks the user's current choice.
    8. class BasicAppBarSample extends StatefulWidget {
    9.   @override
    10.   _BasicAppBarSampleState createState() => new _BasicAppBarSampleState();
    11. }
    13. class _BasicAppBarSampleState extends State<BasicAppBarSample> {
    14.   Choice _selectedChoice = choices[0]; // The app's "state".
    16.   void _select(Choice choice) {
    17.     setState(() { // Causes the app to rebuild with the new _selectedChoice.
    18.       _selectedChoice = choice;
    19.     });
    20.   }
    22.   @override
    23.   Widget build(BuildContext context) {
    24.     return new MaterialApp(
    25.       home: new Scaffold(
    26.         appBar: new AppBar(
    27.           title: const Text('Basic AppBar'),
    28.           actions: <Widget>[
    29.             new IconButton( // action button
    30.               icon: new Icon(choices[0].icon),
    31.               onPressed: () { _select(choices[0]); },
    32.             ),
    33.             new IconButton( // action button
    34.               icon: new Icon(choices[1].icon),
    35.               onPressed: () { _select(choices[1]); },
    36.             ),
    37.             new PopupMenuButton<Choice>( // overflow menu
    38.               onSelected: _select,
    39.               itemBuilder: (BuildContext context) {
    40.                 return choices.skip(2).map((Choice choice) {
    41.                   return new PopupMenuItem<Choice>(
    42.                     value: choice,
    43.                     child: new Text(choice.title),
    44.                   );
    45.                 }).toList();
    46.               },
    47.             ),
    48.           ],
    49.         ),
    50.         body: new Padding(
    51.           padding: const EdgeInsets.all(16.0),
    52.           child: new ChoiceCard(choice: _selectedChoice),
    53.         ),
    54.       ),
    55.     );
    56.   }
    57. }
    59. class Choice {
    60.   const Choice({ this.title, this.icon });
    61.   final String title;
    62.   final IconData icon;
    63. }
    65. const List<Choice> choices = const <Choice>[
    66.   const Choice(title: 'Car', icon: Icons.directions_car),
    67.   const Choice(title: 'Bicycle', icon: Icons.directions_bike),
    68.   const Choice(title: 'Boat', icon: Icons.directions_boat),
    69.   const Choice(title: 'Bus', icon: Icons.directions_bus),
    70.   const Choice(title: 'Train', icon: Icons.directions_railway),
    71.   const Choice(title: 'Walk', icon: Icons.directions_walk),
    72. ];
    74. class ChoiceCard extends StatelessWidget {
    75.   const ChoiceCard({ Key key, this.choice }) : super(key: key);
    77.   final Choice choice;
    79.   @override
    80.   Widget build(BuildContext context) {
    81.     final TextStyle textStyle = Theme.of(context).textTheme.display1;
    82.     return new Card(
    83.       color: Colors.white,
    84.       child: new Center(
    85.         child: new Column(
    86.           mainAxisSize: MainAxisSize.min,
    87.           crossAxisAlignment: CrossAxisAlignment.center,
    88.           children: <Widget>[
    89.             new Icon(choice.icon, size: 128.0, color: textStyle.color),
    90.             new Text(choice.title, style: textStyle),
    91.           ],
    92.         ),
    93.       ),
    94.     );
    95.   }
    96. }
    98. void main() {
    99.   runApp(new BasicAppBarSample());
    100. }

    也可以看看: