Merge branch '43-ausklappbares-listitem' into 'main'

Resolve "Ausklappbares ListItem"

Closes #43

See merge request Crondung/hsma_cpd!33

lib/models/mood.dart

@@ -9,6 +9,7 @@ class Mood implements DatabaseRecord {
 
   DateTime get date => _date;
   int get moodValue => _moodValue;
+  String get comment => _comment;
 
   @override
   factory Mood.fromDatabase(Map<String, dynamic> map) {

lib/models/relapse.dart

@@ -9,6 +9,7 @@ class Relapse implements DatabaseRecord {
 
   String get category => _category;
   DateTime get date => _date;
+  String get comment => _comment;
 
   @override
   factory Relapse.fromDatabase(Map<String, dynamic> map) {

lib/models/sleep.dart

@@ -13,6 +13,7 @@ class Sleep implements DatabaseRecord {
       this._wokeUpAt);
 
   DateTime get date => _date;
+  String get comment => _comment;
   int get sleepQualitiyValue => _sleepQualityValue;
   TimeOfDay get sleepDuration => _sleptAt.durationBetween(_wokeUpAt);
 

lib/widgets/buttons/round_button_widget.dart

@@ -1,10 +1,10 @@
 import 'package:flutter/material.dart';
 
-class RoundButton extends StatelessWidget {
+class RoundIconButton extends StatelessWidget {
   final VoidCallback onPressed;
   final IconData iconData;
 
-  const RoundButton(
+  const RoundIconButton(
       {super.key, required this.onPressed, required this.iconData});
 
   @override

lib/widgets/buttons/submit_form_button.dart

@@ -2,6 +2,7 @@ import 'package:awesome_dialog/awesome_dialog.dart';
 import 'package:flutter/material.dart';
 import 'package:provider/provider.dart';
 import 'package:smoke_cess_app/providers/page_provider.dart';
+import 'package:smoke_cess_app/widgets/buttons/round_button_widget.dart';
 
 class SubmitFormButton extends StatelessWidget {
   final Future<int> Function() submitCallback;
@@ -14,7 +15,7 @@ class SubmitFormButton extends StatelessWidget {
     PageProvider pageProvider = context.watch<PageProvider>();
     return Padding(
       padding: const EdgeInsets.symmetric(vertical: 16.0),
-      child: ElevatedButton(
+      child: RoundIconButton(
         onPressed: () async {
           int success = await submitCallback();
           if (context.mounted) {
@@ -37,7 +38,7 @@ class SubmitFormButton extends StatelessWidget {
             }
           }
         },
-        child: const Text('Speichern'),
+        iconData: Icons.check_outlined,
       ),
     );
   }

lib/widgets/entry_detail_title.dart

@@ -0,0 +1,33 @@
+import 'package:flutter/material.dart';
+import 'package:intl/intl.dart';
+
+class EntryDetailTitle extends StatelessWidget {
+  final DateTime date;
+  final String entryData;
+
+  const EntryDetailTitle(
+      {super.key, required this.date, required this.entryData});
+
+  @override
+  Widget build(BuildContext context) {
+    return Row(
+      mainAxisAlignment: MainAxisAlignment.start,
+      children: [
+        Text(
+          DateFormat.MMMd('de').format(date),
+          style:
+              const TextStyle(color: Colors.white, fontWeight: FontWeight.bold),
+        ),
+        Flexible(
+            child: Container(
+                padding: const EdgeInsets.symmetric(horizontal: 5.0),
+                child: Text(
+                  entryData,
+                  overflow: TextOverflow.ellipsis,
+                  style: const TextStyle(
+                      color: Colors.white, fontWeight: FontWeight.bold),
+                )))
+      ],
+    );
+  }
+}

lib/widgets/entry_detail_widget.dart

@@ -1,41 +1,58 @@
 import 'package:flutter/material.dart';
-import 'package:intl/intl.dart';
+import 'package:smoke_cess_app/widgets/entry_detail_title.dart';
 
 class EntryDetail extends StatelessWidget {
   final DateTime date;
   final String entryData;
-  final IconData icon;
+  final String? entryComment;
+  final IconData iconData;
 
   const EntryDetail(
       {super.key,
       required this.date,
       required this.entryData,
-      required this.icon});
+      required this.iconData,
+      required this.entryComment});
 
   @override
   Widget build(BuildContext context) {
-    return Card(
-        child: ListTile(
-      shape: RoundedRectangleBorder(
+    final Icon icon = Icon(iconData, color: Colors.white);
+    final ShapeBorder shape = RoundedRectangleBorder(
       borderRadius: BorderRadius.circular(10.0),
-      ),
-      leading: Icon(icon, color: Colors.white),
-      title: Row(
-        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
-        children: [
-          Text(
-            DateFormat.MMMd('de').format(date),
+    );
+    final Color color = Theme.of(context).colorScheme.primary.withOpacity(0.8);
+    final Widget title = EntryDetailTitle(date: date, entryData: entryData);
+    return entryComment != null
+        ? ExpansionTile(
+            iconColor: Colors.white,
+            collapsedIconColor: Colors.white,
+            collapsedShape: shape,
+            shape: shape,
+            leading: icon,
+            title: title,
+            collapsedBackgroundColor: color,
+            backgroundColor:
+                Theme.of(context).colorScheme.secondary.withOpacity(0.8),
+            children: entryComment != null
+                ? [
+                    Row(mainAxisAlignment: MainAxisAlignment.start, children: [
+                      Padding(
+                          padding: const EdgeInsets.fromLTRB(10, 0, 10, 10),
+                          child: Text(
+                            entryComment ?? '',
                             style: const TextStyle(
-                color: Colors.white, fontWeight: FontWeight.bold),
-          ),
-          Text(
-            entryData,
-            style: const TextStyle(
-                color: Colors.white, fontWeight: FontWeight.bold),
+                                color: Colors.white,
+                                fontWeight: FontWeight.bold),
+                          ))
+                    ])
+                  ]
+                : [],
           )
-        ],
-      ),
-      tileColor: Theme.of(context).colorScheme.primary.withOpacity(0.8),
-    ));
+        : ListTile(
+            shape: shape,
+            leading: icon,
+            title: title,
+            tileColor: color,
+          );
   }
 }

lib/widgets/history_list_widget.dart

@@ -6,6 +6,7 @@ class HistoryList<T> extends StatelessWidget {
   final DateTime Function(T) dateSelector;
   final String Function(T) entryDataSelector;
   final IconData Function(T)? iconDataSelector;
+  final String Function(T)? entryCommentSelector;
   final IconData? icon;
 
   const HistoryList(
@@ -14,7 +15,8 @@ class HistoryList<T> extends StatelessWidget {
       required this.dateSelector,
       required this.entryDataSelector,
       this.iconDataSelector,
-      this.icon});
+      this.icon,
+      this.entryCommentSelector});
 
   IconData _getIcon(T entry) {
     if (icon != null) {
@@ -25,15 +27,26 @@ class HistoryList<T> extends StatelessWidget {
     return Icons.circle;
   }
 
+  String? _getComment(T entry) {
+    if (entryCommentSelector != null) {
+      return entryCommentSelector!(entry);
+    }
+    return null;
+  }
+
   @override
   Widget build(BuildContext context) {
     return Expanded(
         child: ListView(
+            padding: const EdgeInsets.fromLTRB(10, 10, 10, 10),
             children: history.map((T entry) {
-      return EntryDetail(
+              return Padding(
+                  padding: const EdgeInsets.only(bottom: 5),
+                  child: EntryDetail(
                       date: dateSelector(entry),
                       entryData: entryDataSelector(entry),
-          icon: _getIcon(entry));
+                      entryComment: _getComment(entry),
+                      iconData: _getIcon(entry)));
             }).toList()));
   }
 }

lib/widgets/view_form/mood_form.dart

@@ -16,6 +16,7 @@ class MoodForm extends StatelessWidget {
     var inputModel = context.watch<InputProvider>();
     var tasksModel = context.watch<TasksProvider>();
     return ListView(
+      padding: const EdgeInsets.fromLTRB(10, 10, 10, 10),
       children: [
         const ElevatedCard(
           title: 'Stimmungsbewertung',
@@ -26,9 +27,6 @@ class MoodForm extends StatelessWidget {
           title: 'Beschreibe deine Stimmung',
           child: MyTextFormField('Beschreibe deine Stimmung'),
         ),
-        const SizedBox(
-          height: 80,
-        ),
         SubmitFormButton(
           submitCallback: inputModel.saveMood,
           updateTasks: () => tasksModel.setTaskDone(Pages.mood),

lib/widgets/view_form/mood_view.dart

@@ -25,6 +25,7 @@ class MoodView extends StatelessWidget {
           history: tasksModel.moodHistory,
           dateSelector: (Mood mood) => mood.date,
           entryDataSelector: (Mood mood) => 'Stimmung: ${mood.moodValue}',
+          entryCommentSelector: (Mood mood) => 'Kommentar: ${mood.comment}',
           iconDataSelector: (Mood mood) => mood.moodValue >= 50
               ? Icons.mood_outlined
               : Icons.mood_bad_outlined,

lib/widgets/view_form/relapse_form.dart

@@ -18,6 +18,7 @@ class RelapseForm extends StatelessWidget {
     var settingsModel = context.watch<SettingsProvider>();
     var tasksModel = context.watch<TasksProvider>();
     return ListView(
+      padding: const EdgeInsets.fromLTRB(10, 10, 10, 10),
       children: [
         ElevatedCard(
           title: 'Rückfallkategorie',
@@ -27,9 +28,6 @@ class RelapseForm extends StatelessWidget {
           title: 'Beschreibe deinen Rückfall',
           child: MyTextFormField('Beschreibe deinen Rückfall'),
         ),
-        const SizedBox(
-          height: 80,
-        ),
         SubmitFormButton(
           submitCallback: inputModel.saveRelapse,
           updateTasks: () => tasksModel.setTaskDone(Pages.mood),

lib/widgets/view_form/relapse_view.dart

@@ -10,11 +10,15 @@ class RelapseView extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     TasksProvider tasksModel = context.watch<TasksProvider>();
-    return HistoryList<Relapse>(
+    return Column(children: [
+      HistoryList<Relapse>(
         history: tasksModel.relapseHistory,
         dateSelector: (Relapse relapse) => relapse.date,
-      entryDataSelector: (Relapse relapse) => 'Grund: ${relapse.category}',
+        entryDataSelector: (Relapse relapse) => relapse.category,
+        entryCommentSelector: (Relapse relapse) =>
+            'Kommentar: ${relapse.comment}',
         icon: Icons.smoke_free_outlined,
-    );
+      )
+    ]);
   }
 }

lib/widgets/view_form/sleep_form.dart

@@ -19,6 +19,7 @@ class SleepForm extends StatelessWidget {
     TasksProvider tasksModel = context.watch<TasksProvider>();
 
     return ListView(
+      padding: const EdgeInsets.fromLTRB(10, 10, 10, 10),
       children: [
         const ElevatedCard(
           title: 'Einschlafzeit',
@@ -39,9 +40,6 @@ class SleepForm extends StatelessWidget {
           title: 'Schlafbeschreibung',
           child: MyTextFormField('Beschreibe deinen Schlaf'),
         ),
-        const SizedBox(
-          height: 80,
-        ),
         SubmitFormButton(
           submitCallback: () =>
               inputModel.saveSleep(SleepTimes.wokeUpAt, SleepTimes.sleptAt),

lib/widgets/view_form/sleep_view.dart

@@ -28,6 +28,7 @@ class SleepView extends StatelessWidget {
           dateSelector: (Sleep sleep) => sleep.date,
           entryDataSelector: (Sleep sleep) =>
               '${sleep.sleepDuration.hour}:${sleep.sleepDuration.minute}',
+          entryCommentSelector: (Sleep sleep) => 'Kommentar: ${sleep.comment}',
           icon: Icons.bedtime_outlined,
         )
       ],

lib/widgets/view_form/view_form_page.dart

@@ -32,7 +32,7 @@ class ViewFormPage extends StatelessWidget {
       if (!pageProvider.showForm)
         Container(
           margin: EdgeInsets.symmetric(vertical: height * 0.02),
-          child: RoundButton(
+          child: RoundIconButton(
             iconData: Icons.add_outlined,
             onPressed: tasksProvider.tasks[page] ?? true
                 ? () => pageProvider.swap()