From 2b1ac6d48ccc73af5f110187dd8659b2e809546e Mon Sep 17 00:00:00 2001 From: AYM1607 Date: Fri, 26 Apr 2019 20:58:04 -0500 Subject: [PATCH] Finished the event list tile --- lib/src/mixins/tile_mixin.dart | 4 +- lib/src/models/event_model.dart | 2 + lib/src/screens/events_screen.dart | 8 +- lib/src/utils.dart | 10 +++ lib/src/widgets/event_list_tile.dart | 117 ++++++++++++++++++++++++++- lib/src/widgets/task_list_tile.dart | 2 +- 6 files changed, 136 insertions(+), 7 deletions(-) diff --git a/lib/src/mixins/tile_mixin.dart b/lib/src/mixins/tile_mixin.dart index 54506c6..3c864cf 100644 --- a/lib/src/mixins/tile_mixin.dart +++ b/lib/src/mixins/tile_mixin.dart @@ -1,9 +1,9 @@ import 'package:flutter/material.dart'; mixin Tile { - BoxDecoration tileDecoration(BuildContext context) { + BoxDecoration tileDecoration(Color color) { return BoxDecoration( - color: Theme.of(context).cardColor, + color: color, borderRadius: BorderRadius.only( topRight: Radius.circular(8), bottomRight: Radius.circular(8), diff --git a/lib/src/models/event_model.dart b/lib/src/models/event_model.dart index 8b174e6..31d2d4c 100644 --- a/lib/src/models/event_model.dart +++ b/lib/src/models/event_model.dart @@ -34,6 +34,8 @@ class EventModel { /// The amount of low priority pending tasks linked to this event. final int lowPriority; + int get pendingTasks => highPriority + mediumPriority + lowPriority; + EventModel({ this.id, @required this.name, diff --git a/lib/src/screens/events_screen.dart b/lib/src/screens/events_screen.dart index b5f7b53..c3d6477 100644 --- a/lib/src/screens/events_screen.dart +++ b/lib/src/screens/events_screen.dart @@ -47,7 +47,13 @@ class _EventsScreenState extends State { name: 'Math', pendigTasks: 3, media: [], - when: [], + when: [ + true, + true, + false, + false, + true, + ], highPriority: 2, mediumPriority: 1, lowPriority: 0, diff --git a/lib/src/utils.dart b/lib/src/utils.dart index 5b52ca1..f670845 100644 --- a/lib/src/utils.dart +++ b/lib/src/utils.dart @@ -3,6 +3,7 @@ import 'dart:async'; import 'package:flutter/material.dart'; import 'package:rxdart/rxdart.dart'; +import './models/event_model.dart'; import './models/task_model.dart'; import './services/upload_status_service.dart'; @@ -56,6 +57,15 @@ Color getColorFromPriority(TaskPriority priority) { } } +Color getColorFromEvent(EventModel event) { + if (event.highPriority != 0) { + return kHighPriorityColor; + } else if (event.mediumPriority != 0) { + return kMediumPriorityColor; + } + return kLowPriorityColor; +} + class Validators { final validateStringNotEmpty = StreamTransformer.fromHandlers( handleData: (String string, EventSink sink) { diff --git a/lib/src/widgets/event_list_tile.dart b/lib/src/widgets/event_list_tile.dart index 907718a..4b7e141 100644 --- a/lib/src/widgets/event_list_tile.dart +++ b/lib/src/widgets/event_list_tile.dart @@ -1,8 +1,10 @@ import 'package:flutter/material.dart'; +import 'package:font_awesome_flutter/font_awesome_flutter.dart'; import '../models/event_model.dart'; import '../mixins/tile_mixin.dart'; -import '../utils.dart'; +import '../utils.dart' show kTileBigTextStyle, kBlueGradient, getColorFromEvent; +import '../widgets/action_button.dart'; class EventListTile extends StatelessWidget with Tile { final EventModel event; @@ -16,27 +18,136 @@ class EventListTile extends StatelessWidget with Tile { child: Container( height: 85, child: Stack( + overflow: Overflow.visible, children: [ Container( padding: EdgeInsets.all(8), child: Row( + mainAxisSize: MainAxisSize.max, children: [ Column( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + crossAxisAlignment: CrossAxisAlignment.start, children: [ Text( event.name, style: kTileBigTextStyle, ), + _OcurranceIdicator(ocurrance: event.when), + ], + ), + Column( + mainAxisAlignment: MainAxisAlignment.end, + children: [ + Row( + children: [ + SizedBox( + width: 80, + ), + ActionButton( + color: Colors.white, + textColor: Colors.black, + text: 'Resources', + leadingIconData: FontAwesomeIcons.listAlt, + onPressed: () => Navigator.of(context) + .pushNamed('event/${event.name}'), + ), + ], + ), ], ), - Column(), ], ), ), + getPriorityIndicator(), + getTasksIndicator(), ], ), - decoration: tileDecoration(context), + decoration: tileDecoration(Theme.of(context).cardColor), + ), + ); + } + + Widget getPriorityIndicator() { + final color = getColorFromEvent(event); + return Row( + children: [ + Spacer(), + Container( + width: 15, + decoration: tileDecoration(color), + ), + ], + ); + } + + Widget getTasksIndicator() { + return Positioned( + bottom: 75, + right: -10, + child: Container( + child: Center( + child: Text( + '${event.pendingTasks}', + style: TextStyle( + color: Colors.white, + ), + ), + ), + width: 30, + height: 20, + decoration: BoxDecoration( + gradient: kBlueGradient, + borderRadius: BorderRadius.circular(10), + ), ), ); } } + +class _OcurranceIdicator extends StatelessWidget { + static const kDayLetters = ['M', 'T', 'W', 'Th', 'F']; + // A list that visually represents when an event occurs. + final List ocurrance; + + _OcurranceIdicator({@required this.ocurrance}) + : assert(ocurrance != null), + assert(ocurrance.length == 5); + + Widget build(BuildContext context) { + List rowChildren = []; + + for (int i = 0; i < 5; i++) { + rowChildren.add( + Container( + height: 25, + width: 25, + decoration: BoxDecoration( + color: ocurrance[i] ? Colors.white : Colors.grey, + borderRadius: BorderRadius.circular(3), + ), + child: Center( + child: Text( + kDayLetters[i], + style: TextStyle( + fontWeight: FontWeight.w500, + ), + ), + ), + ), + ); + if (i != 4) { + rowChildren.add( + SizedBox( + width: 5, + ), + ); + } + } + + return Row( + mainAxisAlignment: MainAxisAlignment.start, + children: rowChildren, + ); + } +} diff --git a/lib/src/widgets/task_list_tile.dart b/lib/src/widgets/task_list_tile.dart index 262af63..406fb40 100644 --- a/lib/src/widgets/task_list_tile.dart +++ b/lib/src/widgets/task_list_tile.dart @@ -63,7 +63,7 @@ class TaskListTile extends StatelessWidget with Tile { ), ], ), - decoration: tileDecoration(context), + decoration: tileDecoration(Theme.of(context).cardColor), ), ); }