flutter: getx安装及使用路由的例子

一,安装

在pub的地址:

https://pub.dev/packages/get

编辑pubspec.yaml

dependencies:
  get: ^4.7.3

然后点击 pub get

 

二,例子:

image

main.dart:

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

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

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return   GetMaterialApp(
      debugShowCheckedModeBanner: false, //去除debug图标
      defaultTransition: Transition.rightToLeft,   //指定动画
      theme: ThemeData(primarySwatch: Colors.red),
      initialRoute: "/",    //初始化页面
      getPages: APPage.routes,   //路由
    );
  }

}

routes.dart:

import 'package:get/get.dart';
import '../pages/DetailPage.dart';
import '../pages/HomePage.dart';

class APPage {
  static final routes = [
    GetPage(name: '/', page: () => HomePage()),
    GetPage(name: "/detail", page: () => DetailPage(),),
  ];
}

DetailPage.dart:

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

class DetailPage extends StatefulWidget {
  @override
  State<DetailPage> createState() => _DetailPageState();
}

class _DetailPageState extends State<DetailPage>  {
  @override
  Widget build(BuildContext context) {

    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.surfaceContainer,
        title: const Text("detail页面"),
      ),

      body: Center(
        child: ElevatedButton(
          child: Text("返回home页面"),
          onPressed: () {
            print("接收到的参数:");
            print(Get.arguments);
            print("参数:id:");
            print(Get.arguments['id']);
            print("参数:name:");
            print(Get.arguments['name']);
            Get.back();
          },
        ),
      ),

    );
  }

}

HomePage.dart:

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

class HomePage extends StatefulWidget {
  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage>  {
  @override
  Widget build(BuildContext context) {

    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: const Text("home页面"),
      ),

      body: Center(
        child: ElevatedButton(
          child: Text("跳转到detail页面"),
          onPressed: () {
            Get.toNamed("/detail",arguments: {
              "id":20,
              "name":"苏东坡新传",
            });
          },
        ),
      ),

    );
  }

}

三,测试效果:

imageimage

posted @ 2026-02-28 21:30  刘宏缔的架构森林  阅读(0)  评论(0)    收藏  举报