Flutter-getX-2 dialog

參考自 

https://github.com/jonataslaw/getx/blob/master/README.zh-cn.md get官網

https://www.liujunmin.com/flutter/getx/introduction.html jimi網頁。

import 'package:flutter/material.dart';
import 'package:get/get.dart';

void main() {
  runApp( MyApp());
}

class MyApp extends StatelessWidget {
  GlobalKey<NavigatorState> _navKey=GlobalKey();


  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return GetMaterialApp(
      title: 'GetX',
      home:myhomepage(),
      );
  }
}


class myhomepage extends StatelessWidget {
  const myhomepage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(

          title: Text('對話框標題'),
        ),
        body: Align(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              ElevatedButton(
                onPressed: () {
                  Get.defaultDialog(
                    title: "對話框標題",
                    //對話框標題的內距
                    titlePadding:EdgeInsets.all(20),
                    //對話框標題文字設定
                    titleStyle: TextStyle(color: Colors.red,fontSize: 15,),
                    //內容文字
                    middleText: "內容文字",
                    //內容文字的樣式
                    middleTextStyle: TextStyle(color: Colors.red,fontSize: 15,),

                    //content設定,設置後middleText就不會呈現
                    content: Column(
                      mainAxisAlignment: MainAxisAlignment.start,
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [Icon(Icons.abc),
                        Text("這是內容"),
                      ],
                    ),
                    //對話框內容的內距
                    contentPadding: EdgeInsets.all(20),

                    //背景顏色，withOpacity為透明度
                    backgroundColor: Colors.blue,

                    //dialog的圓角
                    radius: 20,
                    //內建確定按鈕屬性設定,依序為文字、文字顏色、回調
                    textConfirm: "確認",
                    confirmTextColor: Colors.red,
                    onConfirm:(){
                      print('我按了確定');
                    },
                    //內建取消按鍵屬性設定,依序為文字、文字顏色、回調
                    textCancel: "取消",
                    cancelTextColor: Colors.red,
                    onCancel: (){
                      print('我按了取消');
                    },
                    //按鍵邊框顏色
                    buttonColor: Colors.orange,
                    
                    //自定義確認、取消按鈕，也可以自定義其它形式按鈕
                    confirm:TextButton(onPressed: (){}, child: Text("確定"),),
                    cancel:TextButton(onPressed: (){}, child: Text("取消"),),
                    barrierDismissible: false, //是否可點擊背景，取消對話框
                      
                      //action擴展的部件
                    actions:[
                      ElevatedButton(onPressed: (){}, child: Text("事件一")),
                      ElevatedButton(onPressed: (){}, child: Text("事件二")),
                    ],
                    onWillPop: ()async{
                      print ('退出');
                      return true;
                    },
                  


                  );
                },
                child: Text('顯示對話框'),),
            ],
          ),
        )
    );
  }
}