Flutter+GetX框架的基础模版搭建流程

最新推荐文章于 2024-08-22 09:24:40 发布

张仕鹏_愚愚

最新推荐文章于 2024-08-22 09:24:40 发布

阅读量235

点赞数 3

分类专栏： Flutter实战小知识文章标签： flutter

本文链接：https://blog.csdn.net/zhangsp_dev_dxdc/article/details/139986494

版权

Flutter实战小知识专栏收录该内容

2 篇文章 0 订阅

订阅专栏

Flutter+GetX框架的基础模版搭建流程

安装getx脚手架参考：

1、创建一个flutter项目

教程很多，自己找，我这边是通过Android Studio创建。

2、脚手架命令初始化

get init

get create page:tabs
get create page:health
get create page:user

3、去除debug标志

void main() {
  runApp(
    GetMaterialApp(
      debugShowCheckedModeBanner: false,
      title: "Application",
      initialRoute: AppPages.INITIAL,
      getPages: AppPages.routes,
    ),
  );
}

4、tabs页面初始化

tabs_view.dart

import 'package:flutter/material.dart';

import 'package:get/get.dart';

import '../controllers/tabs_controller.dart';

class TabsView extends GetView<TabsController> {
  const TabsView({Key? key}) : super(key: key);
  @override
  Widget build(BuildContext context) {
    return Obx(() => Scaffold(
      body: PageView(
        controller: controller.pageController,
        children: controller.pages,
        onPageChanged: (index) {
          controller.setCurrentIndex(index);
        },
      ),
      bottomNavigationBar: BottomNavigationBar(
        fixedColor: Colors.red, //选中的颜色
        currentIndex: controller.currentIndex.value, //第几个菜单选中
        type: BottomNavigationBarType.fixed, //如果底部有4个或者4个以上的
        onTap: (index) {
          controller.setCurrentIndex(index);
          controller.pageController.jumpToPage(index);
        },
        items: const [
          BottomNavigationBarItem(icon: Icon(Icons.home), label: "首页"),
          BottomNavigationBarItem(icon: Icon(Icons.category), label: "健康"),
          BottomNavigationBarItem(icon: Icon(Icons.people), label: "我的"),
        ],
      ),
    ));
  }
}

tabs_controller.dart

import 'package:aisikangdemo/app/modules/health/views/health_view.dart';
import 'package:aisikangdemo/app/modules/home/views/home_view.dart';
import 'package:aisikangdemo/app/modules/user/views/user_view.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';

class TabsController extends GetxController {
  RxInt currentIndex = 0.obs;
  PageController pageController = Get.arguments != null
      ? PageController(initialPage: Get.arguments["initialPage"])
      : PageController(initialPage: 0);

final List<Widget> pages = [
    const HomeView(),
    const HealthView(),
    const UserView(),
  ];

  @override
  void onInit() {
    super.onInit();
        if (Get.arguments != null) {
      currentIndex.value=Get.arguments["initialPage"];
      update();
    }
  }


  @override
  void onClose() {
    super.onClose();
  }

 void setCurrentIndex(index) {
    currentIndex.value = index;
    update();
  }
}

tabs_binding.dart

import 'package:aisikangdemo/app/modules/health/controllers/health_controller.dart';
import 'package:aisikangdemo/app/modules/home/controllers/home_controller.dart';
import 'package:aisikangdemo/app/modules/user/controllers/user_controller.dart';
import 'package:get/get.dart';

import '../controllers/tabs_controller.dart';

class TabsBinding extends Bindings {
  @override
  void dependencies() {
    Get.lazyPut<TabsController>(
      () => TabsController(),
    );
    Get.lazyPut<HomeController>(
      () => HomeController(),
    );
    Get.lazyPut<HealthController>(
      () => HealthController(),
    );
    Get.lazyPut<UserController>(
      () => UserController(),
    );
  }
}