168 lines
4.5 KiB
Dart
168 lines
4.5 KiB
Dart
import 'package:flutter/material.dart';
|
|
import 'package:flutter/services.dart';
|
|
import 'package:flutter_screenutil/flutter_screenutil.dart';
|
|
import 'package:get/get.dart';
|
|
import 'package:wallpaperx/common/components/navigation_bar/base_appbar.dart';
|
|
import 'package:wallpaperx/page/login/login_controller.dart';
|
|
import 'package:wallpaperx/res/values/strings.dart';
|
|
|
|
class LoginView extends GetView<LoginController> {
|
|
const LoginView({super.key});
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return Scaffold(
|
|
appBar: const BaseAppBar(appName),
|
|
body: Container(
|
|
padding: const EdgeInsets.all(15).w,
|
|
child: GetBuilder<LoginController>(
|
|
id: "loginInfo",
|
|
builder: (_) => Column(
|
|
crossAxisAlignment: CrossAxisAlignment.center,
|
|
children: [
|
|
_buildUsernameInput(),
|
|
20.verticalSpace,
|
|
_buildPasswordInput(),
|
|
20.verticalSpace,
|
|
_buildLogin(),
|
|
20.verticalSpace,
|
|
_buildRegister(),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildUsernameInput() {
|
|
return Container(
|
|
height: 30.w,
|
|
decoration: BoxDecoration(
|
|
border: Border(
|
|
bottom: BorderSide(
|
|
color: controller.usernameEmpty ? Colors.red : Colors.grey,
|
|
width: 1.w, // 下边框的宽度
|
|
),
|
|
),
|
|
),
|
|
child: TextField(
|
|
inputFormatters: [
|
|
FilteringTextInputFormatter.allow(RegExp("[0-9.]|[a-zA-Z]|[@]")),
|
|
],
|
|
focusNode: controller.usernameFocusNode,
|
|
onTapOutside: (e) => {controller.usernameFocusNode.unfocus()},
|
|
autofocus: false,
|
|
controller: controller.usernameController,
|
|
maxLines: 1,
|
|
style: TextStyle(
|
|
color: Colors.white,
|
|
fontSize: 14.sp,
|
|
),
|
|
decoration: InputDecoration(
|
|
border: InputBorder.none,
|
|
hintText: "Username",
|
|
hintStyle: TextStyle(
|
|
color: controller.usernameEmpty ? Colors.red : Colors.grey,
|
|
fontSize: 14.sp,
|
|
),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildPasswordInput() {
|
|
return Container(
|
|
height: 30.w,
|
|
decoration: BoxDecoration(
|
|
border: Border(
|
|
bottom: BorderSide(
|
|
color: controller.passwordEmpty ? Colors.red : Colors.grey,
|
|
width: 1.w, // 下边框的宽度
|
|
),
|
|
),
|
|
),
|
|
child: TextField(
|
|
inputFormatters: [
|
|
FilteringTextInputFormatter.allow(RegExp("[0-9.]|[a-zA-Z]|[@]")),
|
|
],
|
|
obscureText: true,
|
|
focusNode: controller.passwordFocusNode,
|
|
onTapOutside: (e) => {controller.passwordFocusNode.unfocus()},
|
|
autofocus: false,
|
|
controller: controller.passwordController,
|
|
maxLines: 1,
|
|
style: TextStyle(
|
|
color: Colors.white,
|
|
fontSize: 14.sp,
|
|
),
|
|
decoration: InputDecoration(
|
|
border: InputBorder.none,
|
|
hintText: "Password",
|
|
hintStyle: TextStyle(
|
|
color: controller.passwordEmpty ? Colors.red : Colors.grey,
|
|
fontSize: 14.sp,
|
|
),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildLogin() {
|
|
return GestureDetector(
|
|
onTap: controller.onTapLogin,
|
|
child: Container(
|
|
width: double.infinity,
|
|
padding: const EdgeInsets.symmetric(
|
|
vertical: 10,
|
|
horizontal: 15,
|
|
).w,
|
|
decoration: BoxDecoration(
|
|
borderRadius: BorderRadius.circular(50).r,
|
|
color: Colors.white,
|
|
),
|
|
child: Row(
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
|
children: [
|
|
Text(
|
|
"Login",
|
|
style: TextStyle(
|
|
color: Colors.black87,
|
|
fontSize: 16.sp,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildRegister() {
|
|
return GestureDetector(
|
|
onTap: controller.onTapToUserEdit,
|
|
child: Container(
|
|
width: double.infinity,
|
|
padding: const EdgeInsets.symmetric(
|
|
vertical: 10,
|
|
horizontal: 15,
|
|
).w,
|
|
decoration: BoxDecoration(
|
|
borderRadius: BorderRadius.circular(50).r,
|
|
color: Colors.white,
|
|
),
|
|
child: Row(
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
|
children: [
|
|
Text(
|
|
"Register",
|
|
style: TextStyle(
|
|
color: Colors.black87,
|
|
fontSize: 16.sp,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
);
|
|
}
|
|
}
|