Flutter项目之设置页

目录:

1、实现效果图

2、实现流程

2.1、引入依赖

2.2、封装弹窗工具类

dart 复制代码
import 'package:fluttertoast/fluttertoast.dart';


class CommontToast {
  static showToast(String msg) {
    Fluttertoast.showToast(
        msg: msg,
        toastLength: Toast.LENGTH_SHORT,
        gravity: ToastGravity.CENTER,
        timeInSecForIosWeb: 1,
        fontSize: 16.0);
  }
}

2.3、设置页

dart 复制代码
import 'package:flutter/material.dart';
import 'package:flutter_haoke/scopoed_model/auth_model.dart';
import 'package:flutter_haoke/utils/common_toast.dart';
import 'package:flutter_haoke/utils/scopoed_mode_helper.dart';

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text("设置")),
      body: TextButton(
          onPressed: () {
            //调用退出登录的逻辑
            ScopoedModelHelper.getModel<AuthModel>(context).logout();
            CommontToast.showToast("退出登录");
          },
          child: Text("退出登录")),
    );
  }
}

2.4、路由中注册设置页面

dart 复制代码
// 1.编写route文件 并编写routes基本结构
import 'package:fluro/fluro.dart';
import 'package:flutter/material.dart';
import 'package:flutter_haoke/loading.dart';
import 'package:flutter_haoke/pages/community_picker.dart';
import 'package:flutter_haoke/pages/home/index.dart';
import 'package:flutter_haoke/pages/loading.dart';
import 'package:flutter_haoke/pages/login.dart';
import 'package:flutter_haoke/pages/notfound.dart';
import 'package:flutter_haoke/pages/register.dart';
import 'package:flutter_haoke/pages/room_add/index.dart';
import 'package:flutter_haoke/pages/room_manager/index.dart';
import 'package:flutter_haoke/pages/roomdetail/index.dart';
import 'package:flutter_haoke/pages/setting.dart';

class Routes {
  // 2.定义路由名称
  static String home = '/';
  static String login = '/login';
  static String register = '/register';
  static String roomdetail = '/roomDetail/:roomId';
  //设置页面
  static String setting = '/setting';
  static String roommanager = '/roommanager';
  static String roomAdd = '/roomAdd';
  static String community = '/community';
  static String loading = '/loading';

  // 3.定义路由处理函数
  static Handler _homeHandel = Handler(
    handlerFunc: (context, parameters) {
      return HomePage();
    },
  );
  static Handler _loginHandel = Handler(
    handlerFunc: (context, parameters) {
      return LoginPage();
    },
  );
  static Handler _registerHandel = Handler(
    handlerFunc: (context, parameters) {
      return RegisterPage();
    },
  );
  //设置页面
  static Handler _settingHandel = Handler(
    handlerFunc: (context, parameters) {
      return SettingPage();
    },
  );
  static Handler _roommanagerHandel = Handler(
    handlerFunc: (context, parameters) {
      return RoomManagerPage();
    },
  );
  static Handler _roomdetailHandel = Handler(
    handlerFunc: (context, parameters) {
      return RoomDetailPage(
        roomId: parameters["roomId"]![0],
      );
    },
  );
  static Handler _notfoundHandel = Handler(
    handlerFunc: (context, parameters) {
      return NotFoundPage();
    },
  );

  static Handler _roomAddHandel = Handler(
    handlerFunc: (context, parameters) {
      return RoomAddPage();
    },
  );
  static Handler _communityHandel = Handler(
    handlerFunc: (context, parameters) {
      return CommunityPickerPage();
    },
  );
  static Handler _loadingHandel = Handler(
    handlerFunc: (context, parameters) {
      return LoadingPage();
    },
  );
  // 4.编写函数 configureRoutes 关联路由名称和处理函数
  static void configureRoutes(FluroRouter router) {
    router.define(home, handler: _homeHandel);
    router.define(login, handler: _loginHandel);
    router.define(register, handler: _registerHandel);
    router.define(roomdetail, handler: _roomdetailHandel);
    //设置页面
    router.define(setting, handler: _settingHandel);
    router.define(roommanager, handler: _roommanagerHandel);
    router.define(roomAdd, handler: _roomAddHandel);
    router.define(community, handler: _communityHandel);
    router.define(loading, handler: _loadingHandel);
    router.notFoundHandler = _notfoundHandel;
  }
}
相关推荐
梦醒沉醉3 分钟前
7、表达日期和时间(前朝遗老Date)
javascript
雪芽蓝域zzs32 分钟前
第四十九节:TagsView 右键菜单(带三角箭头)给每个 tag 增加**鼠标右键菜单**(右键标签弹出:关闭、关闭其他、关闭全部)
前端·javascript·vue.js
এ慕ོ冬℘゜1 小时前
从零开发移动端医院挂号页面:适配、交互与前端实现详解
前端·javascript
宁渡AI大模型1 小时前
AI 全栈面试新趋势:Vibe Coding、前端、Java 后端高频面试题深度解析|河南宁渡科技有限公司编程教程
java·javascript·人工智能·python·ai大模型
东风微鸣1 小时前
AI依赖更新别裸奔🚨
javascript
研☆香2 小时前
echarts图表的使用方法
javascript
2501_915918412 小时前
怎么把 Python 写的 Flet 应用打包成 iOS App 并上架 App Store?
android·ios·小程序·https·uni-app·iphone·webview
是立不是利3 小时前
大文件导致请求被拒的连锁反应
开发语言·前端·javascript
●VON3 小时前
Flutter 鸿蒙插件适配实战:用 flutter_native_timezone_2025 1.0.1 读取当前时区与系统目录
flutter·华为·harmonyos·鸿蒙
志尊宝3 小时前
Vue3 零基础每日笔记(026):emit 子传父——defineEmits 与事件校验
前端·javascript·html·vue3