Flutterの启动自动登陆

2,297 阅读2分钟

可参考: blog.csdn.net/email_jade/…

修改的有

引导页、登录页、启动页、main.dart、主页,,三张引导图,一张启动图

需要的插件 Dio, package_info、shared_preferences

先说简单的启动:启动进去的时候是进入首页,在首页检测本地有无记录账号信息,无则路由跳转到登录页

loginPage.dart

登录按钮
    如果输入账号正确,则存本地
    if (res != null) {
      if (res.result) {
        LocalStorage.save(BaseCommon.TOKEN, res.data['token']);
        LocalStorage.save(BaseCommon.USER_ID, res.data['id']);
        print('TOKEN');
        print(LocalStorage.get(BaseCommon.TOKEN));
        print('USER_ID');
        print(LocalStorage.get(BaseCommon.USER_ID));
        //记录登陆账号密码,方便自动登录
        LocalStorage.save('username',account);
        LocalStorage.save('password',password);
          
              Navigator.pushReplacement(
            context, new MaterialPageRoute(builder: (context) => MainPage()));

首页MainPage.dart

class MainPage extends StatefulWidget {
  final isAutoLogin;
  MainPage([this.isAutoLogin]);//这个可选参数用来验证是否是自动登录
  @override
  _MainPageState createState() => _MainPageState();
}

class _MainPageState extends State<MainPage> {
    void initState(){
      super.initState();
      //检查是否自动登录,是的话要弄个token
      if(widget.isAutoLogin==true)
      _login();
    }
    
    _login() async {
      Map<String, dynamic> map = new Map();
      map = {"username": LocalStorage.get('username'), "password": LocalStorage.get('password')};
      var res = await HttpManager.netFetch(
          context, "$host/manager/login", map, null, null,tokenCheck: false,
          noTip: true);
      if (res != null) {
        if (res.result) {
          LocalStorage.save(BaseCommon.TOKEN, res.data['token']);
          LocalStorage.save(BaseCommon.USER_ID, res.data['id']);
          print('TOKEN');
          print(LocalStorage.get(BaseCommon.TOKEN));
          print('USER_ID');
          print(LocalStorage.get(BaseCommon.USER_ID));
        } else {
          Navigator.pushReplacement(
              context, MaterialPageRoute(builder: (context) => LoginPage()));//密码不对就回登录页
          toast(res.data);
        }
      } else {
        toast(BaseCommon.SERVER_ERROR);
      }
    }

再加上引导页的话:

在main.js中

 home: LaunchPage(),

引导页:LaunchPage.dart

import 'dart:async';
import 'package:flutter/services.dart';
import 'package:flutter/material.dart';
import 'package:jihong_horticulture_warehouse/page/MainPage.dart';
import 'LoginPage.dart';
import 'GuidePage.dart';
import 'package:package_info/package_info.dart';
import 'package:shared_preferences/shared_preferences.dart';
import 'package:jihong_horticulture_warehouse/common/local/LocalImageSelecter.dart';

///@author Jasmin
///A1: Launch Page

class LaunchPage extends StatefulWidget {
  @override
  _LaunchPageState createState() => _LaunchPageState();
}

class _LaunchPageState extends State<LaunchPage> {
  var _version;
  int _pageState;
  SharedPreferences _sharedPreferences;

  //引导页图片列表
  List<String> list = ["guide_1", "guide_2", "guide_3"];

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

    //隐藏状态栏
    SystemChrome.setEnabledSystemUIOverlays([SystemUiOverlay.bottom]);

    Widget widget;
    _showPage().then((newWidget) {
      widget = newWidget;
    });

    //三秒后跳转到首页或者引导页
    Timer(Duration(seconds: 1), () {
      //展示状态栏
      SystemChrome.setEnabledSystemUIOverlays(
          [SystemUiOverlay.bottom, SystemUiOverlay.top]);

      Navigator.pushReplacement(
          context, MaterialPageRoute(builder: (context) => widget));
    });
  }

  @override
  void dispose() {
    // TODO: implement dispose
    super.dispose();

    //展示状态栏
    SystemChrome.setEnabledSystemUIOverlays(
        [SystemUiOverlay.bottom, SystemUiOverlay.top]);
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: Container(
            height: double.maxFinite,
            child: LocalImageSelecter.getImage('launch')));
  }

  ///
  ///     判断是否展示过引导页
  ///
  Future<dynamic> _checkState() async {
    //获取当前App的版本信息
    PackageInfo info = await PackageInfo.fromPlatform();
    _version = info.version;

    //获取SharedPreferences
    _sharedPreferences = await SharedPreferences.getInstance();

    print("app版本:${_version}");
    print("展示过引导页:${_sharedPreferences.get(_version)}");

    if (_sharedPreferences == null || _version == null) {
      return null;
    }
    //查询当前版本是否展示过引导页,展示过返回true,否则返回false
    if (_sharedPreferences.get(_version) == null) {
      _sharedPreferences.setBool(_version, false);
      return 0;
    }

    if (_sharedPreferences.get(_version) == false) {
      return 0;
    }

    if(_sharedPreferences.get('username')!=null&&_sharedPreferences.get('password')!=null){//本地有账号密码信息就进入主页
      return 2;
    }
    return 1;//默认进入登录页
  }

  ///
  ///     展示页面
  ///
  Future<Widget> _showPage() async {
    _pageState = await _checkState();

    //未收到检查结果继续展示启动页
    if (_pageState == null) {
      return LaunchPage();
    }

    //已展示过引导页直接进入主页或者登录页,
    if (_pageState==1) {
      return LoginPage();
    } else if(_pageState==0){
      return GuidePage(list, _changeState);
    } else if(_pageState==2){
      return MainPage(true);
    }
  }

  ///
  ///     回调函数用于点击进入应用后改变状态
  ///
  void _changeState() {
    print("立即启动");
    _sharedPreferences.setBool(_version, true);

    print(_sharedPreferences.get(_version));
  }
}

启动页:GuidePage.dart

import 'package:flutter/services.dart';
import 'package:jihong_horticulture_warehouse/common/commonInsert.dart';
import 'LoginPage.dart';

class GuidePage extends StatefulWidget {
  List<String> _picPATHs;
  var _callBack;

  GuidePage(this._picPATHs, this._callBack);

  @override
  _GuidePageState createState() => _GuidePageState(_picPATHs, _callBack);
}

class _GuidePageState extends State<GuidePage> {
  PageController _pageController;

  var _pageIndex; //页面号
  var _callBack; //进入应用的回调函数
  List<String> _picPATHs; //引导页图片

  ///
  ///     传入图片地址列表和回调函数
  ///
  _GuidePageState(this._picPATHs, this._callBack) {
    this._pageController = PageController(initialPage: 0);
    this._pageIndex = 0;
  }

  @override
  void initState() {
    // TODO: implement initState
    super.initState();

    //隐藏状态栏
    SystemChrome.setEnabledSystemUIOverlays([SystemUiOverlay.bottom]);

  }

  @override
  void dispose() {
    // TODO: implement dispose
    super.dispose();

    //展示状态栏
    SystemChrome.setEnabledSystemUIOverlays([SystemUiOverlay.bottom,SystemUiOverlay.top]);

  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        child: Stack(
          children: <Widget>[
            _createGuildePages(),
            _createPagePoint(),
          ],
        ),
      ),
    );
  }

  ///
  ///     生成引导页
  ///
  Widget _createGuildePages() {
    return PageView.custom(
      onPageChanged: (index) {
        setState(() {
          _pageIndex = index;
        });
      },
      controller: _pageController,
      childrenDelegate: SliverChildBuilderDelegate(
            (context, index) {
          return LocalImageSelecter.getImage(_picPATHs[index]);
        },
        childCount: _picPATHs.length,
      ),
    );
  }


  ///
  ///     生成导航点
  ///
  Widget _createPagePoint() {
    return Container(
        padding: EdgeInsets.only(bottom: Adapt.dp(21)),
        alignment: Alignment.bottomCenter,
        child: SizedBox(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.end,
            children: <Widget>[
              _creatButton(),
            ],
          ),
          height: Adapt.dp(150),
        ));
  }

  ///
  ///     生成按钮
  ///
  Widget _creatButton() {

    if (_pageIndex == _picPATHs.length - 1) {
      return Opacity(
        child: GestureDetector(
          onTap: (){
            _callBack();
            SystemChrome.setEnabledSystemUIOverlays([SystemUiOverlay.bottom,SystemUiOverlay.top]);
            Navigator.pushReplacement(context, MaterialPageRoute(builder: (context) => LoginPage()));
          },
          child: Container(
            decoration: BoxDecoration(color: Colors.white,border: Border.all(color: Colors.deepOrange,width: Adapt.dp(0.5)),borderRadius: BorderRadius.circular(58)),
            child: Text(
              "立即启动",
              style: TextStyle(fontSize: Adapt.dp(15), fontWeight: FontWeight.values[0],color: Colors.deepOrange),
            ),
            width: Adapt.dp(102),
            height: Adapt.dp(37),
//          decoration: BoxDecoration(
//            border: Border.all(color: Colors.grey, width: 1.0),
//            borderRadius: BorderRadius.circular(10),
//          ),
            alignment: Alignment.center,
          ),
        ),
        opacity: 0,//如果图片里有给,可以不用显示按钮。
      );
    }

    return Opacity(
      opacity: 0,
      child: RaisedButton(
        onPressed: (){},
        child: Container(
          width: Adapt.dp(150),
          height: Adapt.dp(50),
        ),
      ),
    );
  }
}