2、Flutter Widget(IOS Style) - CupertinoActionSheet;

  iOS风格的模式底部Dialog列表。向用户显示与当前上下文相关的一组两个或更多选项的选择提示;

class CupertinoActionSheetApp extends StatelessWidget{
 @override
  Widget build(BuildContext context)  => CupertinoApp(
   home: _HomePage(),
 );
}

class _HomePage extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
    return Center(
      child: CupertinoButton(child: Text("show dialog"), onPressed: (){
       _showDialog(context);
      }),
    );
  }


  void _showDialog(BuildContext cxt){
    showCupertinoModalPopup<int>(context: cxt, builder:(cxt){
      var dialog =CupertinoActionSheet(
        title: Text("This is Title"),
        message: Text('Chose a item !'),
        cancelButton: CupertinoActionSheetAction(onPressed: (){
        }, child: Text("Cancel")),
        actions: <Widget>[
          CupertinoActionSheetAction(onPressed: (){
            Navigator.pop(cxt,1);

          }, child: Text('Apple')),
          CupertinoActionSheetAction(onPressed: (){
            Navigator.pop(cxt,2);

          }, child: Text('Windows')),
          CupertinoActionSheetAction(onPressed: (){
            Navigator.pop(cxt,3);
          }, child: Text('Linux')),
        ],
      );
      return dialog;
  });
  }
}
复制代码

如上为显示列表的部分代码;

showCupertinoModalPopup 方法

  从屏幕底部向上滑动的模式显示iOS样式弹出窗口。

  这样的弹出窗口是菜单或对话框的替代方案,并阻止用户与应用程序的其余部分进行交互。

  context参数用于查找弹出窗口的[Navigator]。 它仅在调用方法时使用。 在弹出窗口关闭之前,可以从树中安全地删除其相应的窗口小部件。

  builder参数通常构建一个CupertinoActionSheet小部件。

  小部件下方的内容使用ModalBarrier调暗。 由builder构建的小部件不与最初调用showCupertinoModalPopup的位置共享上下文。 用一个 [StatefulBuilder]或小部件需要的自定义[StatefulWidget]动态更新。

  返回一个Future,它解析为弹出窗口关闭时传递给[Navigator.pop]的值。

CupertinoActionSheet

创建iOS样式的列表。其构造函数如下

const CupertinoActionSheet({
    Key key,
    this.title,
    this.message,
    this.actions,
    this.messageScrollController,
    this.actionScrollController,
    this.cancelButton,
  }) 
复制代码

  其中的actions为CupertinoActionSheetAction的Widget数组,而cancelButton也一般为CupertinoActionSheetAction

  actionScrollController为滚动控制器,可用于控制操作表中actions的滚动。

CupertinoActionSheetAction

通常用于CupertinoActionSheet的按钮。主要包含一个child widget和一个点击回掉;

const CupertinoActionSheetAction({
    @required this.onPressed,
    this.isDefaultAction = false,
    this.isDestructiveAction = false,
    @required this.child,
  }) 
复制代码

isDefaultAction此操作是否是操作表中的默认选项,默认按钮具有粗体文本。

isDestructiveAction此操作是否可能更改或删除数据。要被删除按钮有红色文字。

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值