Display Cards

Today I worked on finishing the UI of the Display cards. Had some ups and downs, but eventually figured it out after some debugging.

Initial Errors

Initially the cards that I made did not show up. It was quite frustrating, because I had already debugged all the code by hand before running the app. However, after some work, I did manage to figure out the issue.
First, I looked at the widget tree. In it, the body of the dashboard was not showing up, telling me that it was probably an issue dealing with card interactions with the scaffold. Then, I looked into the card, realizing that the widget used a gridview that had no restrictions on size, due to faulty variables I had set. I quickly fixed it by just removing the gridview. I would NEVER admit to making a miscalculation.

Phase 2.

In phase 2, the dashboard went from empty screen to genuine dookie. Turns out, I had indeed made a major miscalculation in my settings. This was easily fixed, however. Then, I also realized that the color choices were dookie. So, I added in the theme that I had made before hand (not included in the hours).

Final Product

Now the cards look somewhat appealing. I am not the best graphic artist, so I just used icons I had available.

Future

I will probably end up using a softer palette later on. The current colors are too bold.

For anyone wondering

These are the colors used. Of course, I did switch around some stuff manually in the code, but…

static const Color primary = Color(0xFF134624,);
static const Color primaryDark = Color(0xFF0B2E16);
static const Color background = Color(0xFFE8F2EC,);
static const Color surface = Color(0xFFFFFFFF);
static const Color textPrimary = Color(0xFF0E2414,);
static const Color textSecondary = Color(0xFF355E42,);
static const Color accent = Color(0xFFF06500,); 
static const Color secondary = Color(0xFF1EA1E8,);
static const Color cardGreen = Color(0xFF3F8E4D,);
static const Color statusWarning = Color(0xFFD32F2F,);