Flutter:启动屏逻辑处理02:启动页

启动屏启动之后,制作一个启动页面

新建splash:view

视图中只有一张图片sliding.png就是我们的启动图

js 复制代码
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'index.dart';
class SplashPage extends GetView<SplashController> {
  const SplashPage({Key? key}):super(key: key);
  // 主视图
  Widget _buildView() {
    return const Image(image: AssetImage('images/sliding.png'));
  }
  @override
  Widget build(BuildContext context) {
    return GetBuilder<SplashController>(
      init: SplashController(),
      id: "splash",
      builder: (_) {
        return Scaffold(
          // SafeArea():安全区域,删除后页面顶到顶部
          body: _buildView(),
        );
      },
    );
  }
}

main入口路由配置

js 复制代码
initialRoute: '/splashPage',

启动后会默认先展示前一章自定义的APP启动图标,之后便会进入启动图页。

启动图页面也可以加一些跳转的逻辑,

haskell 复制代码
第一次启动APP:跳转欢迎页
第二次启动APP:
是否已登录:跳转首页
否则:跳转登陆页
相关推荐
BoomHe1 天前
Now in Android 架构模式全面分析
android·android jetpack
willow1 天前
Promise由浅入深
javascript·promise
董员外1 天前
LangChain.js 快速上手指南:Tool的使用,给大模型安上了双手
前端·javascript·后端
willow1 天前
Generator与Iterator
javascript
wuhen_n1 天前
Pinia状态管理原理:从响应式核心到源码实现
前端·javascript·vue.js
晴殇i1 天前
CommonJS 与 ES6 模块引入的区别详解
前端·javascript·面试
wuhen_n1 天前
KeepAlive:组件缓存实现深度解析
前端·javascript·vue.js
wuhen_n1 天前
Vue Router与响应式系统的集成
前端·javascript·vue.js
FansUnion1 天前
用 AI 自动生成壁纸标题、描述和 SEO Slug
javascript
大雨还洅下1 天前
前端 JS: async, await; Generator
javascript