Newer
Older
flutterBaseApp / lib / ui / pages / splash_page.dart
StephanieGitHub on 9 Feb 2021 8 KB first commit
import 'dart:async';

import 'package:base_app/common/common.dart';
import 'package:base_app/models/common/splash_model.dart';
import 'package:base_app/res/colors.dart';
import 'package:base_app/res/index.dart';
import 'package:base_app/utils/http_utils.dart';
import 'package:base_app/utils/route_util.dart';
import 'package:base_app/utils/util_index.dart';
import 'package:base_app/utils/utils.dart';
import 'package:cached_network_image/cached_network_image.dart';
import 'package:fluintl/fluintl.dart';
import 'package:flukit/flukit.dart';
import 'package:flustars/flustars.dart';
import 'package:flutter/material.dart';
import 'package:rxdart/rxdart.dart';

/// 闪屏页(闪屏、导航、广告)
class SplashPage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return new SplashPageState();
  }
}

class SplashPageState extends State<SplashPage> {
  TimerUtil _timerUtil;

  // 本地导航列表
  List<String> _guideList = [
    Utils.getImgPath('guide1'),
    Utils.getImgPath('guide2'),
    Utils.getImgPath('guide3')
  ];

  List<Widget> _bannerList = new List();

  int _status = 0;
  int _count = 3;

  SplashModel _splashModel;

  @override
  void initState() {
    super.initState();
    _init();
  }

  void _init() {
    // 加载导航数据
    _loadSplashData();
    Observable.just(1).delay(new Duration(milliseconds: 500)).listen((_) {
      // 判断是否需要闪屏,需要则加载,不需要则直接加载banner
      if (SpUtil.getBool(Constant.key_guide, defValue: true) &&
          ObjectUtil.isNotEmpty(_guideList)) {
        SpUtil.putBool(Constant.key_guide, false);
        _initBanner();
      } else {
        _initSplash();
      }
    });
  }

  /// 加载闪屏数据,先看本地有没有闪屏数据
  void _loadSplashData() {
    //1. 先读取本地
    _splashModel = SpUtil.getObj(
        Constant.key_splash_model, (v) => SplashModel.fromJson(v));
    if (_splashModel != null) {
      setState(() {});
    } else {
      // 2. 本地没有缓存的话,访问远程
      HttpUtils httpUtil = new HttpUtils();
      httpUtil.getSplash().then((model) {
        if (!ObjectUtil.isEmpty(model.imgUrl)) {
          if (_splashModel == null || (_splashModel.imgUrl != model.imgUrl)) {
            SpUtil.putObject(Constant.key_splash_model, model);
            setState(() {
              _splashModel = model;
            });
          }
        } else {
          SpUtil.putObject(Constant.key_splash_model, null);
        }
      });
    }
  }

  void _initBanner() {
    _initBannerData();
    setState(() {
      _status = 2;
    });
  }

  void _initBannerData() {
    for (int i = 0, length = _guideList.length; i < length; i++) {
      if (i == length - 1) {
        // 最后一页,显示立即体验,点击之后去主页
        _bannerList.add(new Stack(
          children: <Widget>[
            new Image.asset(
              _guideList[i],
              fit: BoxFit.fill,
              width: double.infinity,
              height: double.infinity,
            ),
            new Align(
              alignment: Alignment.bottomCenter,
              child: new Container(
                margin: EdgeInsets.only(bottom: 160.0),
                child: new InkWell(
                  onTap: () {
                    _goMain();
                  },
                  child: new CircleAvatar(
                    radius: 48.0,
                    backgroundColor: Colors.indigoAccent,
                    child: new Padding(
                      padding: EdgeInsets.all(2.0),
                      child: new Text(
                        '立即体验',
                        textAlign: TextAlign.center,
                        style: TextStyle(color: Colors.white, fontSize: 16.0),
                      ),
                    ),
                  ),
                ),
              ),
            ),
          ],
        ));
      } else {
        // 其他页返回图片
        _bannerList.add(new Image.asset(
          _guideList[i],
          fit: BoxFit.fill,
          width: double.infinity,
          height: double.infinity,
        ));
      }
    }
  }

