Flutter

flutter bloc 登录demo

2020-07-01  本文已影响0人  林祖朋

业务逻辑和视图分开
main.dart

import 'package:flutter/material.dart';
import 'package:flutterdemo/login_bloc.dart';
import 'package:flutterdemo/user_model.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Bloc登录Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Bloc研究'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {

  TextEditingController _nameTextEditingController;
  TextEditingController _pwdTextEditingController;

  LoginBloc _loginBloc;


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

    _nameTextEditingController = new TextEditingController();
    _pwdTextEditingController = new TextEditingController();
    _loginBloc=LoginBloc();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Stack(
        alignment: Alignment.center,
        children: <Widget>[
          Column(
            children: <Widget>[
              Container(
                margin: const EdgeInsets.only(left: 16, right: 16, top: 10),
                child: TextField(
                  controller: _nameTextEditingController,
                  decoration: InputDecoration(
                    hintText: "请输入用户名",
                  ),
                ),
              ),
              Container(
                margin: const EdgeInsets.only(left: 16, right: 16, top: 10),
                child: TextField(
                  controller: _pwdTextEditingController,
                  decoration: InputDecoration(
                    hintText: "请输入密码",
                  ),
                ),
              ),
              GestureDetector(
                onTap: () {
                  _loginBloc.login(context, _nameTextEditingController.text,
                  _pwdTextEditingController.text);
                },
                child: Container(
                  alignment: Alignment.center,
                  margin: const EdgeInsets.only(left: 16, right: 16, top: 20),
                  color: Colors.green,
                  height: 44,
                  width: double.infinity,
                  child: Text(
                    '登录',
                    style: TextStyle(fontSize: 18, color: Colors.white),
                  ),
                ),
              )
            ],
          ),
          StreamBuilder(
              stream: _loginBloc.getStream(),
              builder: (BuildContext context, AsyncSnapshot<UserModel> snapshot){
                if(snapshot.data!=null&&snapshot.data.yesLoading!=null&&snapshot.data.yesLoading){
                  return Container(
                    alignment: Alignment.center,
                    color: Colors.red,
                    width: 100,
                    height: 100,
                    child: Text("加载中",style: TextStyle(
                      color: Colors.white
                    ),),
                  );
                }else{
                  return Container();
                }
              }
          )
        ],
      ),
    );
  }

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

    _nameTextEditingController.dispose();
    _pwdTextEditingController.dispose();
  }
}

login_bloc.dart


//这里主要处理登录页面的逻辑
import 'dart:async';

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutterdemo/user_model.dart';
import 'package:flutterdemo/user_page.dart';

class LoginBloc {

  UserModel _userModel;
  StreamController<UserModel> _streamController;

  LoginBloc(){
    _userModel=UserModel();
    _streamController= StreamController.broadcast();
  }

  Stream<UserModel> getStream(){
    return _streamController.stream;
  }


  void login(BuildContext context,String name,String pwd){
    if(name==""){
      print("请输入用户名");
      return;
    }

    if(pwd==""){
      print("请输入密码");
      return;
    }

    _userModel.yesLoading=true;
    _streamController.sink.add(_userModel);

    Future.delayed(Duration(seconds: 3),(){
      _userModel.yesLoading=false;
      _userModel.name="张三";
      _userModel.id=1;
      _userModel.info="test info test";
      _streamController.sink.add(_userModel);
      Navigator.of(context).push(MaterialPageRoute(
        builder:(context)=>UserPage()
      ));
    });
  }

  void dispose(){
    _streamController.close();
  }


}

UserModel

class UserModel{

  String name;
  int id;
  String info;
  bool yesLoading


}

user_page.dart


import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

class UserPage extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Scaffold(
      appBar: AppBar(title: Text('个人信息页'),),
    );
  }
}
上一篇下一篇

猜你喜欢

热点阅读