You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
393 lines
14 KiB
393 lines
14 KiB
import 'package:flutter/material.dart';
|
|
import 'package:dating_touchme_app/generated/assets.dart';
|
|
|
|
class UserInfoPage extends StatefulWidget {
|
|
const UserInfoPage({Key? key}) : super(key: key);
|
|
|
|
@override
|
|
State<UserInfoPage> createState() => _UserInfoPageState();
|
|
}
|
|
|
|
class _UserInfoPageState extends State<UserInfoPage> {
|
|
String _gender = 'male'; // 默认选择男性
|
|
String _nickname = '强壮的瘦子';
|
|
String _birthday = '';
|
|
String _education = '';
|
|
String _invitationCode = '';
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return Scaffold(
|
|
body: Stack(
|
|
children: [
|
|
// 背景图
|
|
Positioned.fill(
|
|
child: Image.asset(
|
|
Assets.imagesBgInformation,
|
|
fit: BoxFit.cover,
|
|
),
|
|
),
|
|
// 内容区域
|
|
SafeArea(
|
|
child: SingleChildScrollView(
|
|
padding: const EdgeInsets.symmetric(horizontal: 20.0),
|
|
child: Column(
|
|
children: [
|
|
// 标题
|
|
const SizedBox(height: 20),
|
|
Text(
|
|
'完善信息',
|
|
style: TextStyle(
|
|
fontSize: 24,
|
|
fontWeight: FontWeight.bold,
|
|
color: Color.fromRGBO(51, 51, 51, 1),
|
|
),
|
|
),
|
|
const SizedBox(height: 30),
|
|
|
|
// 头像
|
|
Stack(
|
|
children: [
|
|
Container(
|
|
width: 85,
|
|
height: 85,
|
|
decoration: const BoxDecoration(
|
|
shape: BoxShape.circle,
|
|
color: Colors.grey,
|
|
),
|
|
child: ClipOval(
|
|
// 这里可以替换为实际的头像图片
|
|
child: Image.asset(
|
|
Assets.imagesAvatarsExample,
|
|
fit: BoxFit.cover,
|
|
),
|
|
),
|
|
),
|
|
Positioned(
|
|
bottom: 0,
|
|
right: 0,
|
|
child: Container(
|
|
width: 30,
|
|
height: 30,
|
|
decoration: const BoxDecoration(
|
|
shape: BoxShape.circle,
|
|
color: Colors.blue,
|
|
),
|
|
child: Image.asset(
|
|
Assets.imagesBgEditAvatars,
|
|
width: 16,
|
|
height: 16,
|
|
color: Colors.white,
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
const SizedBox(height: 30),
|
|
|
|
// 性别选择
|
|
const Align(
|
|
alignment: Alignment.centerLeft,
|
|
child: Text(
|
|
'性别 (注册后不可修改)',
|
|
style: TextStyle(
|
|
fontSize: 16,
|
|
color: Color.fromRGBO(144, 144, 144, 1),
|
|
fontWeight: FontWeight.w500,
|
|
),
|
|
),
|
|
),
|
|
const SizedBox(height: 10),
|
|
Row(
|
|
children: [
|
|
GestureDetector(
|
|
onTap: () {
|
|
setState(() {
|
|
_gender = 'male';
|
|
});
|
|
},
|
|
child: Container(
|
|
padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 10),
|
|
decoration: BoxDecoration(
|
|
borderRadius: BorderRadius.circular(20),
|
|
color: _gender == 'male' ? Colors.black : Colors.grey[200],
|
|
),
|
|
child: Row(
|
|
children: [
|
|
Image.asset(
|
|
Assets.imagesManIcon,
|
|
width: 20,
|
|
height: 20,
|
|
color: _gender == 'male' ? Colors.white : Colors.black,
|
|
),
|
|
const SizedBox(width: 5),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
const SizedBox(width: 20),
|
|
GestureDetector(
|
|
onTap: () {
|
|
setState(() {
|
|
_gender = 'female';
|
|
});
|
|
},
|
|
child: Container(
|
|
padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 10),
|
|
decoration: BoxDecoration(
|
|
borderRadius: BorderRadius.circular(20),
|
|
color: _gender == 'female' ? Colors.pink : Colors.grey[200],
|
|
),
|
|
child: Row(
|
|
children: [
|
|
Image.asset(
|
|
Assets.imagesWomenIcon,
|
|
width: 20,
|
|
height: 20,
|
|
color: _gender == 'female' ? Colors.white : Colors.black,
|
|
),
|
|
const SizedBox(width: 5),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
const SizedBox(height: 30),
|
|
|
|
// 昵称
|
|
const Align(
|
|
alignment: Alignment.centerLeft,
|
|
child: Text(
|
|
'昵称',
|
|
style: TextStyle(
|
|
fontSize: 16,
|
|
color: Colors.black,
|
|
fontWeight: FontWeight.w500,
|
|
),
|
|
),
|
|
),
|
|
const SizedBox(height: 10),
|
|
Container(
|
|
padding: const EdgeInsets.symmetric(horizontal: 16),
|
|
decoration: BoxDecoration(
|
|
borderRadius: BorderRadius.circular(8),
|
|
color: Colors.white,
|
|
),
|
|
child: Row(
|
|
children: [
|
|
Expanded(
|
|
child: TextField(
|
|
controller: TextEditingController(text: _nickname),
|
|
onChanged: (value) {
|
|
_nickname = value;
|
|
},
|
|
decoration: const InputDecoration(
|
|
border: InputBorder.none,
|
|
),
|
|
),
|
|
),
|
|
TextButton(
|
|
onPressed: () {
|
|
// 随机昵称功能（不需要实现）
|
|
},
|
|
child: const Text(
|
|
'随机',
|
|
style: TextStyle(
|
|
color: Colors.grey,
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
const SizedBox(height: 30),
|
|
|
|
// 出生日期
|
|
const Align(
|
|
alignment: Alignment.centerLeft,
|
|
child: Text(
|
|
'年龄',
|
|
style: TextStyle(
|
|
fontSize: 16,
|
|
color: Colors.black,
|
|
fontWeight: FontWeight.w500,
|
|
),
|
|
),
|
|
),
|
|
const SizedBox(height: 10),
|
|
GestureDetector(
|
|
onTap: () {
|
|
// 打开日期选择器
|
|
_selectDate();
|
|
},
|
|
child: Container(
|
|
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 14),
|
|
decoration: BoxDecoration(
|
|
borderRadius: BorderRadius.circular(8),
|
|
color: Colors.white,
|
|
),
|
|
child: Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
children: [
|
|
Text(
|
|
_birthday.isEmpty ? '请选择你的出生日期' : _birthday,
|
|
style: TextStyle(
|
|
color: _birthday.isEmpty ? Colors.grey : Colors.black,
|
|
),
|
|
),
|
|
const Icon(Icons.arrow_forward_ios, color: Colors.grey),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
const SizedBox(height: 30),
|
|
|
|
// 学历
|
|
const Align(
|
|
alignment: Alignment.centerLeft,
|
|
child: Text(
|
|
'学历',
|
|
style: TextStyle(
|
|
fontSize: 16,
|
|
color: Colors.black,
|
|
fontWeight: FontWeight.w500,
|
|
),
|
|
),
|
|
),
|
|
const SizedBox(height: 10),
|
|
GestureDetector(
|
|
onTap: () {
|
|
// 打开学历选择器
|
|
_selectEducation();
|
|
},
|
|
child: Container(
|
|
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 14),
|
|
decoration: BoxDecoration(
|
|
borderRadius: BorderRadius.circular(8),
|
|
color: Colors.white,
|
|
),
|
|
child: Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
children: [
|
|
Text(
|
|
_education.isEmpty ? '请选择你的学历' : _education,
|
|
style: TextStyle(
|
|
color: _education.isEmpty ? Colors.grey : Colors.black,
|
|
),
|
|
),
|
|
const Icon(Icons.arrow_forward_ios, color: Colors.grey),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
const SizedBox(height: 30),
|
|
|
|
// 邀请码
|
|
const Align(
|
|
alignment: Alignment.centerLeft,
|
|
child: Text(
|
|
'邀请码 (非必填)',
|
|
style: TextStyle(
|
|
fontSize: 16,
|
|
color: Colors.black,
|
|
fontWeight: FontWeight.w500,
|
|
),
|
|
),
|
|
),
|
|
const SizedBox(height: 10),
|
|
Container(
|
|
padding: const EdgeInsets.symmetric(horizontal: 16),
|
|
decoration: BoxDecoration(
|
|
borderRadius: BorderRadius.circular(8),
|
|
color: Colors.white,
|
|
),
|
|
child: TextField(
|
|
onChanged: (value) {
|
|
_invitationCode = value;
|
|
},
|
|
decoration: const InputDecoration(
|
|
hintText: '请输入邀请码',
|
|
hintStyle: TextStyle(color: Colors.grey),
|
|
border: InputBorder.none,
|
|
),
|
|
),
|
|
),
|
|
const SizedBox(height: 50),
|
|
|
|
// 开始交友按钮
|
|
SizedBox(
|
|
width: double.infinity,
|
|
height: 50,
|
|
child: ElevatedButton(
|
|
onPressed: () {
|
|
// 提交用户信息
|
|
_submitUserInfo();
|
|
},
|
|
style: ElevatedButton.styleFrom(
|
|
backgroundColor: Colors.blue,
|
|
shape: RoundedRectangleBorder(
|
|
borderRadius: BorderRadius.circular(25),
|
|
),
|
|
),
|
|
child: const Text(
|
|
'开始交友',
|
|
style: TextStyle(
|
|
fontSize: 18,
|
|
color: Colors.white,
|
|
),
|
|
),
|
|
),
|
|
),
|
|
const SizedBox(height: 30),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
// 选择日期
|
|
void _selectDate() {
|
|
// 这里可以实现日期选择逻辑
|
|
// 为了简单起见，我们先设置一个默认日期
|
|
setState(() {
|
|
_birthday = '1990-01-01';
|
|
});
|
|
}
|
|
|
|
// 选择学历
|
|
void _selectEducation() {
|
|
// 这里可以实现学历选择逻辑
|
|
// 为了简单起见，我们先设置一个默认学历
|
|
setState(() {
|
|
_education = '本科';
|
|
});
|
|
}
|
|
|
|
// 提交用户信息
|
|
void _submitUserInfo() {
|
|
// 这里可以实现提交逻辑
|
|
print('提交用户信息:');
|
|
print('性别: $_gender');
|
|
print('昵称: $_nickname');
|
|
print('生日: $_birthday');
|
|
print('学历: $_education');
|
|
print('邀请码: $_invitationCode');
|
|
|
|
// 可以添加验证逻辑
|
|
if (_birthday.isEmpty || _education.isEmpty) {
|
|
ScaffoldMessenger.of(context).showSnackBar(
|
|
const SnackBar(content: Text('请完善所有必填信息')),
|
|
);
|
|
return;
|
|
}
|
|
|
|
// 提交成功后跳转到下一个页面
|
|
ScaffoldMessenger.of(context).showSnackBar(
|
|
const SnackBar(content: Text('信息提交成功')),
|
|
);
|
|
}
|
|
}
|