CommunityAPP/lib/home_content_page.dart

279 lines
7.9 KiB
Dart
Raw Normal View History

import 'package:flutter/material.dart';
class HomeContentPage extends StatelessWidget {
const HomeContentPage({super.key});
@override
Widget build(BuildContext context) {
return SingleChildScrollView(
child: Column(
children: [
_announcementSection(),
_quickMenuSection(context),
_adCarousel(),
_marqueeNotice(),
_activitySection(),
],
),
);
}
// 📢 重要公告區塊
static Widget _announcementSection() {
return Padding(
padding: const EdgeInsets.all(16),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
'📢 重要公告',
style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
),
const SizedBox(height: 8),
Card(
child: ListTile(
title: const Text('4/20 水塔清洗通知'),
subtitle: const Text('本週六早上9:00至下午3:00進行清洗請提前儲水。'),
),
),
],
),
);
}
// 🔧 功能選單區塊
static Widget _quickMenuSection(BuildContext context) {
return Padding(
padding: const EdgeInsets.all(16),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
'🔧 功能選單',
style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
),
const SizedBox(height: 8),
GridView.count(
crossAxisCount: 3,
shrinkWrap: true,
physics: const NeverScrollableScrollPhysics(),
childAspectRatio: 1,
children: [
_buildQuickButton(context, '報修', 'assets/icons/repair.png'),
_buildQuickButton(context, '郵件', 'assets/icons/mail.png'),
_buildQuickButton(context, '訪客', 'assets/icons/visitor.png'),
_buildQuickButton(context, '繳費', 'assets/icons/payment.png'),
_buildQuickButton(context, '社區互動', 'assets/icons/community.png'),
_buildQuickButton(context, '緊急通報', 'assets/icons/emergency.png'),
],
),
],
),
);
}
static Widget _buildQuickButton(
BuildContext context,
String title,
String imgAssetPath,
) {
return GestureDetector(
onTap: () {
// TODO: 各個按鈕的跳轉功能可以寫在這裡
},
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Image.asset(imgAssetPath, width: 40, height: 40, color: Colors.grey),
const SizedBox(height: 8),
Text(title, style: const TextStyle(fontSize: 14)),
],
),
);
}
// 🖼️ 廣告輪播區
static Widget _adCarousel() {
return Padding(
padding: const EdgeInsets.symmetric(vertical: 16),
child: SizedBox(
height: 180,
child: PageView(
children: [
Image.asset('assets/banners/banner1.png', fit: BoxFit.cover),
Image.asset('assets/banners/banner2.png', fit: BoxFit.cover),
Image.asset('assets/banners/banner3.png', fit: BoxFit.cover),
],
),
),
);
}
// 🏃‍♂️ 跑馬燈公告
static Widget _marqueeNotice() {
return const MarqueeNotice();
}
// 🎉 活動卡片列表
static Widget _activitySection() {
return Padding(
padding: const EdgeInsets.all(16),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
'🎉 最新活動',
style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
),
const SizedBox(height: 8),
SizedBox(
height: 240,
child: ListView(
scrollDirection: Axis.horizontal,
children: [
_buildActivityCard(
'中秋烤肉趴',
'9/9 晚上6點開烤',
'assets/activities/bbq.png',
),
_buildActivityCard(
'親子日遊園',
'玩具福袋等你拿!',
'assets/activities/family_day.png',
),
_buildActivityCard(
'健康講堂',
'醫師到場解說',
'assets/activities/health.png',
),
_buildActivityCard(
'防災演習',
'模擬火災逃生',
'assets/activities/fire_drill.png',
),
_buildActivityCard(
'社區園遊會',
'免費攤位吃到飽',
'assets/activities/festival.png',
),
],
),
),
],
),
);
}
static Widget _buildActivityCard(
String title,
String subtitle,
String imgAssetPath,
) {
return Container(
width: 180,
margin: const EdgeInsets.only(right: 12),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(10),
boxShadow: [BoxShadow(color: Colors.black12, blurRadius: 5)],
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
ClipRRect(
borderRadius: const BorderRadius.vertical(top: Radius.circular(10)),
child: Image.asset(
imgAssetPath,
height: 120,
width: double.infinity,
fit: BoxFit.cover,
),
),
Padding(
padding: const EdgeInsets.all(8),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
title,
style: const TextStyle(fontWeight: FontWeight.bold),
),
const SizedBox(height: 4),
Text(
subtitle,
style: const TextStyle(fontSize: 12, color: Colors.black54),
),
const SizedBox(height: 8),
ElevatedButton(
onPressed: () {
// TODO: 活動詳情
},
child: const Text('查看'),
),
],
),
),
],
),
);
}
}
class MarqueeNotice extends StatefulWidget {
const MarqueeNotice({super.key});
@override
State<MarqueeNotice> createState() => _MarqueeNoticeState();
}
class _MarqueeNoticeState extends State<MarqueeNotice>
with SingleTickerProviderStateMixin {
late final AnimationController _controller;
late final Animation<double> _animation;
final String _marqueeText = '公告: 歡迎使用我們的社區通,請多加利用。謝謝您~ 如有問題可洽談管理室';
@override
void initState() {
super.initState();
_controller = AnimationController(
duration: const Duration(seconds: 10),
vsync: this,
)..repeat();
_animation = Tween<double>(begin: 1.0, end: -1.0).animate(_controller);
}
@override
void dispose() {
_controller.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return Container(
color: Colors.grey.shade300,
height: 40,
alignment: Alignment.centerLeft,
child: ClipRect(
child: AnimatedBuilder(
animation: _animation,
builder: (context, child) {
return FractionalTranslation(
translation: Offset(_animation.value, 0),
child: child,
);
},
child: Text(
_marqueeText,
style: const TextStyle(fontSize: 16),
overflow: TextOverflow.visible,
softWrap: false,
),
),
),
);
}
}