设置应用程序入口
当我们导入依赖后，在应用程序顶层把 GetMaterialApp 作为顶层，如下所示
import 'package:flutter/material.dart'; import 'package:get/get.dart'; void main() { runApp(MyApp()); } class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return GetMaterialApp( title: "GetX", home: Scaffold( appBar: AppBar( title: Text("GetX Title"), ), ), ); } }
Dialog弹框
Dialog属性和说明
调用defaultDialog
class GetxPage extends StatefulWidget { const GetxPage({super.key}); @override State<GetxPage> createState() => _GetxPageState(); } class _GetxPageState extends State<GetxPage> { @override Widget build(BuildContext context) { return Center( child: Column( mainAxisAlignment: MainAxisAlignment.center, children: [ ElevatedButton( onPressed: () { Get.defaultDialog( title: "提示信息", middleText: "你确定删除吗", confirm: ElevatedButton( onPressed: () { print("确定"); Get.back(); //返回 }, child: const Text("确定")), cancel: ElevatedButton( onPressed: () { print("取消"); Get.back(); //返回 }, child: const Text("取消"))); }, child: const Text("Getx defaultDialog")), ], ), ); } }
snackbar提示信息
Snackbar属性和说明
调用snackbar
Snackbar 和我们前面讲的toast有点相似， 如果想在应用程序中触发某些特定的事件后，需要弹出快
捷消息，那么使用 Snackbar 则是最佳的选择。
ElevatedButton( onPressed: () { Get.snackbar("Snackbar 标题", "欢迎使用Snackbar"); }, child: const Text("Getx snackbar")),
BottomSheet 改变主题
BottomSheet属性和说明
调用snackbar
我们可以通过 GetX 很轻松的调用 bottomSheet() ，而且无需传入 context ，下面我给出一个例子，
使用 GetX 弹出 bottomSheet 并很轻松的实现切换主题 。
我们可以通过 Get.bottomSheet() 来显示 BottomSheet ，通过 Get.back() 实现路由返回，通过
Get.changeTheme(ThemeData.dark()) 切换皮肤主题，通过Get.isDarkMode判断主题样式。
class GetxPage extends StatefulWidget { const GetxPage({super.key}); @override State<GetxPage> createState() => _GetxPageState(); } class _GetxPageState extends State<GetxPage> { @override Widget build(BuildContext context) { return Center( child: Column( mainAxisAlignment: MainAxisAlignment.center, children: [ ElevatedButton( onPressed: () { // 弹出底部菜单 Get.bottomSheet(Container( color: Get.isDarkMode ? Colors.black12 : Colors.white, height: 200, child: Column( children: [ // 白天模式列表项 ListTile( leading: Icon(Icons.wb_sunny_outlined, color: Get.isDarkMode ? Colors.white : Colors.black), title: Text("白天模式", style: TextStyle( color: Get.isDarkMode ? Colors.white : Colors.black)), onTap: () { // 切换为白天模式 Get.changeTheme(ThemeData.light()); // 关闭底部菜单 Get.back(); print("切换主题为白天模式"); }, ), // 晚上模式列表项 ListTile( leading: Icon(Icons.wb_sunny, color: Get.isDarkMode ? Colors.white : Colors.black), title: Text("黑夜模式", style: TextStyle( color: Get.isDarkMode ? Colors.white : Colors.black)), onTap: () { // 切换为晚上模式 Get.changeTheme(ThemeData.dark()); // 关闭底部菜单 Get.back(); print("切换主题为晚上模式"); }, ) ], ), )); }, child: const Text("使用 Getx.bottomSheet 切换主题")), Text("这是一个字"), ], ), ); } }