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:
是否已登录:跳转首页
否则:跳转登陆页
相关推荐
chilavert3184 分钟前
技术演进中的开发沉思-266 Ajax:让 动画优化
javascript·ajax·okhttp
前端无涯14 分钟前
React/Vue 消息订阅发布:实现方式、开发避坑与面试核心考点
前端·javascript·vue.js
搬砖的kk18 分钟前
Flutter适配鸿蒙:跨平台力量为鸿蒙生态注入增长新动能
分布式·flutter·harmonyos
西西学代码22 分钟前
Flutter---轮播图
flutter
一个没有感情的程序猿24 分钟前
前端实现交互式3D人体肌肉解剖图:基于 Three.js + React Three Fiber 的完整方案
前端·javascript·3d
武玄天宗25 分钟前
第五章、flutter怎么创建底部底部导航栏界面
前端·flutter
子榆.25 分钟前
Flutter 与开源鸿蒙(OpenHarmony)生物识别实战:人脸 + 指纹双模认证,筑牢信创应用安全防线
flutter·开源·harmonyos
chilavert31827 分钟前
技术演进中的开发沉思-268 Ajax:JSON
javascript·ajax·okhttp·json
qq_4634084229 分钟前
React Native跨平台技术在开源鸿蒙中使用WebView来加载鸿蒙应用的网页版或通过一个WebView桥接本地代码与鸿蒙应用
javascript·算法·react native·react.js·开源·list·harmonyos
全马必破三29 分钟前
React虚拟Dom
前端·javascript·react.js