feat:更新页面颜色

This commit is contained in:
2026-06-17 13:24:37 +08:00
parent 021db2efac
commit 02084ada96
9 changed files with 601 additions and 341 deletions

View File

@@ -1,4 +1,7 @@
import 'package:flutter/material.dart';
import 'package:liquid_glass_widgets/liquid_glass_widgets.dart';
import 'chat_page.dart';
class MessagePage extends StatelessWidget {
const MessagePage({super.key});
@@ -6,20 +9,20 @@ class MessagePage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: const Color(0xFFF5F5F7),
backgroundColor: Colors.transparent,
appBar: _buildAppBar(),
body: _buildMessageList(),
body: _buildMessageList(context),
);
}
PreferredSizeWidget _buildAppBar() {
return AppBar(
backgroundColor: Colors.grey.shade200,
backgroundColor: Color(0xFF120D25),
elevation: 0,
centerTitle: true,
leading: IconButton(
onPressed: () {},
icon: const Icon(Icons.menu, size: 22),
icon: const Icon(Icons.menu, size: 22, color: Colors.white),
splashRadius: 20,
),
title: const Text(
@@ -27,113 +30,106 @@ class MessagePage extends StatelessWidget {
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.w600,
color: Color(0xFF1C1C1E),
color: Colors.white,
),
),
actions: [
IconButton(
onPressed: () {},
icon: const Icon(Icons.search, size: 22),
icon: const Icon(Icons.search, size: 22, color: Colors.white),
splashRadius: 20,
),
IconButton(
onPressed: () {},
icon: const Icon(Icons.add_circle_outline, size: 22),
icon: const Icon(Icons.add, size: 22, color: Colors.white),
splashRadius: 20,
),
],
);
}
Widget _buildMessageList() {
Widget _buildMessageList(BuildContext context) {
return ListView.separated(
padding: EdgeInsets.only(
left: 10,
right: 10,
top: 10,
bottom: MediaQuery.of(context).padding.bottom + 80,
),
separatorBuilder: (BuildContext context, int index) {
return SizedBox(height: 10);
},
itemCount: _messages.length,
separatorBuilder: (_, __) => const SizedBox(height: 0),
itemBuilder: (context, index) {
final msg = _messages[index];
return Container(
decoration: const BoxDecoration(
color: Colors.white,
border: Border(
bottom: BorderSide(
color: Color(0xFFE5E5EA),
width: 0.6,
),
),
),
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 0),
child: ListTile(
contentPadding: EdgeInsets.zero,
leading: CircleAvatar(
backgroundColor: Colors.transparent,
backgroundImage: NetworkImage(msg['avatar']!),
),
title: Text(
msg['name'].toString(),
style: const TextStyle(
fontWeight: FontWeight.w500,
color: Color(0xFF1C1C1E),
),
),
subtitle: Text(
msg['lastMsg'].toString(),
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: const TextStyle(
fontSize: 13,
color: Color(0xFF8E8E93),
),
),
trailing: Text(
msg['time'].toString(),
style: const TextStyle(
fontSize: 12,
color: Color(0xFF8E8E93),
),
),
),
);
return _buildMessageItem(context, msg);
},
);
}
Widget _buildMessageItem(BuildContext context, Message msg) {
return GlassCard(
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 0),
child: ListTile(
contentPadding: EdgeInsets.zero,
onTap:
() => {
Navigator.push(
context,
MaterialPageRoute(
builder:
(_) => const ChatPage(
contactName: '张三',
avatarUrl: 'https://picsum.photos/id/1012/200',
),
),
),
},
leading: CircleAvatar(
backgroundColor: Colors.transparent,
backgroundImage: NetworkImage(msg.avatar),
),
title: Text(
msg.name,
style: const TextStyle(
fontWeight: FontWeight.w500,
color: Colors.white,
),
),
subtitle: Text(
msg.lastMsg,
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: const TextStyle(fontSize: 13, color: Color(0xFFAEAEB2)),
),
trailing: Text(
msg.time,
style: const TextStyle(fontSize: 12, color: Color(0xFF8E8E93)),
),
),
);
}
}
/// ✅ 假数据
const List<Map<String, String>> _messages = [
{
'avatar': 'https://randomuser.me/api/portraits/men/32.jpg',
'name': '小刘',
'lastMsg': '今晚一起吃饭吗?',
'time': '12:30',
},
{
'avatar': 'https://randomuser.me/api/portraits/women/44.jpg',
'name': 'AI 助手',
'lastMsg': '已为你生成总结',
'time': '11:20',
},
{
'avatar': 'https://randomuser.me/api/portraits/men/65.jpg',
'name': '产品经理',
'lastMsg': '新版本评审定在周五',
'time': '昨天',
},
{
'avatar': 'https://randomuser.me/api/portraits/men/32.jpg',
'name': '小刘',
'lastMsg': '今晚一起吃饭吗?',
'time': '12:30',
},
{
'avatar': 'https://randomuser.me/api/portraits/women/44.jpg',
'name': 'AI 助手',
'lastMsg': '已为你生成总结',
'time': '11:20',
},
{
'avatar': 'https://randomuser.me/api/portraits/men/65.jpg',
'name': '产品经理',
'lastMsg': '新版本评审定在周五',
'time': '昨天',
},
];
class Message {
final String name;
final String avatar;
final String lastMsg;
final String time;
Message({
required this.name,
required this.avatar,
required this.lastMsg,
required this.time,
});
}
List<Message> _messages = [
Message(
avatar: 'https://picsum.photos/id/1012/200',
name: '小刘',
lastMsg: '今晚一起吃饭吗?',
time: '12:30',
),
];