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:
是否已登录:跳转首页
否则:跳转登陆页
相关推荐
Hi_kenyon7 小时前
VUE3套用组件库快速开发(以Element Plus为例)二
开发语言·前端·javascript·vue.js
alexhilton7 小时前
Jetpack Compose内部的不同节点类型
android·kotlin·android jetpack
EndingCoder8 小时前
Any、Unknown 和 Void:特殊类型的用法
前端·javascript·typescript
JosieBook9 小时前
【Vue】09 Vue技术——JavaScript 数据代理的实现与应用
前端·javascript·vue.js
Frank_HarmonyOS9 小时前
Android中四大组件之一的Activity的启动模式
android
似霰9 小时前
HIDL Hal 开发笔记7----简单 HIDL HAL 实现
android·framework·hal
华仔啊11 小时前
JavaScript 如何准确判断数据类型?5 种方法深度对比
前端·javascript
程序员小寒11 小时前
从一道前端面试题,谈 JS 对象存储特点和运算符执行顺序
开发语言·前端·javascript·面试
爱健身的小刘同学12 小时前
Vue 3 + Leaflet 地图可视化
前端·javascript·vue.js
神秘的猪头12 小时前
Ajax 数据请求:从零开始掌握异步通信
前端·javascript