qzl/social-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(flutter): add auth module with router and screens

Browse Source 
- Add app_router.dart with auth routes (login, register)
- Update main.dart with MaterialApp.router
- Add 5 auth screens:
  - LoginEmailScreen with email validation
  - LoginPasswordScreen with password visibility toggle
  - LoginCodeScreen with verification code input
  - RegisterScreen with step indicator
  - RegisterStep2Screen with password/code/invite inputs
This commit is contained in:
qzl
2026-02-25 10:57:43 +08:00
parent 8c0b0a25c3
commit 4fb90de1f5
7 changed files with 1016 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/lib/features/auth/ui/screens/register_step2_screen.dart
+274
View File
@@ -0,0 +1,274 @@
import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';
import '../../../../core/theme/design_tokens.dart';
import '../../../../shared/widgets/app_button.dart';
class RegisterStep2Screen extends StatefulWidget {
const RegisterStep2Screen({super.key});
@override
State<RegisterStep2Screen> createState() => _RegisterStep2ScreenState();
}
class _RegisterStep2ScreenState extends State<RegisterStep2Screen> {
final _passwordController = TextEditingController();
final _codeController = TextEditingController();
final _inviteController = TextEditingController();
bool _obscureText = true;
@override
void dispose() {
_passwordController.dispose();
_codeController.dispose();
_inviteController.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: AppColors.background,
body: SafeArea(
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 24),
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Expanded(
child: Center(
child: Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
_buildAppIcon(),
const SizedBox(height: 24),
_buildAppTitle(),
const SizedBox(height: 24),
_buildFormContainer(),
],
),
),
),
_buildFooter(),
const SizedBox(height: 24),
],
),
),
),
);
}
Widget _buildAppIcon() {
return Container(
width: 104,
height: 104,
decoration: BoxDecoration(
color: AppColors.appIconRing,
borderRadius: BorderRadius.circular(52),
border: Border.all(color: AppColors.appIconBorder, width: 1),
),
child: Center(
child: ClipRRect(
borderRadius: BorderRadius.circular(38),
child: Image.asset(
'assets/images/logo.png',
width: 76,
height: 76,
fit: BoxFit.cover,
),
),
),
);
}
Widget _buildAppTitle() {
return const Text(
'linksy',
style: TextStyle(
fontFamily: 'Playfair Display',
fontSize: 34,
fontWeight: FontWeight.w700,
fontStyle: FontStyle.italic,
color: AppColors.appTitle,
letterSpacing: 0.5,
),
);
}
Widget _buildFormContainer() {
return SizedBox(
width: 327,
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
_buildPasswordInput(),
const SizedBox(height: 12),
_buildCodeInput(),
const SizedBox(height: 12),
_buildInviteInput(),
const SizedBox(height: 12),
_buildStepIndicator(),
const SizedBox(height: 12),
AppButton(text: '完成注册', onPressed: () {}),
],
),
);
}
Widget _buildPasswordInput() {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
'密码',
style: TextStyle(
fontSize: 13,
fontWeight: FontWeight.w500,
color: Color(0xFF475569),
),
),
const SizedBox(height: 6),
TextField(
controller: _passwordController,
obscureText: _obscureText,
decoration: InputDecoration(
hintText: '请输入至少 8 位密码',
suffixIcon: IconButton(
icon: Icon(
_obscureText ? Icons.visibility_off : Icons.visibility,
size: 20,
color: AppColors.slate400,
),
onPressed: () {
setState(() {
_obscureText = !_obscureText;
});
},
),
),
),
],
);
}
Widget _buildCodeInput() {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
'邮箱验证码',
style: TextStyle(
fontSize: 13,
fontWeight: FontWeight.w500,
color: Color(0xFF475569),
),
),
const SizedBox(height: 6),
Row(
children: [
Expanded(
child: SizedBox(
height: 40,
child: TextField(
controller: _codeController,
keyboardType: TextInputType.number,
decoration: const InputDecoration(
hintText: '输入验证码',
contentPadding: EdgeInsets.symmetric(
horizontal: 12,
vertical: 10,
),
),
),
),
),
const SizedBox(width: 8),
SizedBox(
width: 112,
height: 40,
child: OutlinedButton(
onPressed: () {},
style: OutlinedButton.styleFrom(
backgroundColor: AppColors.background,
side: const BorderSide(color: AppColors.input),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(6),
),
),
child: const Text(
'发送验证码',
style: TextStyle(
fontSize: 13,
fontWeight: FontWeight.w500,
color: AppColors.slate500,
),
),
),
),
],
),
],
);
}
Widget _buildInviteInput() {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
'邀请码（可选）',
style: TextStyle(
fontSize: 13,
fontWeight: FontWeight.w500,
color: Color(0xFF475569),
),
),
const SizedBox(height: 6),
TextField(
controller: _inviteController,
decoration: const InputDecoration(hintText: '有邀请码可填写'),
),
],
);
}
Widget _buildStepIndicator() {
return Row(
children: [
Expanded(
child: Container(
height: 4,
decoration: BoxDecoration(
color: AppColors.primary,
borderRadius: BorderRadius.circular(99),
),
),
),
const SizedBox(width: 6),
Expanded(
child: Container(
height: 4,
decoration: BoxDecoration(
color: AppColors.primary,
borderRadius: BorderRadius.circular(99),
),
),
),
],
);
}
Widget _buildFooter() {
return GestureDetector(
onTap: () => context.pop(),
child: const Text(
'已有账号？去登录',
style: TextStyle(
fontSize: 14,
fontWeight: FontWeight.w500,
color: AppColors.slate500,
),
),
);
}
}