205 lines
7.0 KiB
Dart
205 lines
7.0 KiB
Dart
import 'package:flutter/material.dart';
|
|
import 'package:google_fonts/google_fonts.dart';
|
|
|
|
class MessageListScreen extends StatelessWidget {
|
|
const MessageListScreen({super.key});
|
|
|
|
final List<Map<String, dynamic>> messages = const [
|
|
{
|
|
"title": "Welcome Home",
|
|
"body":
|
|
"Welcome to FluxWater! Start your cozy journey of hydration today. Remember, a balanced body is a happy mind.",
|
|
"time": "Just now",
|
|
"color": Color(0xFFAED581),
|
|
"icon": Icons.home_rounded,
|
|
},
|
|
{
|
|
"title": "Hydration Tip",
|
|
"body":
|
|
"Did you know? Drinking water before meals can help you feel fuller and aid in digestion. Try a small glass 30 mins before lunch!",
|
|
"time": "2 hrs ago",
|
|
"color": Color(0xFF81D4FA),
|
|
"icon": Icons.lightbulb_rounded,
|
|
},
|
|
{
|
|
"title": "Achievement Unlocked",
|
|
"body":
|
|
"You've successfully set up your daily goal. Taking the first step is always the most important one. Keep it up!",
|
|
"time": "Yesterday",
|
|
"color": Color(0xFFFFCC80),
|
|
"icon": Icons.star_rounded,
|
|
},
|
|
{
|
|
"title": "Version Update",
|
|
"body":
|
|
"FluxWater v2.0 is live! We've added a warmer interface, improved statistics, and a brand new feedback channel just for you.",
|
|
"time": "2 days ago",
|
|
"color": Color(0xFFBCAAA4),
|
|
"icon": Icons.system_update_rounded,
|
|
},
|
|
];
|
|
|
|
void _showMessageDetail(BuildContext context, Map<String, dynamic> msg) {
|
|
showDialog(
|
|
context: context,
|
|
builder: (context) => AlertDialog(
|
|
contentPadding: const EdgeInsets.all(24),
|
|
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(28)),
|
|
content: Column(
|
|
mainAxisSize: MainAxisSize.min,
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
Row(
|
|
children: [
|
|
Container(
|
|
padding: const EdgeInsets.all(10),
|
|
decoration: BoxDecoration(
|
|
color: (msg['color'] as Color).withOpacity(0.2),
|
|
shape: BoxShape.circle,
|
|
),
|
|
child: Icon(msg['icon'], color: msg['color'], size: 24),
|
|
),
|
|
const SizedBox(width: 12),
|
|
Expanded(
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
Text(
|
|
msg['title'],
|
|
style: GoogleFonts.nunito(
|
|
fontSize: 18,
|
|
fontWeight: FontWeight.bold,
|
|
color: const Color(0xFF5D4037),
|
|
),
|
|
),
|
|
Text(
|
|
msg['time'],
|
|
style: GoogleFonts.quicksand(
|
|
fontSize: 12,
|
|
color: const Color(0xFFA1887F),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
],
|
|
),
|
|
const SizedBox(height: 20),
|
|
Text(
|
|
msg['body'],
|
|
style: GoogleFonts.quicksand(
|
|
fontSize: 16,
|
|
height: 1.5,
|
|
color: const Color(0xFF795548),
|
|
),
|
|
),
|
|
const SizedBox(height: 24),
|
|
Align(
|
|
alignment: Alignment.centerRight,
|
|
child: TextButton(
|
|
onPressed: () => Navigator.pop(context),
|
|
child: Text(
|
|
"Close",
|
|
style: GoogleFonts.nunito(
|
|
fontWeight: FontWeight.bold,
|
|
color: const Color(0xFFAED581),
|
|
),
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return Scaffold(
|
|
backgroundColor: const Color(0xFFFFFBF0),
|
|
appBar: AppBar(
|
|
title: Text(
|
|
"Messages",
|
|
style: GoogleFonts.nunito(fontWeight: FontWeight.bold),
|
|
),
|
|
),
|
|
body: ListView.separated(
|
|
padding: const EdgeInsets.all(24),
|
|
itemCount: messages.length,
|
|
separatorBuilder: (ctx, i) => const SizedBox(height: 16),
|
|
itemBuilder: (ctx, i) {
|
|
final msg = messages[i];
|
|
return GestureDetector(
|
|
onTap: () => _showMessageDetail(context, msg),
|
|
child: Container(
|
|
padding: const EdgeInsets.all(16),
|
|
decoration: BoxDecoration(
|
|
color: Colors.white,
|
|
borderRadius: BorderRadius.circular(20),
|
|
boxShadow: [
|
|
BoxShadow(
|
|
color: const Color(0xFF8D6E63).withOpacity(0.05),
|
|
blurRadius: 10,
|
|
offset: const Offset(0, 4),
|
|
),
|
|
],
|
|
),
|
|
child: Row(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
Container(
|
|
padding: const EdgeInsets.all(12),
|
|
decoration: BoxDecoration(
|
|
color: (msg['color'] as Color).withOpacity(0.15),
|
|
shape: BoxShape.circle,
|
|
),
|
|
child: Icon(msg['icon'], color: msg['color'], size: 22),
|
|
),
|
|
const SizedBox(width: 16),
|
|
Expanded(
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
children: [
|
|
Text(
|
|
msg['title'],
|
|
style: GoogleFonts.nunito(
|
|
fontWeight: FontWeight.bold,
|
|
fontSize: 16,
|
|
color: const Color(0xFF5D4037),
|
|
),
|
|
),
|
|
Text(
|
|
msg['time'],
|
|
style: GoogleFonts.quicksand(
|
|
fontSize: 12,
|
|
color: const Color(0xFFBCAAA4),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
const SizedBox(height: 6),
|
|
Text(
|
|
msg['body'],
|
|
maxLines: 2,
|
|
overflow: TextOverflow.ellipsis,
|
|
style: GoogleFonts.quicksand(
|
|
color: const Color(0xFF795548),
|
|
height: 1.4,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
);
|
|
},
|
|
),
|
|
);
|
|
}
|
|
}
|