update settings
This commit is contained in:
parent
3ae23dfdef
commit
1bdc015476
|
@ -11,28 +11,41 @@ class ControlScreen extends StatefulWidget {
|
||||||
|
|
||||||
class _ControlScreenState extends State<ControlScreen> {
|
class _ControlScreenState extends State<ControlScreen> {
|
||||||
bool isAutoMode = true; // default: mode otomatis
|
bool isAutoMode = true; // default: mode otomatis
|
||||||
|
bool isRepellerOn = false; // status pengusir (manual mode)
|
||||||
|
|
||||||
void toggleMode() {
|
void toggleMode() {
|
||||||
setState(() {
|
setState(() {
|
||||||
isAutoMode = !isAutoMode;
|
isAutoMode = !isAutoMode;
|
||||||
|
if (isAutoMode) {
|
||||||
|
isRepellerOn = false; // reset repeller saat mode otomatis
|
||||||
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
void triggerRepeller() {
|
void toggleRepeller() {
|
||||||
|
setState(() {
|
||||||
|
isRepellerOn = !isRepellerOn;
|
||||||
|
});
|
||||||
|
|
||||||
showDialog(
|
showDialog(
|
||||||
context: context,
|
context: context,
|
||||||
builder: (context) => AlertDialog(
|
builder: (context) => AlertDialog(
|
||||||
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(16)),
|
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(16)),
|
||||||
title: const Row(
|
title: Row(
|
||||||
children: [
|
children: [
|
||||||
Icon(Icons.check_circle_outline, color: Colors.green),
|
Icon(
|
||||||
SizedBox(width: 8),
|
isRepellerOn ? Icons.check_circle : Icons.power_settings_new,
|
||||||
Text('Berhasil'),
|
color: isRepellerOn ? Colors.green : Colors.grey,
|
||||||
|
),
|
||||||
|
const SizedBox(width: 8),
|
||||||
|
Text(isRepellerOn ? 'Diaktifkan' : 'Dimatikan'),
|
||||||
],
|
],
|
||||||
),
|
),
|
||||||
content: const Text(
|
content: Text(
|
||||||
'Pengusir hama berhasil diaktifkan secara manual.',
|
isRepellerOn
|
||||||
style: TextStyle(fontSize: 16),
|
? 'Pengusir hama berhasil diaktifkan.'
|
||||||
|
: 'Pengusir hama dimatikan.',
|
||||||
|
style: const TextStyle(fontSize: 16),
|
||||||
),
|
),
|
||||||
actions: [
|
actions: [
|
||||||
TextButton(
|
TextButton(
|
||||||
|
@ -63,47 +76,49 @@ class _ControlScreenState extends State<ControlScreen> {
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
),
|
),
|
||||||
|
|
||||||
body: Padding(
|
body: Padding(
|
||||||
padding: const EdgeInsets.all(20),
|
padding: const EdgeInsets.all(20),
|
||||||
child: Column(
|
child: Column(
|
||||||
|
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||||
children: [
|
children: [
|
||||||
const SizedBox(height: 10),
|
|
||||||
const Text(
|
|
||||||
'Mode Operasi',
|
|
||||||
style: TextStyle(fontSize: 22, fontWeight: FontWeight.bold),
|
|
||||||
),
|
|
||||||
const SizedBox(height: 16),
|
|
||||||
Card(
|
Card(
|
||||||
elevation: 3,
|
elevation: 4,
|
||||||
shape: RoundedRectangleBorder(
|
shape: RoundedRectangleBorder(
|
||||||
borderRadius: BorderRadius.circular(12)),
|
borderRadius: BorderRadius.circular(16),
|
||||||
|
),
|
||||||
|
color: isAutoMode ? Colors.blue.shade50 : Colors.orange.shade50,
|
||||||
child: Padding(
|
child: Padding(
|
||||||
padding: const EdgeInsets.all(16),
|
padding: const EdgeInsets.all(20),
|
||||||
child: Row(
|
child: Row(
|
||||||
children: [
|
children: [
|
||||||
Icon(
|
CircleAvatar(
|
||||||
|
backgroundColor: isAutoMode ? Colors.blue : Colors.orange,
|
||||||
|
radius: 28,
|
||||||
|
child: Icon(
|
||||||
isAutoMode ? Icons.autorenew : Icons.handyman,
|
isAutoMode ? Icons.autorenew : Icons.handyman,
|
||||||
color: isAutoMode ? Colors.blue : Colors.orange,
|
color: Colors.white,
|
||||||
size: 36,
|
size: 30,
|
||||||
),
|
),
|
||||||
const SizedBox(width: 16),
|
),
|
||||||
|
const SizedBox(width: 20),
|
||||||
Expanded(
|
Expanded(
|
||||||
child: Column(
|
child: Column(
|
||||||
crossAxisAlignment: CrossAxisAlignment.start,
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
children: [
|
children: [
|
||||||
Text(
|
Text(
|
||||||
isAutoMode ? 'Mode Otomatis' : 'Mode Manual',
|
isAutoMode ? 'Mode Otomatis' : 'Mode Manual',
|
||||||
style: const TextStyle(
|
style: TextStyle(
|
||||||
fontSize: 18, fontWeight: FontWeight.w600),
|
fontSize: 18,
|
||||||
|
fontWeight: FontWeight.bold,
|
||||||
|
color: isAutoMode ? Colors.blue : Colors.orange,
|
||||||
),
|
),
|
||||||
const SizedBox(height: 4),
|
),
|
||||||
|
const SizedBox(height: 6),
|
||||||
Text(
|
Text(
|
||||||
isAutoMode
|
isAutoMode
|
||||||
? 'Alat akan bekerja secara otomatis sesuai sensor'
|
? 'Alat akan aktif otomatis sesuai sensor.'
|
||||||
: 'Kamu dapat mengaktifkan alat secara manual',
|
: 'Kamu dapat mengendalikan alat secara manual.',
|
||||||
style: const TextStyle(
|
style: const TextStyle(color: Colors.black87),
|
||||||
fontSize: 14, color: Colors.grey),
|
|
||||||
),
|
),
|
||||||
],
|
],
|
||||||
),
|
),
|
||||||
|
@ -117,19 +132,74 @@ class _ControlScreenState extends State<ControlScreen> {
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
const SizedBox(height: 30),
|
|
||||||
|
const SizedBox(height: 20),
|
||||||
|
|
||||||
|
// CARD 2: STATUS PENGUSIR (Tampil hanya di mode manual)
|
||||||
|
if (!isAutoMode)
|
||||||
|
Card(
|
||||||
|
elevation: 4,
|
||||||
|
shape: RoundedRectangleBorder(
|
||||||
|
borderRadius: BorderRadius.circular(16),
|
||||||
|
),
|
||||||
|
color:
|
||||||
|
isRepellerOn ? Colors.green.shade50 : Colors.grey.shade100,
|
||||||
|
child: Padding(
|
||||||
|
padding: const EdgeInsets.all(20),
|
||||||
|
child: Row(
|
||||||
|
children: [
|
||||||
|
Icon(
|
||||||
|
isRepellerOn
|
||||||
|
? Icons.volume_up_rounded
|
||||||
|
: Icons.volume_off_rounded,
|
||||||
|
color: isRepellerOn ? Colors.green : Colors.grey,
|
||||||
|
size: 32,
|
||||||
|
),
|
||||||
|
const SizedBox(width: 20),
|
||||||
|
Expanded(
|
||||||
|
child: Text(
|
||||||
|
isRepellerOn
|
||||||
|
? 'Pengusir aktif secara manual.'
|
||||||
|
: 'Pengusir dalam keadaan mati.',
|
||||||
|
style: TextStyle(
|
||||||
|
fontSize: 16,
|
||||||
|
color: isRepellerOn
|
||||||
|
? Colors.green.shade700
|
||||||
|
: Colors.grey,
|
||||||
|
fontWeight: FontWeight.w600,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
|
||||||
|
const SizedBox(height: 20),
|
||||||
|
|
||||||
|
// TOMBOL AKSI (Manual mode)
|
||||||
if (!isAutoMode)
|
if (!isAutoMode)
|
||||||
ElevatedButton.icon(
|
ElevatedButton.icon(
|
||||||
onPressed: triggerRepeller,
|
onPressed: toggleRepeller,
|
||||||
icon: const Icon(Icons.volume_up),
|
icon: Icon(
|
||||||
label: const Text('Aktifkan Pengusir Sekarang'),
|
isRepellerOn
|
||||||
|
? Icons.power_settings_new_rounded
|
||||||
|
: Icons.volume_up_rounded,
|
||||||
|
),
|
||||||
|
label: Text(
|
||||||
|
isRepellerOn
|
||||||
|
? 'Matikan Pengusir'
|
||||||
|
: 'Aktifkan Pengusir Sekarang',
|
||||||
|
style: const TextStyle(fontSize: 16),
|
||||||
|
),
|
||||||
style: ElevatedButton.styleFrom(
|
style: ElevatedButton.styleFrom(
|
||||||
backgroundColor: Colors.red,
|
backgroundColor:
|
||||||
|
isRepellerOn ? Colors.grey.shade700 : Colors.red.shade600,
|
||||||
foregroundColor: Colors.white,
|
foregroundColor: Colors.white,
|
||||||
padding:
|
padding:
|
||||||
const EdgeInsets.symmetric(vertical: 14, horizontal: 24),
|
const EdgeInsets.symmetric(vertical: 16, horizontal: 24),
|
||||||
shape: RoundedRectangleBorder(
|
shape: RoundedRectangleBorder(
|
||||||
borderRadius: BorderRadius.circular(12)),
|
borderRadius: BorderRadius.circular(14)),
|
||||||
minimumSize: const Size.fromHeight(50),
|
minimumSize: const Size.fromHeight(50),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
|
|
|
@ -78,7 +78,7 @@ class _DashboardScreenState extends State<DashboardScreen> {
|
||||||
@override
|
@override
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
return Scaffold(
|
return Scaffold(
|
||||||
backgroundColor: const Color.fromARGB(255, 242, 242, 242),
|
backgroundColor: Colors.grey[100],
|
||||||
appBar: CustomHeader(
|
appBar: CustomHeader(
|
||||||
deviceName: 'HamaGuard',
|
deviceName: 'HamaGuard',
|
||||||
notificationCount: 5,
|
notificationCount: 5,
|
||||||
|
@ -110,14 +110,14 @@ class _DashboardScreenState extends State<DashboardScreen> {
|
||||||
Row(
|
Row(
|
||||||
children: const [
|
children: const [
|
||||||
Icon(Icons.thermostat_outlined,
|
Icon(Icons.thermostat_outlined,
|
||||||
color: Colors.deepOrangeAccent, size: 30),
|
color: Color.fromRGBO(56, 142, 60, 1), size: 30),
|
||||||
SizedBox(width: 12),
|
SizedBox(width: 12),
|
||||||
Text(
|
Text(
|
||||||
'Thermal Sensor',
|
'Thermal Sensor',
|
||||||
style: TextStyle(
|
style: TextStyle(
|
||||||
fontWeight: FontWeight.w600,
|
fontWeight: FontWeight.w600,
|
||||||
fontSize: 20,
|
fontSize: 20,
|
||||||
color: Colors.deepOrangeAccent,
|
color: Color.fromRGBO(56, 142, 60, 1),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
],
|
],
|
||||||
|
|
|
@ -3,16 +3,19 @@ import 'package:flutter/material.dart';
|
||||||
class NotificationScreen extends StatelessWidget {
|
class NotificationScreen extends StatelessWidget {
|
||||||
final List<Map<String, String>> notifications = [
|
final List<Map<String, String>> notifications = [
|
||||||
{
|
{
|
||||||
|
"type": "warning",
|
||||||
"title": "Peringatan!",
|
"title": "Peringatan!",
|
||||||
"message": "Hama terdeteksi di area sawah A.",
|
"message": "Hama terdeteksi di area sawah A.",
|
||||||
"time": "16 Mei 2025 - 10:15"
|
"time": "16 Mei 2025 - 10:15"
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
|
"type": "safe",
|
||||||
"title": "Status Aman",
|
"title": "Status Aman",
|
||||||
"message": "Tidak ada aktivitas hama selama 2 jam terakhir.",
|
"message": "Tidak ada aktivitas hama selama 2 jam terakhir.",
|
||||||
"time": "16 Mei 2025 - 09:00"
|
"time": "16 Mei 2025 - 09:00"
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
|
"type": "info",
|
||||||
"title": "Mode Otomatis Aktif",
|
"title": "Mode Otomatis Aktif",
|
||||||
"message": "Sistem kembali ke mode otomatis.",
|
"message": "Sistem kembali ke mode otomatis.",
|
||||||
"time": "15 Mei 2025 - 17:20"
|
"time": "15 Mei 2025 - 17:20"
|
||||||
|
@ -21,14 +24,50 @@ class NotificationScreen extends StatelessWidget {
|
||||||
|
|
||||||
NotificationScreen({super.key});
|
NotificationScreen({super.key});
|
||||||
|
|
||||||
|
Color _getColor(String type) {
|
||||||
|
switch (type) {
|
||||||
|
case 'warning':
|
||||||
|
return Colors.red.shade100;
|
||||||
|
case 'safe':
|
||||||
|
return Colors.green.shade100;
|
||||||
|
case 'info':
|
||||||
|
default:
|
||||||
|
return Colors.blue.shade100;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
IconData _getIcon(String type) {
|
||||||
|
switch (type) {
|
||||||
|
case 'warning':
|
||||||
|
return Icons.warning_amber_rounded;
|
||||||
|
case 'safe':
|
||||||
|
return Icons.check_circle_outline;
|
||||||
|
case 'info':
|
||||||
|
default:
|
||||||
|
return Icons.info_outline;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
Color _getIconColor(String type) {
|
||||||
|
switch (type) {
|
||||||
|
case 'warning':
|
||||||
|
return Colors.red;
|
||||||
|
case 'safe':
|
||||||
|
return Colors.green;
|
||||||
|
case 'info':
|
||||||
|
default:
|
||||||
|
return Colors.blue;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
@override
|
@override
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
return Scaffold(
|
return Scaffold(
|
||||||
appBar: AppBar(
|
appBar: AppBar(
|
||||||
title: const Text('Notifikasi'),
|
title: const Text('Notifikasi'),
|
||||||
backgroundColor: Colors.white,
|
backgroundColor: Colors.green[700],
|
||||||
foregroundColor: Colors.black,
|
foregroundColor: Colors.white,
|
||||||
elevation: 1,
|
elevation: 2,
|
||||||
),
|
),
|
||||||
body: notifications.isEmpty
|
body: notifications.isEmpty
|
||||||
? const Center(
|
? const Center(
|
||||||
|
@ -37,22 +76,53 @@ class NotificationScreen extends StatelessWidget {
|
||||||
style: TextStyle(fontSize: 16, color: Colors.grey),
|
style: TextStyle(fontSize: 16, color: Colors.grey),
|
||||||
),
|
),
|
||||||
)
|
)
|
||||||
: ListView.separated(
|
: ListView.builder(
|
||||||
itemCount: notifications.length,
|
|
||||||
padding: const EdgeInsets.all(16),
|
padding: const EdgeInsets.all(16),
|
||||||
separatorBuilder: (context, index) => const Divider(),
|
itemCount: notifications.length,
|
||||||
itemBuilder: (context, index) {
|
itemBuilder: (context, index) {
|
||||||
final notif = notifications[index];
|
final notif = notifications[index];
|
||||||
return ListTile(
|
final type = notif["type"] ?? "info";
|
||||||
leading: const Icon(Icons.notifications, color: Colors.blue),
|
|
||||||
|
return Card(
|
||||||
|
color: _getColor(type),
|
||||||
|
margin: const EdgeInsets.only(bottom: 12),
|
||||||
|
shape: RoundedRectangleBorder(
|
||||||
|
borderRadius: BorderRadius.circular(16),
|
||||||
|
),
|
||||||
|
elevation: 3,
|
||||||
|
child: ListTile(
|
||||||
|
contentPadding: const EdgeInsets.symmetric(
|
||||||
|
horizontal: 16, vertical: 12),
|
||||||
|
leading: Icon(
|
||||||
|
_getIcon(type),
|
||||||
|
color: _getIconColor(type),
|
||||||
|
size: 32,
|
||||||
|
),
|
||||||
title: Text(
|
title: Text(
|
||||||
notif["title"]!,
|
notif["title"]!,
|
||||||
style: const TextStyle(fontWeight: FontWeight.bold),
|
style: const TextStyle(
|
||||||
|
fontWeight: FontWeight.bold,
|
||||||
|
fontSize: 16,
|
||||||
),
|
),
|
||||||
subtitle: Text(notif["message"]!),
|
),
|
||||||
trailing: Text(
|
subtitle: Column(
|
||||||
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
|
children: [
|
||||||
|
const SizedBox(height: 4),
|
||||||
|
Text(
|
||||||
|
notif["message"]!,
|
||||||
|
style: const TextStyle(fontSize: 14),
|
||||||
|
),
|
||||||
|
const SizedBox(height: 6),
|
||||||
|
Text(
|
||||||
notif["time"]!,
|
notif["time"]!,
|
||||||
style: const TextStyle(fontSize: 12, color: Colors.grey),
|
style: const TextStyle(
|
||||||
|
fontSize: 12,
|
||||||
|
color: Colors.black54,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
|
|
|
@ -1,4 +1,6 @@
|
||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
|
import '../../widgets/costum_header.dart';
|
||||||
|
import '../../screens/notification/notification_screen.dart';
|
||||||
|
|
||||||
class SettingScreen extends StatelessWidget {
|
class SettingScreen extends StatelessWidget {
|
||||||
const SettingScreen({super.key});
|
const SettingScreen({super.key});
|
||||||
|
@ -7,74 +9,61 @@ class SettingScreen extends StatelessWidget {
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
return Scaffold(
|
return Scaffold(
|
||||||
backgroundColor: Colors.grey[100],
|
backgroundColor: Colors.grey[100],
|
||||||
body: ListView(
|
appBar: CustomHeader(
|
||||||
padding: const EdgeInsets.all(16),
|
deviceName: 'HamaGuard',
|
||||||
children: [
|
notificationCount: 5,
|
||||||
const Text(
|
onNotificationTap: () {
|
||||||
'Pengaturan',
|
Navigator.push(
|
||||||
style: TextStyle(fontSize: 24, fontWeight: FontWeight.bold),
|
context,
|
||||||
|
MaterialPageRoute(
|
||||||
|
builder: (context) => NotificationScreen(),
|
||||||
),
|
),
|
||||||
const SizedBox(height: 20),
|
|
||||||
|
|
||||||
// Contoh opsi 1: Ganti mode manual/otomatis
|
|
||||||
ListTile(
|
|
||||||
leading: const Icon(Icons.toggle_on),
|
|
||||||
title: const Text('Mode Manual/Otomatis'),
|
|
||||||
trailing: Switch(
|
|
||||||
value: true, // sementara default ON, nanti bisa dihubungkan state nyata
|
|
||||||
onChanged: (val) {
|
|
||||||
},
|
|
||||||
),
|
|
||||||
),
|
|
||||||
|
|
||||||
const Divider(),
|
|
||||||
|
|
||||||
// Contoh opsi 2: Notifikasi aktif/nonaktif
|
|
||||||
ListTile(
|
|
||||||
leading: const Icon(Icons.notifications),
|
|
||||||
title: const Text('Notifikasi'),
|
|
||||||
trailing: Switch(
|
|
||||||
value: true,
|
|
||||||
onChanged: (val) {
|
|
||||||
|
|
||||||
},
|
|
||||||
),
|
|
||||||
),
|
|
||||||
|
|
||||||
const Divider(),
|
|
||||||
|
|
||||||
// Contoh opsi 3: Reset data (tombol)
|
|
||||||
ListTile(
|
|
||||||
leading: const Icon(Icons.refresh),
|
|
||||||
title: const Text('Reset Data'),
|
|
||||||
onTap: () {
|
|
||||||
ScaffoldMessenger.of(context).showSnackBar(
|
|
||||||
const SnackBar(content: Text('Data direset')),
|
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
),
|
),
|
||||||
|
body: ListView(
|
||||||
const Divider(),
|
padding: const EdgeInsets.all(16),
|
||||||
|
children: [
|
||||||
// Contoh opsi 4: Tentang aplikasi
|
Card(
|
||||||
ListTile(
|
shape:
|
||||||
|
RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
|
||||||
|
elevation: 2,
|
||||||
|
child: SwitchListTile(
|
||||||
|
contentPadding: const EdgeInsets.symmetric(horizontal: 16),
|
||||||
|
secondary: const Icon(Icons.notifications_active_outlined),
|
||||||
|
title: const Text('Notifikasi'),
|
||||||
|
value: true,
|
||||||
|
onChanged: (val) {
|
||||||
|
// Tambahkan logika notifikasi di sini jika dibutuhkan
|
||||||
|
},
|
||||||
|
),
|
||||||
|
),
|
||||||
|
const SizedBox(height: 16),
|
||||||
|
Card(
|
||||||
|
shape:
|
||||||
|
RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
|
||||||
|
elevation: 2,
|
||||||
|
child: ListTile(
|
||||||
leading: const Icon(Icons.info_outline),
|
leading: const Icon(Icons.info_outline),
|
||||||
title: const Text('Tentang'),
|
title: const Text('Tentang Aplikasi'),
|
||||||
subtitle: const Text('Versi 1.0.0\nDibuat oleh Tim HamaGuard'),
|
subtitle: const Text('Versi 1.0.0'),
|
||||||
isThreeLine: true,
|
|
||||||
onTap: () {
|
onTap: () {
|
||||||
// Bisa tampilkan dialog info lebih lengkap
|
|
||||||
showAboutDialog(
|
showAboutDialog(
|
||||||
context: context,
|
context: context,
|
||||||
applicationName: 'HamaGuard',
|
applicationName: 'HamaGuard',
|
||||||
applicationVersion: '1.0.0',
|
applicationVersion: '1.0.0',
|
||||||
applicationIcon: const Icon(Icons.bug_report, size: 40),
|
applicationIcon: const Icon(Icons.bug_report, size: 40),
|
||||||
children: const [
|
children: const [
|
||||||
Text('Aplikasi pendeteksi dan pengusir hama otomatis.'),
|
Padding(
|
||||||
|
padding: EdgeInsets.only(top: 12),
|
||||||
|
child: Text(
|
||||||
|
'Aplikasi monitoring dan pengusir hama otomatis berbasis sensor.'),
|
||||||
|
),
|
||||||
],
|
],
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
),
|
),
|
||||||
|
),
|
||||||
],
|
],
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
|
|
|
@ -4,7 +4,7 @@ import 'package:intl/intl.dart';
|
||||||
class CustomHeader extends StatefulWidget implements PreferredSizeWidget {
|
class CustomHeader extends StatefulWidget implements PreferredSizeWidget {
|
||||||
final String deviceName;
|
final String deviceName;
|
||||||
final VoidCallback? onNotificationTap;
|
final VoidCallback? onNotificationTap;
|
||||||
final int notificationCount; // Tambahan
|
final int notificationCount;
|
||||||
|
|
||||||
const CustomHeader({
|
const CustomHeader({
|
||||||
super.key,
|
super.key,
|
||||||
|
@ -14,7 +14,8 @@ class CustomHeader extends StatefulWidget implements PreferredSizeWidget {
|
||||||
});
|
});
|
||||||
|
|
||||||
@override
|
@override
|
||||||
Size get preferredSize => const Size.fromHeight(kToolbarHeight + 24);
|
Size get preferredSize =>
|
||||||
|
const Size.fromHeight(100); // Disesuaikan agar tidak overflow
|
||||||
|
|
||||||
@override
|
@override
|
||||||
State<CustomHeader> createState() => _CustomHeaderState();
|
State<CustomHeader> createState() => _CustomHeaderState();
|
||||||
|
@ -49,27 +50,31 @@ class _CustomHeaderState extends State<CustomHeader> {
|
||||||
|
|
||||||
@override
|
@override
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
return AppBar(
|
return ClipRRect(
|
||||||
backgroundColor: Colors.transparent,
|
borderRadius: const BorderRadius.only(
|
||||||
elevation: 0,
|
bottomLeft: Radius.circular(24),
|
||||||
automaticallyImplyLeading: false,
|
bottomRight: Radius.circular(24),
|
||||||
titleSpacing: 16,
|
),
|
||||||
title: Row(
|
child: Container(
|
||||||
|
color: Colors.green[700],
|
||||||
|
padding:
|
||||||
|
const EdgeInsets.only(top: 16, left: 16, right: 16, bottom: 16),
|
||||||
|
child: SafeArea(
|
||||||
|
bottom: false,
|
||||||
|
child: Row(
|
||||||
crossAxisAlignment: CrossAxisAlignment.center,
|
crossAxisAlignment: CrossAxisAlignment.center,
|
||||||
children: [
|
children: [
|
||||||
// Nama alat dan tanggal
|
// Nama alat dan tanggal
|
||||||
Padding(
|
Column(
|
||||||
padding: const EdgeInsets.only(right: 8.0),
|
|
||||||
child: Column(
|
|
||||||
crossAxisAlignment: CrossAxisAlignment.start,
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
mainAxisSize: MainAxisSize.min,
|
mainAxisSize: MainAxisSize.min,
|
||||||
children: [
|
children: [
|
||||||
Text(
|
Text(
|
||||||
widget.deviceName,
|
widget.deviceName,
|
||||||
style: const TextStyle(
|
style: const TextStyle(
|
||||||
fontSize: 18,
|
fontSize: 20,
|
||||||
fontWeight: FontWeight.w600,
|
fontWeight: FontWeight.w600,
|
||||||
color: Color.fromRGBO(56, 142, 60, 1),
|
color: Colors.white,
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
const SizedBox(height: 4),
|
const SizedBox(height: 4),
|
||||||
|
@ -77,28 +82,25 @@ class _CustomHeaderState extends State<CustomHeader> {
|
||||||
_dateString,
|
_dateString,
|
||||||
style: TextStyle(
|
style: TextStyle(
|
||||||
fontSize: 12,
|
fontSize: 12,
|
||||||
color: Colors.grey[600],
|
color: Colors.white70,
|
||||||
height: 1.2,
|
height: 1.2,
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
],
|
],
|
||||||
),
|
),
|
||||||
),
|
|
||||||
const Spacer(),
|
const Spacer(),
|
||||||
|
|
||||||
// Icon lonceng + badge notifikasi
|
// Icon notifikasi
|
||||||
Padding(
|
Stack(
|
||||||
padding: const EdgeInsets.only(left: 8.0),
|
|
||||||
child: Material(
|
|
||||||
color: const Color.fromARGB(255, 219, 230, 221),
|
|
||||||
shape: const CircleBorder(),
|
|
||||||
child: Stack(
|
|
||||||
clipBehavior: Clip.none,
|
clipBehavior: Clip.none,
|
||||||
children: [
|
children: [
|
||||||
IconButton(
|
Material(
|
||||||
|
color: Colors.green[600],
|
||||||
|
shape: const CircleBorder(),
|
||||||
|
child: IconButton(
|
||||||
padding: const EdgeInsets.all(8),
|
padding: const EdgeInsets.all(8),
|
||||||
icon: const Icon(Icons.notifications_none,
|
icon: const Icon(Icons.notifications_none,
|
||||||
color: Color.fromARGB(221, 57, 35, 35), size: 28),
|
color: Colors.white, size: 28),
|
||||||
onPressed: widget.onNotificationTap ??
|
onPressed: widget.onNotificationTap ??
|
||||||
() {
|
() {
|
||||||
ScaffoldMessenger.of(context).showSnackBar(
|
ScaffoldMessenger.of(context).showSnackBar(
|
||||||
|
@ -108,8 +110,7 @@ class _CustomHeaderState extends State<CustomHeader> {
|
||||||
},
|
},
|
||||||
splashRadius: 24,
|
splashRadius: 24,
|
||||||
),
|
),
|
||||||
|
),
|
||||||
// Badge jika notificationCount > 0
|
|
||||||
if (widget.notificationCount > 0)
|
if (widget.notificationCount > 0)
|
||||||
Positioned(
|
Positioned(
|
||||||
right: 4,
|
right: 4,
|
||||||
|
@ -136,10 +137,10 @@ class _CustomHeaderState extends State<CustomHeader> {
|
||||||
),
|
),
|
||||||
],
|
],
|
||||||
),
|
),
|
||||||
),
|
|
||||||
),
|
|
||||||
],
|
],
|
||||||
),
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -14,12 +14,12 @@ class ThermalHeatmap extends StatelessWidget {
|
||||||
decoration: BoxDecoration(
|
decoration: BoxDecoration(
|
||||||
borderRadius: BorderRadius.circular(18),
|
borderRadius: BorderRadius.circular(18),
|
||||||
border: Border.all(
|
border: Border.all(
|
||||||
color: Colors.deepOrangeAccent.withOpacity(0.6),
|
color: const Color.fromRGBO(56, 142, 60, 1).withOpacity(0.6),
|
||||||
width: 3,
|
width: 3,
|
||||||
),
|
),
|
||||||
boxShadow: [
|
boxShadow: [
|
||||||
BoxShadow(
|
BoxShadow(
|
||||||
color: Colors.deepOrangeAccent.withOpacity(0.15),
|
color: const Color.fromRGBO(56, 142, 60, 1).withOpacity(0.15),
|
||||||
blurRadius: 8,
|
blurRadius: 8,
|
||||||
spreadRadius: 1,
|
spreadRadius: 1,
|
||||||
offset: Offset(0, 3),
|
offset: Offset(0, 3),
|
||||||
|
|
Loading…
Reference in New Issue