  void _initSplash() {
    if (_splashModel == null) {
      _goMain();
    } else {
      new Timer(new Duration(milliseconds: 500), () {
        _doCountDown();
      });
    }
  }

  // 倒计时,3s后进入主页
  void _doCountDown() {
    setState(() {
      _status = 1;
    });
    _timerUtil = new TimerUtil(mTotalTime: 3 * 1000);
    _timerUtil.setOnTimerTickCallback((int tick) {
      double _tick = tick / 1000;
      setState(() {
        _count = _tick.toInt();
      });
      if (_tick == 0) {
        _goMain();
      }
    });
    _timerUtil.startCountDown();
  }

  // 去主页
  void _goMain() async {
    // 判断是否已登录,已登录跳转到主页,否则去登录页
    bool isLogin = await LoginUtils.isLogin();
    if (isLogin) {
      RouteUtil.goMain(context);
    } else {
      RouteUtil.goLogin(context);
    }
  }

  // 构建闪屏页
  Widget _buildSplashBg() {
    return new Image.asset(
      Utils.getImgPath('splash_bg'),
      width: double.infinity,
      fit: BoxFit.fill,
      height: double.infinity,
    );
  }

  // 构建广告页
  Widget _buildAdWidget() {
    if (_splashModel == null) {
      return new Container(
        height: 0.0,
      );
    }
    return new Offstage(
      offstage: !(_status == 1),
      child: new InkWell(
        onTap: () {
          if (ObjectUtil.isEmpty(_splashModel.url)) return;
          _goMain();
          NavigatorUtil.pushWeb(context,
              title: _splashModel.title, url: _splashModel.url);
        },
        child: new Container(
          alignment: Alignment.center,
          child: new CachedNetworkImage(
            width: double.infinity,
            height: double.infinity,
            fit: BoxFit.fill,
            imageUrl: _splashModel.imgUrl,
            placeholder: (context, url) => _buildSplashBg(),
            errorWidget: (context, url, error) => _buildSplashBg(),
          ),
        ),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return new Material(
      child: new Stack(
        children: <Widget>[
          // offstage组件,offstage属性为false时显示
          new Offstage(
            // _status为0,显示闪屏
            offstage: !(_status == 0),
            child: _buildSplashBg(),
          ),
          new Offstage(
            // _status为2,显示导航
            offstage: !(_status == 2),
            child: ObjectUtil.isEmpty(_bannerList)
                ? new Container()
                : new Swiper(
                    autoStart: false,
                    circular: false,
                    indicator: CircleSwiperIndicator(
                      radius: 4.0,
                      padding: EdgeInsets.only(bottom: 30.0),
                      itemColor: Colors.black26,
                    ),
                    children: _bannerList),
          ),
          // 显示广告
          _buildAdWidget(),
          new Offstage(
            // _status为1显示跳过
            offstage: !(_status == 1),
            child: new Container(
              alignment: Alignment.bottomRight,
              margin: EdgeInsets.all(20.0),
              child: InkWell(
                onTap: () {
                  _goMain();
                },
                child: new Container(
                    padding: EdgeInsets.all(12.0),
                    child: new Text(
                      // 跳过
                      IntlUtil.getString(context, Ids.jump_count,
                          params: ['$_count']),
                      style: new TextStyle(fontSize: 14.0, color: Colors.white),
                    ),
                    decoration: new BoxDecoration(
                        color: Color(0x66000000),
                        borderRadius: BorderRadius.all(Radius.circular(4.0)),
                        border: new Border.all(
                            width: 0.33, color: Colours.divider))),
              ),
            ),
          )
        ],
      ),
    );
  }

  @override
  void dispose() {
    super.dispose();
    if (_timerUtil != null) _timerUtil.cancel(); //记得在dispose里面把timer cancel。
  }
}