feat: Murattal player enhancements & prayer schedule auto-scroll
- Murattal: Spotify-style 5-button controls [Shuffle, Prev, Play, Next, Playlist] - Murattal: Animated 7-bar equalizer visualization in player circle - Murattal: Unsplash API background with frosted glass player overlay - Murattal: Transparent AppBar with backdrop blur - Murattal: Surah playlist bottom sheet with full 114 Surah list - Murattal: Auto-play disabled on screen open, enabled on navigation - Murattal: Shuffle mode for random Surah playback - Murattal: Photographer attribution per Unsplash guidelines - Dashboard: Auto-scroll prayer schedule to next active prayer - Fix: setState lifecycle errors on Reading & Murattal screens - Setup: flutter_dotenv, cached_network_image, url_launcher deps
This commit is contained in:
dwindown
648
lib/features/checklist/presentation/checklist_screen.dart
Normal file
648
lib/features/checklist/presentation/checklist_screen.dart
Normal file
@@ -0,0 +1,648 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
||||
import 'package:hive_flutter/hive_flutter.dart';
|
||||
import 'package:go_router/go_router.dart';
|
||||
import 'package:intl/intl.dart';
|
||||
import '../../../app/theme/app_colors.dart';
|
||||
import '../../../core/widgets/progress_bar.dart';
|
||||
import '../../../data/local/hive_boxes.dart';
|
||||
import '../../../data/local/models/app_settings.dart';
|
||||
import '../../../data/local/models/daily_worship_log.dart';
|
||||
import '../../../data/local/models/shalat_log.dart';
|
||||
import '../../../data/local/models/tilawah_log.dart';
|
||||
import '../../../data/local/models/dzikir_log.dart';
|
||||
import '../../../data/local/models/puasa_log.dart';
|
||||
|
||||
class ChecklistScreen extends ConsumerStatefulWidget {
|
||||
const ChecklistScreen({super.key});
|
||||
|
||||
@override
|
||||
ConsumerState<ChecklistScreen> createState() => _ChecklistScreenState();
|
||||
}
|
||||
|
||||
class _ChecklistScreenState extends ConsumerState<ChecklistScreen> {
|
||||
late String _todayKey;
|
||||
late Box<DailyWorshipLog> _logBox;
|
||||
late Box<AppSettings> _settingsBox;
|
||||
late AppSettings _settings;
|
||||
|
||||
final List<String> _fardhuPrayers = ['Subuh', 'Dzuhur', 'Ashar', 'Maghrib', 'Isya'];
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
_todayKey = DateFormat('yyyy-MM-dd').format(DateTime.now());
|
||||
_logBox = Hive.box<DailyWorshipLog>(HiveBoxes.worshipLogs);
|
||||
_settingsBox = Hive.box<AppSettings>(HiveBoxes.settings);
|
||||
_settings = _settingsBox.get('default') ?? AppSettings();
|
||||
_ensureLogExists();
|
||||
}
|
||||
|
||||
void _ensureLogExists() {
|
||||
if (!_logBox.containsKey(_todayKey)) {
|
||||
final shalatLogs = <String, ShalatLog>{};
|
||||
for (final p in _fardhuPrayers) {
|
||||
shalatLogs[p.toLowerCase()] = ShalatLog();
|
||||
}
|
||||
|
||||
_logBox.put(
|
||||
_todayKey,
|
||||
DailyWorshipLog(
|
||||
date: _todayKey,
|
||||
shalatLogs: shalatLogs,
|
||||
tilawahLog: TilawahLog(
|
||||
targetValue: _settings.tilawahTargetValue,
|
||||
targetUnit: _settings.tilawahTargetUnit,
|
||||
autoSync: _settings.tilawahAutoSync,
|
||||
),
|
||||
dzikirLog: _settings.trackDzikir ? DzikirLog() : null,
|
||||
puasaLog: _settings.trackPuasa ? PuasaLog() : null,
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
DailyWorshipLog get _todayLog => _logBox.get(_todayKey)!;
|
||||
|
||||
void _recalculateProgress() {
|
||||
final log = _todayLog;
|
||||
|
||||
// Lazily attach Dzikir and Puasa if user toggles them mid-day
|
||||
if (_settings.trackDzikir && log.dzikirLog == null) log.dzikirLog = DzikirLog();
|
||||
if (_settings.trackPuasa && log.puasaLog == null) log.puasaLog = PuasaLog();
|
||||
|
||||
int total = 0;
|
||||
int completed = 0;
|
||||
|
||||
// Shalat
|
||||
for (final p in _fardhuPrayers) {
|
||||
final pKey = p.toLowerCase();
|
||||
final sLog = log.shalatLogs[pKey];
|
||||
if (sLog != null) {
|
||||
total++;
|
||||
if (sLog.completed) completed++;
|
||||
|
||||
if (hasQabliyah(pKey, _settings.rawatibLevel)) {
|
||||
total++;
|
||||
if (sLog.qabliyah == true) completed++;
|
||||
}
|
||||
if (hasBadiyah(pKey, _settings.rawatibLevel)) {
|
||||
total++;
|
||||
if (sLog.badiyah == true) completed++;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Tilawah
|
||||
if (log.tilawahLog != null) {
|
||||
total++;
|
||||
if (log.tilawahLog!.isCompleted) completed++;
|
||||
}
|
||||
|
||||
// Dzikir
|
||||
if (_settings.trackDzikir && log.dzikirLog != null) {
|
||||
total += 2;
|
||||
if (log.dzikirLog!.pagi) completed++;
|
||||
if (log.dzikirLog!.petang) completed++;
|
||||
}
|
||||
|
||||
// Puasa
|
||||
if (_settings.trackPuasa && log.puasaLog != null) {
|
||||
total++;
|
||||
if (log.puasaLog!.completed) completed++;
|
||||
}
|
||||
|
||||
log.totalItems = total;
|
||||
log.completedCount = completed;
|
||||
log.completionPercent = total > 0 ? completed / total : 0.0;
|
||||
log.save();
|
||||
setState(() {});
|
||||
}
|
||||
|
||||
bool hasQabliyah(String prayer, int level) {
|
||||
if (level == 0) return false;
|
||||
if (prayer == 'subuh') return true;
|
||||
if (prayer == 'dzuhur') return true;
|
||||
if (prayer == 'ashar') return level == 2; // Ghairu Muakkad
|
||||
if (prayer == 'maghrib') return level == 2; // Ghairu Muakkad
|
||||
if (prayer == 'isya') return level == 2; // Ghairu Muakkad
|
||||
return false;
|
||||
}
|
||||
|
||||
bool hasBadiyah(String prayer, int level) {
|
||||
if (level == 0) return false;
|
||||
if (prayer == 'subuh') return false;
|
||||
if (prayer == 'dzuhur') return true;
|
||||
if (prayer == 'ashar') return false;
|
||||
if (prayer == 'maghrib') return true;
|
||||
if (prayer == 'isya') return true;
|
||||
return false;
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final theme = Theme.of(context);
|
||||
final isDark = theme.brightness == Brightness.dark;
|
||||
final log = _todayLog;
|
||||
|
||||
return Scaffold(
|
||||
appBar: AppBar(
|
||||
title: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
const Text('Ibadah Harian'),
|
||||
Text(
|
||||
DateFormat('EEEE, d MMM yyyy').format(DateTime.now()),
|
||||
style: theme.textTheme.bodySmall?.copyWith(
|
||||
color: isDark ? AppColors.textSecondaryDark : AppColors.textSecondaryLight,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
centerTitle: false,
|
||||
actions: [
|
||||
IconButton(
|
||||
onPressed: () {},
|
||||
icon: const Icon(Icons.notifications_outlined),
|
||||
),
|
||||
IconButton(
|
||||
onPressed: () => context.push('/settings'),
|
||||
icon: const Icon(Icons.settings_outlined),
|
||||
),
|
||||
const SizedBox(width: 8),
|
||||
],
|
||||
),
|
||||
body: ListView(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16),
|
||||
children: [
|
||||
const SizedBox(height: 12),
|
||||
_buildProgressCard(log, isDark),
|
||||
const SizedBox(height: 24),
|
||||
_sectionLabel('SHOLAT FARDHU & RAWATIB'),
|
||||
const SizedBox(height: 12),
|
||||
..._fardhuPrayers.map((p) => _buildShalatCard(p, isDark)).toList(),
|
||||
const SizedBox(height: 24),
|
||||
_sectionLabel('TILAWAH AL-QURAN'),
|
||||
const SizedBox(height: 12),
|
||||
_buildTilawahCard(isDark),
|
||||
if (_settings.trackDzikir || _settings.trackPuasa) ...[
|
||||
const SizedBox(height: 24),
|
||||
_sectionLabel('AMALAN TAMBAHAN'),
|
||||
const SizedBox(height: 12),
|
||||
],
|
||||
if (_settings.trackDzikir) _buildDzikirCard(isDark),
|
||||
if (_settings.trackPuasa) _buildPuasaCard(isDark),
|
||||
const SizedBox(height: 32),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _sectionLabel(String text) {
|
||||
return Text(
|
||||
text,
|
||||
style: const TextStyle(
|
||||
fontSize: 11,
|
||||
fontWeight: FontWeight.w700,
|
||||
letterSpacing: 1.5,
|
||||
color: AppColors.sage,
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildProgressCard(DailyWorshipLog log, bool isDark) {
|
||||
final percent = log.completionPercent;
|
||||
final remaining = log.totalItems - log.completedCount;
|
||||
|
||||
return Container(
|
||||
padding: const EdgeInsets.all(20),
|
||||
decoration: BoxDecoration(
|
||||
color: isDark ? AppColors.surfaceDark : const Color(0xFF2B3441),
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: Colors.black.withValues(alpha: 0.1),
|
||||
blurRadius: 16,
|
||||
offset: const Offset(0, 8),
|
||||
),
|
||||
],
|
||||
),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Text(
|
||||
"POIN HARI INI",
|
||||
style: TextStyle(
|
||||
fontSize: 10,
|
||||
fontWeight: FontWeight.w700,
|
||||
letterSpacing: 1.5,
|
||||
color: AppColors.primary.withValues(alpha: 0.8),
|
||||
),
|
||||
),
|
||||
Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 4),
|
||||
decoration: BoxDecoration(
|
||||
color: AppColors.primary.withValues(alpha: 0.15),
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
const Icon(Icons.stars, color: AppColors.primary, size: 14),
|
||||
const SizedBox(width: 4),
|
||||
Text(
|
||||
'${log.totalPoints} pts',
|
||||
style: const TextStyle(
|
||||
fontSize: 13,
|
||||
fontWeight: FontWeight.w700,
|
||||
color: AppColors.primary,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.end,
|
||||
children: [
|
||||
Text(
|
||||
'${(percent * 100).round()}%',
|
||||
style: const TextStyle(
|
||||
fontSize: 42,
|
||||
fontWeight: FontWeight.w800,
|
||||
color: Colors.white,
|
||||
height: 1.1,
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 8),
|
||||
const Padding(
|
||||
padding: EdgeInsets.only(bottom: 8),
|
||||
child: Text(
|
||||
'Selesai',
|
||||
style: TextStyle(
|
||||
fontSize: 16,
|
||||
fontWeight: FontWeight.w400,
|
||||
color: Colors.white70,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
AppProgressBar(
|
||||
value: percent,
|
||||
height: 8,
|
||||
backgroundColor: Colors.white.withValues(alpha: 0.15),
|
||||
fillColor: AppColors.primary,
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
Text(
|
||||
remaining == 0 && log.totalItems > 0
|
||||
? 'MasyaAllah! Poin maksimal tercapai hari ini! 🎉'
|
||||
: 'Kumpulkan poin lebih banyak dengan Sholat di Masjid dan amalan sunnah lainnya!',
|
||||
style: TextStyle(
|
||||
fontSize: 13,
|
||||
color: Colors.white.withValues(alpha: 0.7),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildShalatCard(String prayerName, bool isDark) {
|
||||
final pKey = prayerName.toLowerCase();
|
||||
final log = _todayLog.shalatLogs[pKey];
|
||||
if (log == null) return const SizedBox.shrink();
|
||||
|
||||
final hasQab = hasQabliyah(pKey, _settings.rawatibLevel);
|
||||
final hasBad = hasBadiyah(pKey, _settings.rawatibLevel);
|
||||
final isCompleted = log.completed;
|
||||
|
||||
return Container(
|
||||
margin: const EdgeInsets.only(bottom: 12),
|
||||
decoration: BoxDecoration(
|
||||
color: isDark ? AppColors.surfaceDark : AppColors.surfaceLight,
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
border: Border.all(
|
||||
color: isCompleted
|
||||
? AppColors.primary.withValues(alpha: 0.3)
|
||||
: (isDark ? AppColors.primary.withValues(alpha: 0.08) : AppColors.cream),
|
||||
),
|
||||
),
|
||||
child: Theme(
|
||||
data: Theme.of(context).copyWith(dividerColor: Colors.transparent),
|
||||
child: ExpansionTile(
|
||||
tilePadding: const EdgeInsets.symmetric(horizontal: 16, vertical: 4),
|
||||
leading: Container(
|
||||
width: 44,
|
||||
height: 44,
|
||||
decoration: BoxDecoration(
|
||||
color: isCompleted
|
||||
? AppColors.primary.withValues(alpha: 0.15)
|
||||
: (isDark ? AppColors.primary.withValues(alpha: 0.08) : AppColors.cream.withValues(alpha: 0.5)),
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
),
|
||||
child: Icon(Icons.mosque, size: 22, color: isCompleted ? AppColors.primary : AppColors.sage),
|
||||
),
|
||||
title: Text(
|
||||
'Sholat $prayerName',
|
||||
style: TextStyle(
|
||||
fontWeight: FontWeight.w600,
|
||||
fontSize: 16,
|
||||
color: isCompleted && isDark ? AppColors.textSecondaryDark : null,
|
||||
decoration: isCompleted ? TextDecoration.lineThrough : null,
|
||||
),
|
||||
),
|
||||
subtitle: log.location != null
|
||||
? Text('Di ${log.location}', style: const TextStyle(fontSize: 12, color: AppColors.primary))
|
||||
: null,
|
||||
trailing: _CustomCheckbox(
|
||||
value: isCompleted,
|
||||
onChanged: (v) {
|
||||
log.completed = v ?? false;
|
||||
_recalculateProgress();
|
||||
},
|
||||
),
|
||||
childrenPadding: const EdgeInsets.only(left: 16, right: 16, bottom: 16),
|
||||
children: [
|
||||
const Divider(),
|
||||
const SizedBox(height: 8),
|
||||
// Location Radio
|
||||
Row(
|
||||
children: [
|
||||
const Text('Pelaksanaan:', style: TextStyle(fontSize: 13, fontWeight: FontWeight.w600)),
|
||||
const SizedBox(width: 16),
|
||||
_radioOption('Masjid', log, () {
|
||||
log.location = 'Masjid';
|
||||
log.completed = true; // Auto-check parent
|
||||
_recalculateProgress();
|
||||
}),
|
||||
const SizedBox(width: 16),
|
||||
_radioOption('Rumah', log, () {
|
||||
log.location = 'Rumah';
|
||||
log.completed = true; // Auto-check parent
|
||||
_recalculateProgress();
|
||||
}),
|
||||
],
|
||||
),
|
||||
if (hasQab || hasBad) const SizedBox(height: 12),
|
||||
if (hasQab)
|
||||
_sunnahRow('Qabliyah $prayerName', log.qabliyah ?? false, (v) {
|
||||
log.qabliyah = v;
|
||||
_recalculateProgress();
|
||||
}),
|
||||
if (hasBad)
|
||||
_sunnahRow('Ba\'diyah $prayerName', log.badiyah ?? false, (v) {
|
||||
log.badiyah = v;
|
||||
_recalculateProgress();
|
||||
}),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _radioOption(String title, ShalatLog log, VoidCallback onTap) {
|
||||
final selected = log.location == title;
|
||||
return GestureDetector(
|
||||
onTap: onTap,
|
||||
child: Row(
|
||||
children: [
|
||||
Icon(
|
||||
selected ? Icons.radio_button_checked : Icons.radio_button_off,
|
||||
size: 18,
|
||||
color: selected ? AppColors.primary : Colors.grey,
|
||||
),
|
||||
const SizedBox(width: 4),
|
||||
Text(title, style: TextStyle(fontSize: 13, color: selected ? AppColors.primary : null)),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _sunnahRow(String title, bool value, ValueChanged<bool?> onChanged) {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.only(top: 8.0),
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Text(title, style: const TextStyle(fontSize: 14)),
|
||||
_CustomCheckbox(value: value, onChanged: onChanged),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildTilawahCard(bool isDark) {
|
||||
final log = _todayLog.tilawahLog;
|
||||
if (log == null) return const SizedBox.shrink();
|
||||
|
||||
return Container(
|
||||
padding: const EdgeInsets.all(16),
|
||||
decoration: BoxDecoration(
|
||||
color: isDark ? AppColors.surfaceDark : AppColors.surfaceLight,
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
border: Border.all(
|
||||
color: log.isCompleted
|
||||
? AppColors.primary.withValues(alpha: 0.3)
|
||||
: (isDark ? AppColors.primary.withValues(alpha: 0.08) : AppColors.cream),
|
||||
),
|
||||
),
|
||||
child: Column(
|
||||
children: [
|
||||
// ── Row 1: Target + Checkbox ──
|
||||
Row(
|
||||
children: [
|
||||
Container(
|
||||
width: 44,
|
||||
height: 44,
|
||||
decoration: BoxDecoration(
|
||||
color: log.isCompleted
|
||||
? AppColors.primary.withValues(alpha: 0.15)
|
||||
: (isDark ? AppColors.primary.withValues(alpha: 0.08) : AppColors.cream.withValues(alpha: 0.5)),
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
),
|
||||
child: Icon(Icons.menu_book, size: 22, color: log.isCompleted ? AppColors.primary : AppColors.sage),
|
||||
),
|
||||
const SizedBox(width: 14),
|
||||
Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
'Tilawah',
|
||||
style: TextStyle(
|
||||
fontSize: 16,
|
||||
fontWeight: FontWeight.w600,
|
||||
color: log.isCompleted && isDark ? AppColors.textSecondaryDark : null,
|
||||
decoration: log.isCompleted ? TextDecoration.lineThrough : null,
|
||||
),
|
||||
),
|
||||
Text(
|
||||
'Target: ${log.targetValue} ${log.targetUnit}',
|
||||
style: const TextStyle(fontSize: 12, color: AppColors.primary),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
_CustomCheckbox(
|
||||
value: log.targetCompleted,
|
||||
onChanged: (v) {
|
||||
log.targetCompleted = v ?? false;
|
||||
_recalculateProgress();
|
||||
},
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
const Divider(height: 1),
|
||||
const SizedBox(height: 12),
|
||||
// ── Row 2: Ayat Tracker ──
|
||||
Row(
|
||||
children: [
|
||||
Icon(Icons.auto_stories, size: 18, color: AppColors.sage),
|
||||
const SizedBox(width: 8),
|
||||
Expanded(
|
||||
child: Text(
|
||||
'Sudah Baca: ${log.rawAyatRead} Ayat',
|
||||
style: TextStyle(
|
||||
fontSize: 13,
|
||||
fontWeight: FontWeight.w600,
|
||||
color: isDark ? AppColors.textSecondaryDark : AppColors.textSecondaryLight,
|
||||
),
|
||||
),
|
||||
),
|
||||
if (log.autoSync)
|
||||
Tooltip(
|
||||
message: 'Sinkron dari Al-Quran',
|
||||
child: Icon(Icons.sync, size: 16, color: AppColors.primary),
|
||||
),
|
||||
IconButton(
|
||||
icon: const Icon(Icons.remove_circle_outline, size: 20),
|
||||
visualDensity: VisualDensity.compact,
|
||||
onPressed: log.rawAyatRead > 0
|
||||
? () {
|
||||
log.rawAyatRead--;
|
||||
_recalculateProgress();
|
||||
}
|
||||
: null,
|
||||
),
|
||||
IconButton(
|
||||
icon: const Icon(Icons.add_circle_outline, size: 20, color: AppColors.primary),
|
||||
visualDensity: VisualDensity.compact,
|
||||
onPressed: () {
|
||||
log.rawAyatRead++;
|
||||
_recalculateProgress();
|
||||
},
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildDzikirCard(bool isDark) {
|
||||
final log = _todayLog.dzikirLog;
|
||||
if (log == null) return const SizedBox.shrink();
|
||||
|
||||
return Container(
|
||||
margin: const EdgeInsets.only(bottom: 12),
|
||||
padding: const EdgeInsets.all(16),
|
||||
decoration: BoxDecoration(
|
||||
color: isDark ? AppColors.surfaceDark : AppColors.surfaceLight,
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Row(
|
||||
children: [
|
||||
Icon(Icons.auto_awesome, size: 20, color: AppColors.sage),
|
||||
const SizedBox(width: 8),
|
||||
const Text('Dzikir Harian', style: TextStyle(fontWeight: FontWeight.w600, fontSize: 15)),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
_sunnahRow('Dzikir Pagi', log.pagi, (v) {
|
||||
log.pagi = v ?? false;
|
||||
_recalculateProgress();
|
||||
}),
|
||||
_sunnahRow('Dzikir Petang', log.petang, (v) {
|
||||
log.petang = v ?? false;
|
||||
_recalculateProgress();
|
||||
}),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildPuasaCard(bool isDark) {
|
||||
final log = _todayLog.puasaLog;
|
||||
if (log == null) return const SizedBox.shrink();
|
||||
|
||||
return Container(
|
||||
padding: const EdgeInsets.all(16),
|
||||
decoration: BoxDecoration(
|
||||
color: isDark ? AppColors.surfaceDark : AppColors.surfaceLight,
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
const Icon(Icons.nightlight_round, size: 20, color: AppColors.sage),
|
||||
const SizedBox(width: 8),
|
||||
const Expanded(child: Text('Puasa Sunnah', style: TextStyle(fontWeight: FontWeight.w600, fontSize: 15))),
|
||||
DropdownButton<String>(
|
||||
value: log.jenisPuasa,
|
||||
hint: const Text('Jenis', style: TextStyle(fontSize: 12)),
|
||||
underline: const SizedBox(),
|
||||
items: ['Senin', 'Kamis', 'Ayyamul Bidh', 'Daud', 'Lainnya']
|
||||
.map((e) => DropdownMenuItem(value: e, child: Text(e, style: const TextStyle(fontSize: 13))))
|
||||
.toList(),
|
||||
onChanged: (v) {
|
||||
log.jenisPuasa = v;
|
||||
_recalculateProgress();
|
||||
},
|
||||
),
|
||||
const SizedBox(width: 8),
|
||||
_CustomCheckbox(
|
||||
value: log.completed,
|
||||
onChanged: (v) {
|
||||
log.completed = v ?? false;
|
||||
_recalculateProgress();
|
||||
},
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _CustomCheckbox extends StatelessWidget {
|
||||
final bool value;
|
||||
final ValueChanged<bool?> onChanged;
|
||||
|
||||
const _CustomCheckbox({required this.value, required this.onChanged});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return GestureDetector(
|
||||
onTap: () => onChanged(!value),
|
||||
child: Container(
|
||||
width: 24,
|
||||
height: 24,
|
||||
decoration: BoxDecoration(
|
||||
color: value ? AppColors.primary : Colors.transparent,
|
||||
borderRadius: BorderRadius.circular(6),
|
||||
border: value ? null : Border.all(color: Colors.grey, width: 2),
|
||||
),
|
||||
child: value ? const Icon(Icons.check, size: 16, color: Colors.white) : null,
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user