|
|
import 'package:flutter/cupertino.dart';
|
|
|
import 'package:flutter/foundation.dart';
|
|
|
import 'package:flutter/gestures.dart';
|
|
|
import 'package:flutter/material.dart';
|
|
|
import 'package:flutter/services.dart';
|
|
|
import 'package:project_telephony/ui/widget/plone_back_button.dart';
|
|
|
import 'package:project_telephony/utils/headers.dart';
|
|
|
|
|
|
import '../../base/base_style.dart';
|
|
|
import '../tab_navigator.dart';
|
|
|
import '../widget/image_scaffold.dart';
|
|
|
import '../widget/plone_bottom.dart';
|
|
|
|
|
|
class LoginPage extends StatefulWidget {
|
|
|
const LoginPage({Key? key}) : super(key: key);
|
|
|
|
|
|
@override
|
|
|
_LoginPageState createState() => _LoginPageState();
|
|
|
}
|
|
|
|
|
|
class _LoginPageState extends State<LoginPage> {
|
|
|
// String _operator="";
|
|
|
// String _phone="";
|
|
|
// bool _chooseAgreement = false;
|
|
|
// bool _getCodeEnable = true;
|
|
|
// late Timer _timer;
|
|
|
//
|
|
|
// ///时钟
|
|
|
// String _countDownStr = "发送验证码";
|
|
|
//
|
|
|
// ///初始化文本
|
|
|
// int _countDownNum = 59;
|
|
|
|
|
|
///时间倒计数值
|
|
|
late final TextEditingController _phoneController =
|
|
|
TextEditingController(text: "");
|
|
|
late final TextEditingController _smsCodeController =
|
|
|
TextEditingController(text: "");
|
|
|
|
|
|
// // late FocusNode _smsCodeFocusNode=FocusNode (canRequestFocus: );
|
|
|
// bool _cantSelected = false;
|
|
|
@override
|
|
|
void initState() {
|
|
|
super.initState();
|
|
|
// _operator = '中国移动认证';
|
|
|
// _phone = '12345678909';
|
|
|
}
|
|
|
|
|
|
@override
|
|
|
Widget build(BuildContext context) {
|
|
|
return CloudScaffold(
|
|
|
systemStyle: const SystemUiOverlayStyle(
|
|
|
statusBarIconBrightness: Brightness.dark,
|
|
|
),
|
|
|
path: Assets.images.bg.path,
|
|
|
appbar: Row(
|
|
|
children: [
|
|
|
Padding(
|
|
|
padding: EdgeInsets.only(top: 88.w, left: 8.w),
|
|
|
child: const CloudBackButton(isSpecial: true),
|
|
|
),
|
|
|
Padding(
|
|
|
padding: EdgeInsets.only(left: 186.w, top: 88.w),
|
|
|
child: Text(
|
|
|
"登录/注册",
|
|
|
style: TextStyle(
|
|
|
fontSize: BaseStyle.fontSize34,
|
|
|
color: BaseStyle.color333333,
|
|
|
fontWeight: FontWeight.bold),
|
|
|
))
|
|
|
],
|
|
|
),
|
|
|
extendBody: true,
|
|
|
body: Container(
|
|
|
padding: EdgeInsets.only(left: 64.w, right: 64.w, top: 124.w),
|
|
|
child: Column(
|
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
|
children: [
|
|
|
Text(
|
|
|
"短信帮手",
|
|
|
style: TextStyle(
|
|
|
fontSize: 64.sp,
|
|
|
fontWeight: FontWeight.bold,
|
|
|
color: Colors.black),
|
|
|
),
|
|
|
32.hb,
|
|
|
Text(
|
|
|
"希望能成为您的短信小助手",
|
|
|
style: TextStyle(fontSize: 32.sp, color: const Color(0xFF999999)),
|
|
|
),
|
|
|
80.hb,
|
|
|
_getBox('+86', 36),
|
|
|
_getBox('验证码', 32),
|
|
|
112.hb,
|
|
|
PloneBottom(
|
|
|
blM: false,
|
|
|
onTap: () {
|
|
|
Get.to(() => const TabNavigator());
|
|
|
},
|
|
|
text: "立即登录",
|
|
|
),
|
|
|
32.hb,
|
|
|
_getText()
|
|
|
],
|
|
|
),
|
|
|
),
|
|
|
);
|
|
|
}
|
|
|
|
|
|
_getBox(String text, int fontSize) {
|
|
|
return Container(
|
|
|
height: 144.w,
|
|
|
width: double.infinity,
|
|
|
padding: EdgeInsets.symmetric(vertical: 48.w),
|
|
|
decoration: BoxDecoration(
|
|
|
// color: Colors.black12,
|
|
|
border: Border(
|
|
|
bottom: BorderSide(color: const Color(0xFFE8E8E8), width: 1.w),
|
|
|
),
|
|
|
),
|
|
|
child: Row(children: [
|
|
|
SizedBox(
|
|
|
width: 112.w,
|
|
|
child: Text(
|
|
|
text,
|
|
|
style: TextStyle(
|
|
|
fontSize: fontSize.sp,
|
|
|
color: BaseStyle.color333333,
|
|
|
fontWeight: FontWeight.bold),
|
|
|
),
|
|
|
),
|
|
|
Container(
|
|
|
width: 2.w,
|
|
|
height: 48.w,
|
|
|
margin: EdgeInsets.symmetric(horizontal: 32.w),
|
|
|
color: const Color(0xFFE8E8E8),
|
|
|
),
|
|
|
_phoneTFWidget(),
|
|
|
]),
|
|
|
);
|
|
|
}
|
|
|
// 输入手机号
|
|
|
|
|
|
_phoneTFWidget() {
|
|
|
return SizedBox(
|
|
|
// alignment: Alignment.centerLeft,
|
|
|
// padding: EdgeInsets.symmetric(horizontal: 72.w),
|
|
|
width: 300.w,
|
|
|
height: 50.w,
|
|
|
child: TextField(
|
|
|
maxLength: 11,
|
|
|
inputFormatters: [FilteringTextInputFormatter.allow(RegExp(r'[0-9]'))],
|
|
|
textCapitalization: TextCapitalization.none,
|
|
|
decoration: InputDecoration(
|
|
|
contentPadding: EdgeInsets.only(bottom: 20.w),
|
|
|
border: InputBorder.none,
|
|
|
counterText: "",
|
|
|
//textfield占位语，类似于iOS中的placeholder
|
|
|
hintText: "请输入手机号",
|
|
|
//占位语颜色
|
|
|
hintStyle: TextStyle(color: Colors.black12),
|
|
|
),
|
|
|
),
|
|
|
);
|
|
|
}
|
|
|
|
|
|
// 输入验证码
|
|
|
_codeWidget() {
|
|
|
return SizedBox(
|
|
|
width: 300.w,
|
|
|
height: 50.w,
|
|
|
child: TextField(
|
|
|
onChanged: (String phone) {
|
|
|
setState(() {});
|
|
|
},
|
|
|
controller: _smsCodeController,
|
|
|
// focusNode: _smsCodeFocusNode,
|
|
|
keyboardType: TextInputType.number,
|
|
|
style: TextStyle(fontSize: 36.sp, color: BaseStyle.color999999),
|
|
|
inputFormatters: [
|
|
|
LengthLimitingTextInputFormatter(4),
|
|
|
],
|
|
|
cursorColor: Colors.black,
|
|
|
decoration: InputDecoration(
|
|
|
// prefixIcon: Container(
|
|
|
// width: 10.w,
|
|
|
// alignment: Alignment.centerLeft,
|
|
|
// child: Text(
|
|
|
// "验证码",
|
|
|
// style: TextStyle(
|
|
|
// fontSize: 32.sp,
|
|
|
// color: const Color(0xFF000000)),
|
|
|
// ),
|
|
|
// ),
|
|
|
prefixText: "验证码",
|
|
|
prefixStyle: const TextStyle(
|
|
|
color: Colors.black,
|
|
|
),
|
|
|
enabledBorder: const UnderlineInputBorder(
|
|
|
// 不是焦点的时候颜色
|
|
|
borderSide: BorderSide(
|
|
|
color: BaseStyle.color999999,
|
|
|
),
|
|
|
),
|
|
|
hintText: "请输入验证码",
|
|
|
hintStyle: TextStyle(color: BaseStyle.colorcccccc, fontSize: 36.sp),
|
|
|
)),
|
|
|
);
|
|
|
}
|
|
|
|
|
|
// // 倒计时
|
|
|
// _beginCountDown() {
|
|
|
// ///开始倒计时
|
|
|
// setState(() {
|
|
|
// _getCodeEnable = false;
|
|
|
// _countDownStr = "重新获取($_countDownNum)";
|
|
|
// });
|
|
|
// _timer = Timer.periodic(const Duration(seconds: 1), (timer) {
|
|
|
// if (!mounted) {
|
|
|
// return;
|
|
|
// }
|
|
|
// setState(() {
|
|
|
// if (_countDownNum == 0) {
|
|
|
// _countDownNum = 59;
|
|
|
// _countDownStr = "获取验证码";
|
|
|
// _getCodeEnable = true;
|
|
|
// _timer.cancel();
|
|
|
// return;
|
|
|
// }
|
|
|
// _countDownStr = "重新获取(${_countDownNum--})";
|
|
|
// });
|
|
|
// });
|
|
|
// }
|
|
|
|
|
|
// 协议
|
|
|
_recognizer(context, int type) {
|
|
|
final TapGestureRecognizer recognizer = TapGestureRecognizer();
|
|
|
recognizer.onTap = () {
|
|
|
if (kDebugMode) {
|
|
|
print("点击协议了");
|
|
|
}
|
|
|
|
|
|
///跳转到用户协议页面
|
|
|
};
|
|
|
return recognizer;
|
|
|
}
|
|
|
|
|
|
_getText() {
|
|
|
return GestureDetector(
|
|
|
onTap: () {
|
|
|
// _chooseAgreement = !_chooseAgreement;
|
|
|
setState(() {});
|
|
|
},
|
|
|
child: Row(
|
|
|
mainAxisSize: MainAxisSize.min,
|
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
|
|
children: [
|
|
|
Container(
|
|
|
width: 50.w,
|
|
|
height: 50.w,
|
|
|
padding: EdgeInsets.only(top: 6.w, right: 5.w),
|
|
|
child: const Icon(CupertinoIcons.circle,
|
|
|
size: 18, color: Color(0xFFdddddd))),
|
|
|
// !_chooseAgreement
|
|
|
// ? const Icon(CupertinoIcons.circle,
|
|
|
// size: 18, color: Color(0xFFdddddd))
|
|
|
// : const Icon(CupertinoIcons.checkmark_circle,
|
|
|
// size: 18, color: Colors.red)),
|
|
|
RichText(
|
|
|
text: TextSpan(
|
|
|
text: "我已阅读并同意",
|
|
|
style: TextStyle(
|
|
|
color: BaseStyle.colorcccccc, fontSize: 12 * 2.sp),
|
|
|
children: [
|
|
|
TextSpan(
|
|
|
text: '《用户服务协议》',
|
|
|
style: TextStyle(color: kPrimaryColor, fontSize: 12 * 2.sp),
|
|
|
recognizer: _recognizer(context, 2)),
|
|
|
TextSpan(
|
|
|
text: "和",
|
|
|
style: TextStyle(
|
|
|
color: BaseStyle.colorcccccc, fontSize: 12 * 2.sp),
|
|
|
),
|
|
|
TextSpan(
|
|
|
text: '《隐私协议》',
|
|
|
style: TextStyle(color: kPrimaryColor, fontSize: 12 * 2.sp),
|
|
|
recognizer: _recognizer(context, 1)),
|
|
|
])),
|
|
|
],
|
|
|
),
|
|
|
);
|
|
|
}
|
|
|
}
|
