Flutter启动页

效果图

dart 复制代码
import 'dart:async';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'jumpPage.dart';

class TransitPage extends StatefulWidget {
  const TransitPage({super.key});

  @override
  State<TransitPage> createState() => _TransitPage();
}

class _TransitPage extends State<TransitPage> {
  late Timer _timer;
  int _currentTime = 6;
  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    _timer = Timer.periodic(Duration(milliseconds: 1000), (timer) {
      setState(() {
        _currentTime--;
      });
      if(_currentTime<=0){
        _jumpRoutePage();

      }
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Stack(
        children: [
          Image.asset(
              "images/page.png",
            fit: BoxFit.cover,
            width: MediaQuery.of(context).size.width,
            height: MediaQuery.of(context).size.height,
          ),
          Positioned(
            top: MediaQuery.of(context).padding.top+30,
            right: MediaQuery.of(context).padding.right+30,
            child: InkWell(
              child: _clipButton(),
              onTap: (){
                _jumpRoutePage();
              },
            ),
          )
        ],
      ),

    );
  }
  Widget _clipButton() {

    return ClipRRect(
      borderRadius: BorderRadius.circular(40),
      child: Container(
        height: 50,
        width: 50,
        color: Colors.black.withOpacity(0.5),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Text("跳过",style: TextStyle(color: Colors.white,fontSize: 12),),
            Text("${_currentTime}s",style: TextStyle(color: Colors.white,fontSize: 12),),
          ],
        ),

      ),
    );
  }
  //倒计结束或点击跳过后的页面
  void _jumpRoutePage() {
    _timer.cancel();
    Navigator.pushAndRemoveUntil(context, MaterialPageRoute(builder: (BuildContext context)=>TransitPage2()), (route) => false);
  }
}
相关推荐
钛态8 小时前
Flutter for OpenHarmony:mockito 单元测试的替身演员,轻松模拟复杂依赖(测试驱动开发必备) 深度解析与鸿蒙适配指南
服务器·驱动开发·安全·flutter·华为·单元测试·harmonyos
念格11 小时前
Flutter 弹窗 UI 不刷新?用 StatefulBuilder 解决
flutter
程序员老刘12 小时前
2026春招Flutter岗位为何变少?我看到的3个招聘逻辑变化
flutter·ai编程·客户端
念格13 小时前
Flutter 实现点击任意位置收起键盘的最佳实践
flutter
念格13 小时前
Flutter ListView Physics 滚动物理效果详解
flutter
国医中兴13 小时前
ClickHouse的数据模型设计:从理论到实践
flutter·harmonyos·鸿蒙·openharmony
国医中兴16 小时前
ClickHouse数据导入导出最佳实践:从性能到可靠性
flutter·harmonyos·鸿蒙·openharmony
国医中兴17 小时前
大数据处理的性能优化技巧:从理论到实践
flutter·harmonyos·鸿蒙·openharmony
●VON18 小时前
Flutter 入门指南:从基础组件到状态管理核心机制
前端·学习·flutter·von
西西学代码18 小时前
Flutter---SingleChildScrollView
前端·javascript·flutter