binding_phone.dart 8.29 KB
import 'dart:async';

import 'package:flutter/material.dart';
import 'package:flutter_screenutil/screenutil.dart';
import 'package:one_key/app.dart';
import 'package:one_key/res/colors.dart';
import 'package:one_key/utils/navigator_util.dart';
import 'package:one_key/widgets/h_empty_view.dart';
import 'package:one_key/widgets/round_button.dart';
import 'package:one_key/widgets/system_app_bar.dart';
import 'package:one_key/widgets/v_empty_view.dart';

class BindingPhone extends StatefulWidget {
  BindingPhone({Key key}) : super(key: key);

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

class _BindingPhoneState extends State<BindingPhone> {
  ScrollController _controller;
  FocusNode _phoneNode;
  FocusNode _codeNode;

  //定义变量
  Timer _timer;
  //倒计时数值
  var countdownTime = 0;

  @override
  void initState() {
    super.initState();
    _controller = ScrollController();
    _phoneNode = FocusNode();
    _codeNode = FocusNode();
  }

  @override
  void dispose() {
    super.dispose();
    _timer.cancel();
  }

  ///倒计时方法
  startCountdown() {
    countdownTime = 60;
    final call = (timer) {
      setState(() {
        if (countdownTime < 1) {
          _timer.cancel();
        } else {
          countdownTime -= 1;
        }
      });
    };
    _timer = Timer.periodic(Duration(seconds: 1), call);
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: SystemAppBar(
        '绑定手机号',
        onTap: () {
          Navigator.pop(context);
        },
      ),
      body: InkWell(
          onTap: () {
            FocusScope.of(context).requestFocus(FocusNode()); //点击空白处隐藏键盘
          },
          child: Container(
              padding: EdgeInsets.all(ScreenUtil().setWidth(40)),
              child: Column(
                children: [
                  Expanded(
                    child: SingleChildScrollView(
                      controller: _controller,
                      child: Column(
                        children: [
                          TextField(
                            // textAlignVertical: TextAlignVertical.bottom,
                            maxLines: 1,
                            // //光标颜色
                            // cursorColor:
                            //     widget.isSelect ? Colors.white : MyColours.color_199095,
                            //输入文本的样式
                            style: TextStyle(
                              fontSize: ScreenUtil().setSp(28),
                            ),
                            focusNode: _phoneNode,
                            decoration: InputDecoration(
                              contentPadding: EdgeInsets.symmetric(
                                  vertical: ScreenUtil().setWidth(6),
                                  horizontal: ScreenUtil().setWidth(20)),
                              border: OutlineInputBorder(),
                              hintText: '请输入手机号码',
                              hintStyle: TextStyle(
                                color: MyColours.color_999999,
                                fontSize: ScreenUtil().setSp(28),
                              ),
                              // enabledBorder: new UnderlineInputBorder(
                              //   borderSide: BorderSide.none,
                              // ),
                              focusedBorder: OutlineInputBorder(
                                  borderSide: BorderSide(
                                      color: MyColours.color_199095)),
                            ),
                            onChanged: (value) {},
                            onEditingComplete: () {
                              FocusScope.of(context)
                                  .requestFocus(FocusNode()); //点击空白处隐藏键盘
                            },
                            keyboardType: TextInputType.number,
                          ),
                          VEmptyView(30),
                          Container(
                              // height: ScreenUtil().setWidth(20),
                              child: Row(
                            children: [
                              Expanded(
                                child: TextField(
                                  // textAlignVertical: TextAlignVertical.bottom,
                                  maxLines: 1,
                                  // //光标颜色
                                  // cursorColor:
                                  //     widget.isSelect ? Colors.white : MyColours.color_199095,
                                  //输入文本的样式
                                  style: TextStyle(
                                    fontSize: ScreenUtil().setSp(28),
                                  ),
                                  focusNode: _codeNode,
                                  decoration: InputDecoration(
                                    contentPadding: EdgeInsets.symmetric(
                                        vertical: ScreenUtil().setWidth(6),
                                        horizontal: ScreenUtil().setWidth(20)),
                                    border: OutlineInputBorder(),
                                    hintText: '请输入短信验证码',
                                    hintStyle: TextStyle(
                                      color: MyColours.color_999999,
                                      fontSize: ScreenUtil().setSp(28),
                                    ),
                                    // enabledBorder: new UnderlineInputBorder(
                                    //   borderSide: BorderSide.none,
                                    // ),
                                    focusedBorder: OutlineInputBorder(
                                        borderSide: BorderSide(
                                            color: MyColours.color_199095)),
                                  ),
                                  onChanged: (value) {},
                                  onEditingComplete: () {
                                    FocusScope.of(context)
                                        .requestFocus(FocusNode()); //点击空白处隐藏键盘
                                  },
                                  keyboardType: TextInputType.number,
                                ),
                              ),
                              HEmptyView(20),
                              RoundButton(
                                height: ScreenUtil().setWidth(88),
                                width: ScreenUtil().setWidth(240),
                                text: countdownTime > 0
                                    ? "${countdownTime}s后重新获取"
                                    : "获取验证码",
                                radius: ScreenUtil().setWidth(10),
                                textColor: MyColours.color_333333,
                                gradientStart: MyColours.color_ffffff,
                                gradientEnd: MyColours.color_ffffff,
                                borderColor: MyColours.color_999999,
                                fontSize: 28,
                                isBold: false,
                                onPressed: () {
                                  if (countdownTime == 0) {
                                    startCountdown();
                                  }
                                },
                              )
                            ],
                          )),
                          // Spacer(),
                        ],
                      ),
                    ),
                  ),
                  RoundButton(
                    text: '提交',
                    gradientStart: MyColours.color_199095,
                    gradientEnd: MyColours.color_199095,
                    // borderColor: MyColours.color_999999,
                    radius: ScreenUtil().setWidth(20),
                    fontSize: 28,
                    isBold: false,
                    onPressed: () {
                      //真正登录成功标志
                      App.sp.setBool("isLogin", true);
                      NavigatorUtil.goIfNeedCreateStorePage(context);
                    },
                  )
                ],
              ))),
    );
  }
}