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:
是否已登录:跳转首页
否则:跳转登陆页
相关推荐
英俊潇洒美少年17 小时前
Vue2/Vue3 vue-i18n完整改造流程(异步懒加载+后端接口请求)
前端·javascript·vue.js
空中海1 天前
第七章:vue工程化与构建工具
前端·javascript·vue.js
zhensherlock1 天前
Protocol Launcher 系列:Trello 看板管理的协议自动化
前端·javascript·typescript·node.js·自动化·github·js
哑巴湖小水怪1 天前
Android的架构是四层还是五层
android·架构
渔舟小调1 天前
P19 | 前端加密通信层 pikachuNetwork.js 完整实现
开发语言·前端·javascript
qq_12084093711 天前
Three.js 工程向:Draw Call 预算治理与渲染批处理实践
前端·javascript
2501_916008891 天前
深入解析iOS应用启动性能优化策略与实践
android·ios·性能优化·小程序·uni-app·cocoa·iphone
美狐美颜SDK开放平台1 天前
短视频/直播双场景美颜SDK开发方案:接入、功能、架构详解
android·ios·美颜sdk·第三方美颜sdk·视频美颜sdk
不会聊天真君6471 天前
JavaScript基础语法(Web前端开发笔记第三期)
前端·javascript·笔记