From 86742a6746952796150770f543413f350dcd3696 Mon Sep 17 00:00:00 2001
From: AYM1607 <u.g.a.mariano@gmail.com>
Date: Wed, 24 Apr 2019 16:23:54 -0500
Subject: [PATCH] Preliminary code for the event list tile, layout and title

---
 lib/src/mixins/tile_mixin.dart       | 13 +++++++++
 lib/src/screens/events_screen.dart   | 20 +++++++++++++
 lib/src/utils.dart                   | 13 +++++++++
 lib/src/widgets/event_list_tile.dart | 42 ++++++++++++++++++++++++++++
 lib/src/widgets/task_list_tile.dart  | 25 +++--------------
 5 files changed, 92 insertions(+), 21 deletions(-)
 create mode 100644 lib/src/mixins/tile_mixin.dart

diff --git a/lib/src/mixins/tile_mixin.dart b/lib/src/mixins/tile_mixin.dart
new file mode 100644
index 0000000..54506c6
--- /dev/null
+++ b/lib/src/mixins/tile_mixin.dart
@@ -0,0 +1,13 @@
+import 'package:flutter/material.dart';
+
+mixin Tile {
+  BoxDecoration tileDecoration(BuildContext context) {
+    return BoxDecoration(
+      color: Theme.of(context).cardColor,
+      borderRadius: BorderRadius.only(
+        topRight: Radius.circular(8),
+        bottomRight: Radius.circular(8),
+      ),
+    );
+  }
+}
diff --git a/lib/src/screens/events_screen.dart b/lib/src/screens/events_screen.dart
index 8715322..b5f7b53 100644
--- a/lib/src/screens/events_screen.dart
+++ b/lib/src/screens/events_screen.dart
@@ -1,7 +1,9 @@
 import 'package:flutter/material.dart' hide AppBar;
 
 import '../blocs/events_bloc.dart';
+import '../models/event_model.dart';
 import '../widgets/app_bar.dart';
+import '../widgets/event_list_tile.dart';
 import '../widgets/populated_drawer.dart';
 
 class EventsScreen extends StatefulWidget {
@@ -24,6 +26,7 @@ class _EventsScreenState extends State<EventsScreen> {
           userDisplayName = userSnap.data.displayName;
           userEmail = userSnap.data.email;
         }
+
         return Scaffold(
           drawer: PopulatedDrawer(
             userAvatarUrl: userAvatarUrl,
@@ -35,6 +38,23 @@ class _EventsScreenState extends State<EventsScreen> {
             title: 'My Events',
             hasDrawer: true,
           ),
+          body: ListView(
+            padding: EdgeInsets.only(top: 15),
+            children: <Widget>[
+              EventListTile(
+                event: EventModel(
+                  id: '1',
+                  name: 'Math',
+                  pendigTasks: 3,
+                  media: <String>[],
+                  when: <bool>[],
+                  highPriority: 2,
+                  mediumPriority: 1,
+                  lowPriority: 0,
+                ),
+              )
+            ],
+          ),
         );
       },
     );
diff --git a/lib/src/utils.dart b/lib/src/utils.dart
index 59b4c6f..5b52ca1 100644
--- a/lib/src/utils.dart
+++ b/lib/src/utils.dart
@@ -20,6 +20,19 @@ const kSmallTextStyle = TextStyle(
   fontSize: 16,
   fontWeight: FontWeight.w500,
 );
+
+const kTileBigTextStyle = TextStyle(
+  color: Colors.white,
+  fontSize: 24,
+  fontWeight: FontWeight.bold,
+);
+
+const kTileSubtitleStyle = TextStyle(
+  color: Colors.white,
+  fontSize: 10,
+  fontWeight: FontWeight.w300,
+);
+
 const kBlueGradient = LinearGradient(
   begin: Alignment.topLeft,
   end: Alignment.bottomRight,
diff --git a/lib/src/widgets/event_list_tile.dart b/lib/src/widgets/event_list_tile.dart
index e69de29..907718a 100644
--- a/lib/src/widgets/event_list_tile.dart
+++ b/lib/src/widgets/event_list_tile.dart
@@ -0,0 +1,42 @@
+import 'package:flutter/material.dart';
+
+import '../models/event_model.dart';
+import '../mixins/tile_mixin.dart';
+import '../utils.dart';
+
+class EventListTile extends StatelessWidget with Tile {
+  final EventModel event;
+
+  EventListTile({@required this.event}) : assert(event != null);
+
+  Widget build(BuildContext context) {
+    return FractionallySizedBox(
+      alignment: Alignment.centerLeft,
+      widthFactor: .95,
+      child: Container(
+        height: 85,
+        child: Stack(
+          children: <Widget>[
+            Container(
+              padding: EdgeInsets.all(8),
+              child: Row(
+                children: <Widget>[
+                  Column(
+                    children: <Widget>[
+                      Text(
+                        event.name,
+                        style: kTileBigTextStyle,
+                      ),
+                    ],
+                  ),
+                  Column(),
+                ],
+              ),
+            ),
+          ],
+        ),
+        decoration: tileDecoration(context),
+      ),
+    );
+  }
+}
diff --git a/lib/src/widgets/task_list_tile.dart b/lib/src/widgets/task_list_tile.dart
index 8803b65..262af63 100644
--- a/lib/src/widgets/task_list_tile.dart
+++ b/lib/src/widgets/task_list_tile.dart
@@ -1,12 +1,13 @@
 import 'package:flutter/material.dart';
 import 'package:font_awesome_flutter/font_awesome_flutter.dart';
 
+import '../mixins/tile_mixin.dart';
 import '../models/task_model.dart';
 import '../utils.dart';
 import '../widgets/action_button.dart';
 
 /// A card that visually represents a task.
-class TaskListTile extends StatelessWidget {
+class TaskListTile extends StatelessWidget with Tile {
   /// Task model which this card represents.
   final TaskModel task;
 
@@ -79,19 +80,11 @@ class TaskListTile extends StatelessWidget {
           ),
           Text(
             task.event,
-            style: TextStyle(
-              color: Colors.white,
-              fontSize: 24,
-              fontWeight: FontWeight.bold,
-            ),
+            style: kTileBigTextStyle,
           ),
           Text(
             task.text,
-            style: TextStyle(
-              color: Colors.white,
-              fontSize: 10,
-              fontWeight: FontWeight.w300,
-            ),
+            style: kTileSubtitleStyle,
           ),
         ],
       ),
@@ -169,14 +162,4 @@ class TaskListTile extends StatelessWidget {
       ),
     );
   }
-
-  BoxDecoration tileDecoration(BuildContext context) {
-    return BoxDecoration(
-      color: Theme.of(context).cardColor,
-      borderRadius: BorderRadius.only(
-        topRight: Radius.circular(8),
-        bottomRight: Radius.circular(8),
-      ),
-    );
-  }
 }