二、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樣式彈出窗口。bash

  這樣的彈出窗口是菜單或對話框的替代方案,並阻止用戶與應用程序的其他部分進行交互。less

  context參數用於查找彈出窗口的[Navigator]。 它僅在調用方法時使用。 在彈出窗口關閉以前,能夠從樹中安全地刪除其相應的窗口小部件。ide

  builder參數一般構建一個CupertinoActionSheet小部件。函數

  小部件下方的內容使用ModalBarrier調暗。 由builder構建的小部件不與最初調用showCupertinoModalPopup的位置共享上下文。 用一個 [StatefulBuilder]或小部件須要的自定義[StatefulWidget]動態更新。ui

  返回一個Future,它解析爲彈出窗口關閉時傳遞給[Navigator.pop]的值。this

CupertinoActionSheet

建立iOS樣式的列表。其構造函數以下spa

const CupertinoActionSheet({
    Key key,
    this.title,
    this.message,
    this.actions,
    this.messageScrollController,
    this.actionScrollController,
    this.cancelButton,
  }) 
複製代碼

  其中的actions爲CupertinoActionSheetAction的Widget數組,而cancelButton也通常爲CupertinoActionSheetActioncode

  actionScrollController爲滾動控制器,可用於控制操做表中actions的滾動。

CupertinoActionSheetAction

一般用於CupertinoActionSheet的按鈕。主要包含一個child widget和一個點擊回掉;

const CupertinoActionSheetAction({
    @required this.onPressed,
    this.isDefaultAction = false,
    this.isDestructiveAction = false,
    @required this.child,
  }) 
複製代碼

isDefaultAction此操做是不是操做表中的默認選項,默認按鈕具備粗體文本。

isDestructiveAction此操做是否可能更改或刪除數據。要被刪除按鈕有紅色文字。

相關文章
相關標籤/搜索