Flutter学习之旅-IconButton、PopupMenuButton

1.IconButton

• IconButton widget上的图片，通过填充颜色来对触摸作出反应
• 图标按钮通常在AppBar.actions字段中使用，但它们也可以用在其他地方
• 如果尝试更改按钮颜色但是没有效果，请检查onPressed是否为null

class IconButtonDefault extends StatelessWidget {
  final bool isDisabled;

  const IconButtonDefault([this.isDisabled = true]):assert(isDisabled != null),super();

  @override
    Widget build(BuildContext context) {
      return IconButton(
        icon: Icon(Icons.volume_up),
        color: Colors.red,
        tooltip: 'Increase volume by 10%',
        onPressed: isDisabled ? (){}:null,
      );     
    }
}

2.PopupMenuButton

一个提供菜单栏弹出对话框按钮。

• 点击的时候弹出菜单栏对话框，当选择其中一项后会调用onSelected方法。传递其所选的菜单项的值。
• 可以提供一个child widget 或者提供一个icon给他。但是不能两者都提供；
• 如果什么都没有提供给PopupMenuButton，则会根据运行平台创建一个overflow icon
• PopupMenuButton通常配合PopupMenuItem一起使用
  -enabled 标识当前item是否可以点击
• PopupMenuItem可以在child中传入带有icon的widget
• 可以指定PopupMenuButton的初始值initialValue

class PopupMenuButttonDemo extends StatefulWidget {
   _PopupMenuButttonDemoState createState() => _PopupMenuButttonDemoState();
}

class _PopupMenuButttonDemoState extends State {
  final String _simpleValue1 = 'Menu item value one';
  final String _simpleValue2 = 'Menu item value Two';
  final String _simpleValue3 = 'Menu item value Three';
  String _simpleValue;

  void showMenuSelection(String value) {
    if([_simpleValue1,_simpleValue2,_simpleValue3].contains(value))
      _simpleValue = value;
    Scaffold.of(context).showSnackBar(
      SnackBar(
        content: Text('You selected: $value')
      )
    );
  }

  @override
  void initState() {
    super.initState();
    _simpleValue = _simpleValue2;
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      child: Column(
        children: [
          ListTile(
            title: const Text('An item with a context menu button'),
            trailing: PopupMenuButton(
              padding: EdgeInsets.zero,
              onSelected: showMenuSelection,
              itemBuilder: (BuildContext context) => >[
                PopupMenuItem(
                  value: _simpleValue1,
                  child: Text('Context menu item one'),
                ),
                const PopupMenuItem(
                  enabled: false,
                  child: Text('A disabled menu item'),
                ),
                PopupMenuItem(
                  value: _simpleValue1,
                  child: Text('Context menu item Three'),
                )
              ],
            ),
          ),
          ListTile(
            title: const Text('An item with a sectiond menu'),
            trailing: PopupMenuButton(
              padding: EdgeInsets.zero,
              onSelected: showMenuSelection,
              itemBuilder: (BuildContext context) => >[
                const PopupMenuItem(
                  value: 'Preview',
                  child: ListTile(
                    leading: Icon(Icons.visibility),
                    title: Text('Preview'),
                  ),
                ),
                const PopupMenuItem(
                  value: 'Share',
                  child: ListTile(
                    leading: Icon(Icons.person_add),
                    title: Text('Share'),
                  ),
                ),
                const PopupMenuItem(
                  value: 'Get Link',
                  child: ListTile(
                    leading: Icon(Icons.link),
                    title: Text('Get link'),
                  ),
                ),
                const PopupMenuDivider(),
                const PopupMenuItem(
                  value: 'Remove',
                  child: ListTile(
                    leading: Icon(Icons.delete),
                    title: Text('Remove'),
                  ),
                )
              ],
            ),
          )
        ],
      ),
    );
  }
}