app-starlock/star_lock/lib/login/register/starLock_register_page.dart
2023-07-29 18:33:48 +08:00

371 lines
14 KiB
Dart

import 'dart:async';
import 'dart:ffi';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import '../../appRouters.dart';
import '../../app_settings/app_colors.dart';
import '../../tools/tf_loginInput.dart';
import '../../tools/submitBtn.dart';
import '../../tools/titleAppBar.dart';
import '../../translations/trans_lib.dart';
import 'starLock_register_logic.dart';
class StarLockRegisterPage extends StatefulWidget {
const StarLockRegisterPage({Key? key}) : super(key: key);
@override
State<StarLockRegisterPage> createState() => _StarLockRegisterPageState();
}
class _StarLockRegisterPageState extends State<StarLockRegisterPage> {
final logic = Get.find<StarLockRegisterLogic>();
final state = Get.find<StarLockRegisterLogic>().state;
late Timer _timer;
final int _seconds = 60;
@override
Widget build(BuildContext context) {
return Scaffold(
resizeToAvoidBottomInset: false,
backgroundColor: const Color(0xFFFFFFFF),
appBar: TitleAppBar(
barTitle: TranslationLoader.lanKeys!.register!.tr,
haveBack: true,
backgroundColor: AppColors.mainColor),
body: ListView(
padding: EdgeInsets.only(top: 40.h, left: 40.w, right: 40.w),
children: [
topSeletCountryAndRegionWidget(),
middleTFWidget(),
Obx(() {
print("11111:${state.canSub.value}");
return SubmitBtn(
btnName: TranslationLoader.lanKeys!.register!.tr,
// backgroundColorList: state.canSub.value ? [AppColors.mainColor] :[Colors.grey],
fontSize: 30.sp,
borderRadius: 20.w,
padding: EdgeInsets.only(top: 25.w, bottom: 25.w),
isDisabled: state.canSub.value,
onClick: state.canSub.value
? () {
logic.register();
}
: null);
}),
SizedBox(
height: 20.h,
),
_buildBottomAgreement()
],
));
}
Widget topSeletCountryAndRegionWidget() {
return Column(
children: [
SizedBox(height: 50.h),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Container(
width: 340.w,
height: 60.h,
// color: Colors.red,
decoration: BoxDecoration(
borderRadius: BorderRadius.all(Radius.circular(30.h)),
border: const Border(
top: BorderSide(width: 1.0, color: AppColors.greyLineColor),
left:
BorderSide(width: 1.0, color: AppColors.greyLineColor),
right:
BorderSide(width: 1.0, color: AppColors.greyLineColor),
bottom:
BorderSide(width: 1.0, color: AppColors.greyLineColor),
)),
child: Row(
children: [
GestureDetector(
onTap: () {},
child: Container(
width: 170.w,
height: 60.h,
// color: Colors.red,
decoration: BoxDecoration(
color: AppColors.mainColor,
borderRadius:
BorderRadius.all(Radius.circular(30.h)),
border: const Border(
top: BorderSide(
width: 1.0, color: AppColors.greyLineColor),
left: BorderSide(
width: 1.0, color: AppColors.greyLineColor),
right: BorderSide(
width: 1.0, color: AppColors.greyLineColor),
bottom: BorderSide(
width: 1.0, color: AppColors.greyLineColor),
)),
child: Center(
child: Text(
TranslationLoader.lanKeys!.iphone!.tr,
style: TextStyle(color: Colors.white),
))),
),
Expanded(
child: GestureDetector(
onTap: () {},
child: Container(
height: 60.h,
// color: Colors.red,
// decoration: BoxDecoration(
// borderRadius: BorderRadius.all(Radius.circular(30.h)),
// border: const Border(
// top: BorderSide(width: 1.0, color: Color(0xffC0C0C0)),
// left: BorderSide(width: 1.0, color: Color(0xffC0C0C0)),
// right: BorderSide(width: 1.0, color: Color(0xffC0C0C0)),
// bottom: BorderSide(width: 1.0, color: Color(0xffC0C0C0)),
// )
// ),
child: Center(
child: Text(
TranslationLoader.lanKeys!.email!.tr,
style: const TextStyle(color: Colors.black),
))),
),
),
],
),
),
],
),
SizedBox(height: 60.h),
GestureDetector(
onTap: () async {
Navigator.pushNamed(context, Routers.seletCountryRegionPage);
var result = await Navigator.pushNamed(
context, Routers.seletCountryRegionPage);
logic.state.countryCode.value =
(result as Map<String, dynamic>)['code'];
logic.state.countryId.value = result["countryId"];
// print("路由返回值: ${result}, countryCode:${logic.state.countryCode} ,countryId:${logic.state.countryId}");
},
child: Container(
height: 70.h,
// color: Colors.red,
// padding: EdgeInsets.only(left:20.w, right: 10.w, top: 20.w, bottom: 20.w),
child: Row(
children: [
SizedBox(width: 5.w),
Expanded(
child: Text(TranslationLoader.lanKeys!.countryAndRegion!.tr,
style: TextStyle(
fontSize: 26.sp, color: AppColors.blackColor))),
SizedBox(width: 20.w),
Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
Text(
"中国+86",
textAlign: TextAlign.end,
style: TextStyle(
fontSize: 26.sp, color: AppColors.blackColor),
)
],
),
SizedBox(width: 5.w),
Image.asset(
'images/icon_right.png',
width: 50.w,
height: 50.w,
),
],
),
),
),
Container(
height: 0.5.h,
color: Colors.grey,
)
],
);
}
Widget middleTFWidget() {
return Column(
children: [
LoginInput(
controller: state.phoneOrEmailController,
onchangeAction: (v) {
print("3333333:${v}");
logic.checkNext(state.phoneOrEmailController);
},
leftWidget:
// Image.asset('images/icon_login_account.png', width: 30.w, height: 30.w,),
Padding(
padding: EdgeInsets.only(right: 10.w, left: 5.w),
child: Image.asset('images/icon_login_account.png', width: 30.w, height: 30.w,),
),
hintText: TranslationLoader.lanKeys!.pleaseEnterNumberOrEmail!.tr,
keyboardType: TextInputType.number,
inputFormatters: [
FilteringTextInputFormatter.allow(RegExp('[0-9]')),
LengthLimitingTextInputFormatter(20),
]),
SizedBox(height: 10.w),
LoginInput(
controller: state.pwdController,
onchangeAction: (v) {
logic.checkNext(state.pwdController);
},
isPwd: true,
leftWidget: Padding(
padding: EdgeInsets.only(right: 10.w, left: 5.w),
child: Image.asset('images/icon_login_password.png', width: 30.w, height: 30.w,),
),
hintText:
"${TranslationLoader.lanKeys!.pleaseEnter!.tr}${TranslationLoader.lanKeys!.password!.tr}",
inputFormatters: [
LengthLimitingTextInputFormatter(20),
]),
SizedBox(height: 15.w),
Text(
TranslationLoader.lanKeys!.registerPasswordTip!.tr,
style:
TextStyle(color: AppColors.placeholderTextColor, fontSize: 20.sp),
),
SizedBox(height: 10.w),
LoginInput(
controller: state.sureController,
onchangeAction: (v) {
logic.checkNext(state.sureController);
},
isPwd: true,
leftWidget: Padding(
padding: EdgeInsets.only(right: 10.w, left: 5.w),
child: Image.asset('images/icon_login_password.png', width: 30.w, height: 30.w,),
),
hintText:
"${TranslationLoader.lanKeys!.sure!.tr}${TranslationLoader.lanKeys!.password!.tr}",
inputFormatters: [
LengthLimitingTextInputFormatter(20),
]),
SizedBox(height: 10.w),
Row(
children: [
Expanded(
child: LoginInput(
controller: state.codeController,
isPwd: true,
onchangeAction: (v) {
logic.checkNext(state.codeController);
},
leftWidget: Padding(
padding: EdgeInsets.only(right: 10.w, left: 5.w),
child: SizedBox(
width: 30.w,
height: 30.w,
),
// Image.asset(
// 'images/main/icon_main_search.png',
// width: 40.w,
// height: 40.w,
// ),
),
hintText: "${TranslationLoader.lanKeys!.pleaseEnter!.tr}${TranslationLoader.lanKeys!.verificationCode!.tr}",
inputFormatters: [
LengthLimitingTextInputFormatter(20),
]),
),
SizedBox(
width: 20.w,
),
GestureDetector(
child: Container(
width: 180.w,
height: 60.h,
padding: EdgeInsets.all(5.h),
decoration: BoxDecoration(
color: AppColors.mainColor,
borderRadius: BorderRadius.circular(5)),
child: Center(
child: Text(
_seconds == 60
? TranslationLoader.lanKeys!.getVerificationCode!.tr
: (_seconds < 10)
? '0$_seconds s'
: '$_seconds s',
textAlign: TextAlign.center,
style: TextStyle(
color: Colors.white,
fontSize: 26.sp,
)),
),
),
onTap: () {
Navigator.pushNamed(context, Routers.safetyVerificationPage, arguments: {"countryCode":"+86", "account":"15080825640"});
if (_seconds == 60) {
// _setVerify();
} else {
// Toast.show(msg: '正在获取验证码');
}
},
)
],
),
SizedBox(height: 50.w),
],
);
}
Widget _buildBottomAgreement() {
return Row(
mainAxisAlignment: MainAxisAlignment.start,
children: [
Image.asset(
'images/icon_select_circle.png',
width: 28.w,
height: 28.w,
),
// SizedBox(
// height: 20.h,
// width: 26.w,
// child: Checkbox(value: false, onChanged: (value) {})),
SizedBox(
width: 15.w,
),
Flexible(
child: RichText(
text: TextSpan(
text: TranslationLoader.lanKeys!.readAndAgree!.tr,
style: TextStyle(color: const Color(0xff333333), fontSize: 20.sp),
children: [
WidgetSpan(
alignment: PlaceholderAlignment.middle,
child: GestureDetector(
child: Text(
'${TranslationLoader.lanKeys!.userAgreement!.tr}',
style: TextStyle(
color: AppColors.mainColor, fontSize: 20.sp)),
onTap: () {},
)),
WidgetSpan(
alignment: PlaceholderAlignment.middle,
child: GestureDetector(
child: Text(
'${TranslationLoader.lanKeys!.privacyPolicy!.tr}',
style: TextStyle(
color: AppColors.mainColor, fontSize: 20.sp)),
onTap: () {},
)),
],
)),
)
],
);
}
}