簡體   English   中英

如何使用 Flutter 在 Android 中顯示 iOS/cupertino 警報對話框?

[英]How to display iOS/cupertino alert dialog in Android using Flutter?

我試圖在我的 Flutter 應用程序中顯示一個 iOS 主題的對話框,但我在文檔中找不到任何內容

Android 主題/樣式的關鍵字是Material (默認設計),iOS 主題/樣式的關鍵字是Cupertino 每個 iOS 主題小部件都有前綴Cupertino 這樣,根據您的要求,我們可以猜測關鍵字是CupertinoDialog / CupertinoAlertDialog

您可以在此處參考所有這些https://flutter.io/docs/reference/widgets/cupertino

new CupertinoAlertDialog(
  title: new Text("Dialog Title"),
  content: new Text("This is my content"),
  actions: <Widget>[
    CupertinoDialogAction(
      isDefaultAction: true,
      child: Text("Yes"),
    ),
    CupertinoDialogAction(
      child: Text("No"),
    )
  ],
)

首先你檢查 platForm ios 還是 android .. 然后返回當前設備的小部件..

Future<bool> showAlertDialog({
  @required BuildContext context,
  @required String title,
  @required String content,
  String cancelActionText,
  @required String defaultActionText,
}) async {
  if (!Platform.isIOS) {
    return showDialog(
      context: context,
      builder: (context) => AlertDialog(
        title: Text(title),
        content: Text(content),
        actions: <Widget>[
          if (cancelActionText != null)
            FlatButton(
              child: Text(cancelActionText),
              onPressed: () => Navigator.of(context).pop(false),
            ),
          FlatButton(
            child: Text(defaultActionText),
            onPressed: () => Navigator.of(context).pop(true),
          ),
        ],
      ),
    );
  }

  // todo : showDialog for ios
  return showCupertinoDialog(
    context: context,
    builder: (context) => CupertinoAlertDialog(
      title: Text(title),
      content: Text(content),
      actions: <Widget>[
        if (cancelActionText != null)
          CupertinoDialogAction(
            child: Text(cancelActionText),
            onPressed: () => Navigator.of(context).pop(false),
          ),
        CupertinoDialogAction(
          child: Text(defaultActionText),
          onPressed: () => Navigator.of(context).pop(true),
        ),
      ],
    ),
  );
}

我在ShowDialog 中使用了CupertinoAlertDialog ,您可以在下面找到相同的內容

showDialog(
      context: context,
      builder: (BuildContext context) => CupertinoAlertDialog(
        title: new Text("Dialog Title"),
        content: new Text("This is my content"),
        actions: <Widget>[
          CupertinoDialogAction(
            isDefaultAction: true,
            child: Text(StringConstants.BIOMETRICAUTHORIZED),
          ),
          CupertinoDialogAction(
            child: Text("No"),
          )
        ],
      )
    );

以下是如何在 Flutter 中創建帶有兩個按鈕的簡單警報的簡單示例,

導入import 'package:flutter/cupertino.dart'; 並復制並粘貼下面的代碼並稱之為showAlertDialog(context); 你想在哪里顯示對話框。

這是我的結果

void showAlertDialog(BuildContext context) {

  showDialog(
    context: context,
    child:  CupertinoAlertDialog(
      title: Text("Log out?"),
      content: Text( "Are you sure you want to log out?"),
      actions: <Widget>[
        CupertinoDialogAction(
            isDefaultAction: true,
            onPressed: (){
              Navigator.pop(context);
            },
            child: Text("Cancel")
        ),
        CupertinoDialogAction(
          textStyle: TextStyle(color: Colors.red),
            isDefaultAction: true,
            onPressed: () async {
              Navigator.pop(context);
              SharedPreferences prefs = await SharedPreferences.getInstance();
              prefs.remove('isLogin');
              Navigator.pushReplacement(context,
                  MaterialPageRoute(builder: (BuildContext ctx) => LoginScreen()));
            },
            child: Text("Log out")
        ),
      ],
    ));
}

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM