diff --git a/Images/Custom.png b/Images/Custom.png
new file mode 100644
index 0000000..76e0dd1
Binary files /dev/null and b/Images/Custom.png differ
diff --git a/Images/dark.png b/Images/dark.png
new file mode 100644
index 0000000..0d514d0
Binary files /dev/null and b/Images/dark.png differ
diff --git a/Images/light.png b/Images/light.png
new file mode 100644
index 0000000..10a9771
Binary files /dev/null and b/Images/light.png differ
diff --git a/README.md b/README.md
index bccd64a..6b7fede 100644
--- a/README.md
+++ b/README.md
@@ -31,3 +31,15 @@ Your Challenge is to make this screen more interesting with custom themeing. A c
- Not required, but encouraged: theming, as above, for the third theme as well.
That's it! Good luck :)
+
+## App Screenshots!
+
+
+
+# App In Action!
+
+
+
+
+
+
diff --git a/lib/scenery.dart b/lib/scenery.dart
index 9c5c180..3868913 100644
--- a/lib/scenery.dart
+++ b/lib/scenery.dart
@@ -22,12 +22,18 @@ class _SceneryState extends State {
children: [
CustomPaint(
foregroundPainter: SceneryPainter(
- skyColor: CustomWidgetThemes.of(context).sceneryThemeData!.skyFillColor,
- waterColor: CustomWidgetThemes.of(context).sceneryThemeData!.waterFillColor,
- mountainColor: CustomWidgetThemes.of(context).sceneryThemeData!.mountainFillColor,
+ skyColor:
+ CustomWidgetThemes.of(context).sceneryThemeData!.skyFillColor,
+ waterColor: CustomWidgetThemes.of(context)
+ .sceneryThemeData!
+ .waterFillColor,
+ mountainColor: CustomWidgetThemes.of(context)
+ .sceneryThemeData!
+ .mountainFillColor,
textHeight: _textAreaHeight,
drawSun: CustomWidgetThemes.of(context).sceneryThemeData!.drawSun,
- drawMoon: CustomWidgetThemes.of(context).sceneryThemeData!.drawMoon,
+ drawMoon:
+ CustomWidgetThemes.of(context).sceneryThemeData!.drawMoon,
),
child: Container(),
),
@@ -35,6 +41,7 @@ class _SceneryState extends State {
Positioned(
bottom: 0,
child: Container(
+ color: myTheme.currentThemeData.primaryColorLight,
height: _textAreaHeight,
width: constraints.maxWidth,
child: const SomeText(),
@@ -45,6 +52,7 @@ class _SceneryState extends State {
right: 0,
child: Container(
width: constraints.maxWidth,
+ color: myTheme.currentThemeData.primaryColor,
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Row(
@@ -56,7 +64,8 @@ class _SceneryState extends State {
title: const Text('Light'),
groupValue: myTheme.themeType,
value: ThemeType.Light,
- onChanged: (ThemeType? mode) => myTheme.setThemeType(ThemeType.Light),
+ onChanged: (ThemeType? mode) =>
+ myTheme.setThemeType(ThemeType.Light),
),
),
Expanded(
@@ -65,7 +74,8 @@ class _SceneryState extends State {
title: const Text('Dark'),
groupValue: myTheme.themeType,
value: ThemeType.Dark,
- onChanged: (ThemeType? mode) => myTheme.setThemeType(ThemeType.Dark),
+ onChanged: (ThemeType? mode) =>
+ myTheme.setThemeType(ThemeType.Dark),
),
),
Expanded(
@@ -74,7 +84,8 @@ class _SceneryState extends State {
title: const Text('Other'),
groupValue: myTheme.themeType,
value: ThemeType.Other,
- onChanged: (ThemeType? mode) => myTheme.setThemeType(ThemeType.Other),
+ onChanged: (ThemeType? mode) =>
+ myTheme.setThemeType(ThemeType.Other),
),
),
],
diff --git a/lib/themes/custom_themes.dart b/lib/themes/custom_themes.dart
index 102fc3d..8e3442f 100644
--- a/lib/themes/custom_themes.dart
+++ b/lib/themes/custom_themes.dart
@@ -7,7 +7,8 @@ import 'scenery_theme.dart';
/// You can add themes for your own custom widgets here.
/// NB: for this challenge, it is only required to modify sceneryThemeData
class CustomWidgetThemes {
- static CustomWidgetThemes of(BuildContext context) => CustomWidgetThemes._(context);
+ static CustomWidgetThemes of(BuildContext context) =>
+ CustomWidgetThemes._(context);
SceneryThemeData? sceneryThemeData;
@@ -19,27 +20,27 @@ class CustomWidgetThemes {
switch (themeType) {
case ThemeType.Light:
sceneryThemeData = SceneryThemeData(
- skyFillColor: Colors.grey,
- mountainFillColor: Colors.blueGrey,
- waterFillColor: Colors.blueGrey[800]!,
+ skyFillColor: Colors.orangeAccent[200]!,
+ mountainFillColor: Colors.brown,
+ waterFillColor: Colors.lightBlue.shade300,
drawMoon: false,
drawSun: true,
);
break;
case ThemeType.Dark:
sceneryThemeData = SceneryThemeData(
- skyFillColor: Colors.grey,
- mountainFillColor: Colors.blueGrey,
- waterFillColor: Colors.blueGrey[800]!,
+ skyFillColor: Colors.grey[800]!,
+ mountainFillColor: Colors.redAccent,
+ waterFillColor: Colors.blueGrey[200]!,
drawMoon: true,
drawSun: false,
);
break;
case ThemeType.Other:
sceneryThemeData = SceneryThemeData(
- skyFillColor: Colors.grey,
- mountainFillColor: Colors.blueGrey,
- waterFillColor: Colors.blueGrey[800]!,
+ skyFillColor: Colors.pink[900]!,
+ mountainFillColor: Colors.purple[300]!,
+ waterFillColor: Colors.pinkAccent,
drawMoon: true,
drawSun: true,
);
diff --git a/lib/themes/my_theme.dart b/lib/themes/my_theme.dart
index a3c4b6f..f3ec07b 100644
--- a/lib/themes/my_theme.dart
+++ b/lib/themes/my_theme.dart
@@ -29,11 +29,40 @@ class MyTheme with ChangeNotifier {
ThemeData get currentThemeData {
switch (themeType) {
case ThemeType.Light:
- return ThemeData();
+ return ThemeData(
+ primaryColor: Colors.lime,
+ primaryColorLight: Color(0xff96cdf0),
+ accentColor: Color(0xff182628),
+ backgroundColor: Color(0xff3b945e),
+ textTheme: TextTheme(
+ headline3: TextStyle(
+ color: Color(0xff0E1132), fontWeight: FontWeight.bold),
+ subtitle1: TextStyle(
+ color: Color(0xff0E1132), fontWeight: FontWeight.w600),
+ bodyText1: TextStyle(color: Color(0xff04396C))));
case ThemeType.Dark:
- return ThemeData();
+ return ThemeData(
+ primaryColor: Color(0xff10282d),
+ primaryColorLight: Color(0xff4E4E50),
+ accentColor: Color(0xffe1f1f4),
+ backgroundColor: Color(0xff182628),
+ textTheme: TextTheme(
+ headline3: TextStyle(
+ color: Color(0xffffffff), fontWeight: FontWeight.bold),
+ subtitle1: TextStyle(
+ color: Color(0xffffffff), fontWeight: FontWeight.w600),
+ bodyText1: TextStyle(color: Color(0xebEDF5E0))));
case ThemeType.Other:
- return ThemeData();
+ return ThemeData(
+ primaryColor: Colors.pink[100],
+ primaryColorLight: Colors.deepPurpleAccent[100],
+ accentColor: Color(0xff2a1b3d),
+ textTheme: TextTheme(
+ headline3: TextStyle(
+ color: Color(0xff25274D), fontWeight: FontWeight.bold),
+ subtitle1: TextStyle(
+ color: Color(0xff25274D), fontWeight: FontWeight.w600),
+ bodyText1: TextStyle(color: Color(0xff24315E))));
}
}
}