From d6f70960553fa06bfb2644b4e60c4923c0e9fccb Mon Sep 17 00:00:00 2001 From: Yegor Vialov Date: Sat, 4 Apr 2020 20:54:32 +0000 Subject: [PATCH] WIP Themes: New light theme --- lib/entities/badge.widget.dart | 4 +- lib/entities/entity_colors.class.dart | 77 ---------------- lib/entities/entity_icon.widget.dart | 2 +- lib/entities/entity_picture.widget.dart | 2 +- .../media_player_progress_bar.widget.dart | 2 +- .../widgets/media_player_widgets.dart | 2 +- lib/main.dart | 3 +- lib/managers/theme_manager.dart | 91 ++++++++++++++++++- lib/pages/main/main.page.dart | 8 +- .../history_chart/combined_history_chart.dart | 4 +- .../history_chart/history_control_widget.dart | 2 +- .../numeric_state_history_chart.dart | 2 +- .../simple_state_history_chart.dart | 6 +- 13 files changed, 107 insertions(+), 98 deletions(-) delete mode 100644 lib/entities/entity_colors.class.dart diff --git a/lib/entities/badge.widget.dart b/lib/entities/badge.widget.dart index a9175f4..8e1bad0 100644 --- a/lib/entities/badge.widget.dart +++ b/lib/entities/badge.widget.dart @@ -7,8 +7,8 @@ class BadgeWidget extends StatelessWidget { double iconSize = 26.0; Widget badgeIcon; String onBadgeTextValue; - Color iconColor = EntityColor.badgeColors[entityModel.entityWrapper.entity.domain] ?? - EntityColor.badgeColors["default"]; + Color iconColor = HAClientTheme().badgeColors[entityModel.entityWrapper.entity.domain] ?? + HAClientTheme().badgeColors["default"]; switch (entityModel.entityWrapper.entity.domain) { case "sun": { diff --git a/lib/entities/entity_colors.class.dart b/lib/entities/entity_colors.class.dart deleted file mode 100644 index 7ff35ec..0000000 --- a/lib/entities/entity_colors.class.dart +++ /dev/null @@ -1,77 +0,0 @@ -part of '../main.dart'; - -class EntityColor { - - static const defaultStateColor = Color.fromRGBO(68, 115, 158, 1.0); - - static const badgeColors = { - "default": Color.fromRGBO(223, 76, 30, 1.0), - "binary_sensor": Color.fromRGBO(3, 155, 229, 1.0) - }; - - static const _stateColors = { - EntityState.on: Colors.amber, - "auto": Colors.amber, - EntityState.active: Colors.amber, - EntityState.playing: Colors.amber, - EntityState.paused: Colors.amber, - "above_horizon": Colors.amber, - EntityState.home: Colors.amber, - EntityState.open: Colors.amber, - EntityState.cleaning: Colors.amber, - EntityState.returning: Colors.amber, - EntityState.off: defaultStateColor, - EntityState.closed: defaultStateColor, - "below_horizon": defaultStateColor, - "default": defaultStateColor, - EntityState.idle: defaultStateColor, - "heat": Colors.redAccent, - "cool": Colors.lightBlue, - EntityState.unavailable: Colors.black26, - EntityState.unknown: Colors.black26, - EntityState.alarm_disarmed: Colors.green, - EntityState.alarm_armed_away: Colors.redAccent, - EntityState.alarm_armed_custom_bypass: Colors.redAccent, - EntityState.alarm_armed_home: Colors.redAccent, - EntityState.alarm_armed_night: Colors.redAccent, - EntityState.alarm_triggered: Colors.redAccent, - EntityState.alarm_arming: Colors.amber, - EntityState.alarm_disarming: Colors.amber, - EntityState.alarm_pending: Colors.amber, - }; - - static Color stateColor(String state) { - return _stateColors[state] ?? _stateColors["default"]; - } - - static charts.Color chartHistoryStateColor(String state, int id) { - Color c = _stateColors[state]; - if (c != null) { - return charts.Color( - r: c.red, - g: c.green, - b: c.blue, - a: c.alpha - ); - } else { - double r = id.toDouble() % 10; - return charts.MaterialPalette.getOrderedPalettes(10)[r.round()].shadeDefault; - } - } - - static Color historyStateColor(String state, int id) { - Color c = _stateColors[state]; - if (c != null) { - return c; - } else { - if (id > -1) { - double r = id.toDouble() % 10; - charts.Color c1 = charts.MaterialPalette.getOrderedPalettes(10)[r.round()].shadeDefault; - return Color.fromARGB(c1.a, c1.r, c1.g, c1.b); - } else { - return _stateColors[EntityState.on]; - } - } - } - -} \ No newline at end of file diff --git a/lib/entities/entity_icon.widget.dart b/lib/entities/entity_icon.widget.dart index e6e99fe..246d9aa 100644 --- a/lib/entities/entity_icon.widget.dart +++ b/lib/entities/entity_icon.widget.dart @@ -67,7 +67,7 @@ class EntityIcon extends StatelessWidget { padding: padding, child: buildIcon( entityWrapper, - color ?? EntityColor.stateColor(entityWrapper.entity.state) + color ?? HAClientTheme().stateColor(entityWrapper.entity.state) ), ); } diff --git a/lib/entities/entity_picture.widget.dart b/lib/entities/entity_picture.widget.dart index 99f4375..b601ff3 100644 --- a/lib/entities/entity_picture.widget.dart +++ b/lib/entities/entity_picture.widget.dart @@ -39,7 +39,7 @@ class EntityPicture extends StatelessWidget { child: Icon( IconData(iconCode, fontFamily: 'Material Design Icons'), size: Sizes.largeIconSize, - color: EntityColor.defaultStateColor, + color: HAClientTheme().defaultStateColor, ) ) ); diff --git a/lib/entities/media_player/widgets/media_player_progress_bar.widget.dart b/lib/entities/media_player/widgets/media_player_progress_bar.widget.dart index 52ed346..e12a3a8 100644 --- a/lib/entities/media_player/widgets/media_player_progress_bar.widget.dart +++ b/lib/entities/media_player/widgets/media_player_progress_bar.widget.dart @@ -33,7 +33,7 @@ class _MediaPlayerProgressBarState extends State { return LinearProgressIndicator( value: progress, backgroundColor: Colors.black45, - valueColor: AlwaysStoppedAnimation(EntityColor.stateColor(EntityState.on)), + valueColor: AlwaysStoppedAnimation(HAClientTheme().stateColor(EntityState.on)), ); } diff --git a/lib/entities/media_player/widgets/media_player_widgets.dart b/lib/entities/media_player/widgets/media_player_widgets.dart index 773fb5e..eb63298 100644 --- a/lib/entities/media_player/widgets/media_player_widgets.dart +++ b/lib/entities/media_player/widgets/media_player_widgets.dart @@ -94,7 +94,7 @@ class MediaPlayerWidget extends StatelessWidget { Icon( MaterialDesignIcons.getIconDataFromIconName("mdi:movie"), size: 150.0, - color: EntityColor.stateColor("$state"), + color: HAClientTheme().stateColor("$state"), ) ], ); diff --git a/lib/main.dart b/lib/main.dart index 8ce3609..297a56b 100644 --- a/lib/main.dart +++ b/lib/main.dart @@ -35,7 +35,6 @@ import 'package:flutter_webview_plugin/flutter_webview_plugin.dart' as standalon import 'package:webview_flutter/webview_flutter.dart'; import 'package:video_player/video_player.dart'; -import 'managers/theme_manager.dart'; import 'utils/logger.dart'; part 'const.dart'; @@ -77,7 +76,6 @@ part 'entities/universal_slider.widget.dart'; part 'entities/flat_service_button.widget.dart'; part 'entities/light/widgets/light_color_picker.dart'; part 'entities/camera/widgets/camera_stream_view.dart'; -part 'entities/entity_colors.class.dart'; part 'plugins/history_chart/entity_history.dart'; part 'plugins/history_chart/simple_state_history_chart.dart'; part 'plugins/history_chart/numeric_state_history_chart.dart'; @@ -125,6 +123,7 @@ part 'managers/mobile_app_integration_manager.class.dart'; part 'managers/connection_manager.class.dart'; part 'managers/device_info_manager.class.dart'; part 'managers/startup_user_messages_manager.class.dart'; +part 'managers/theme_manager.dart'; part 'ui.dart'; part 'view.class.dart'; part 'cards/card.class.dart'; diff --git a/lib/managers/theme_manager.dart b/lib/managers/theme_manager.dart index aa3a756..3da87a1 100644 --- a/lib/managers/theme_manager.dart +++ b/lib/managers/theme_manager.dart @@ -1,4 +1,4 @@ -import 'package:flutter/material.dart'; +part of '../main.dart'; class HAClientTheme { @@ -20,6 +20,44 @@ class HAClientTheme { button: TextStyle(fontSize: 14, fontWeight: FontWeight.w500), ); + static const _stateColors = { + EntityState.on: Colors.amber, + "auto": Colors.amber, + EntityState.active: Colors.amber, + EntityState.playing: Colors.amber, + EntityState.paused: Colors.amber, + "above_horizon": Colors.amber, + EntityState.home: Colors.amber, + EntityState.open: Colors.amber, + EntityState.cleaning: Colors.amber, + EntityState.returning: Colors.amber, + EntityState.off: defaultStateColor, + EntityState.closed: defaultStateColor, + "below_horizon": defaultStateColor, + "default": defaultStateColor, + EntityState.idle: defaultStateColor, + "heat": Colors.redAccent, + "cool": Colors.lightBlue, + EntityState.unavailable: Colors.black26, + EntityState.unknown: Colors.black26, + EntityState.alarm_disarmed: Colors.green, + EntityState.alarm_armed_away: Colors.redAccent, + EntityState.alarm_armed_custom_bypass: Colors.redAccent, + EntityState.alarm_armed_home: Colors.redAccent, + EntityState.alarm_armed_night: Colors.redAccent, + EntityState.alarm_triggered: Colors.redAccent, + EntityState.alarm_arming: Colors.amber, + EntityState.alarm_disarming: Colors.amber, + EntityState.alarm_pending: Colors.amber, + }; + + static const defaultStateColor = Color.fromRGBO(68, 115, 158, 1.0); + + static const badgeColors = { + "default": Color.fromRGBO(223, 76, 30, 1.0), + "binary_sensor": Color.fromRGBO(3, 155, 229, 1.0) + }; + static final HAClientTheme _instance = HAClientTheme ._internal(); @@ -29,7 +67,22 @@ class HAClientTheme { HAClientTheme._internal(); - final ThemeData lightTheme = ThemeData.light().copyWith( + final ThemeData lightTheme = ThemeData.from( + colorScheme: ColorScheme( + primary: Color.fromRGBO(112, 154, 193, 1), + primaryVariant: Color.fromRGBO(68, 115, 158, 1), + secondary: Color.fromRGBO(253, 216, 53, 1), + secondaryVariant: Color.fromRGBO(222, 181, 2, 1), + background: Colors.white, + surface: Colors.white, + error: Colors.red, + onPrimary: Colors.white, + onSecondary: Colors.black87, + onBackground: Colors.black87, + onSurface: Colors.black87, + onError: Colors.white, + brightness: Brightness.light + ), textTheme: ThemeData.light().textTheme.copyWith( display1: textTheme.display1.copyWith(color: Colors.black54), display2: textTheme.display2.copyWith(color: Colors.redAccent), @@ -61,4 +114,38 @@ class HAClientTheme { ) ); + Color stateColor(String state) { + return _stateColors[state] ?? _stateColors["default"]; + } + + charts.Color chartHistoryStateColor(String state, int id) { + Color c = _stateColors[state]; + if (c != null) { + return charts.Color( + r: c.red, + g: c.green, + b: c.blue, + a: c.alpha + ); + } else { + double r = id.toDouble() % 10; + return charts.MaterialPalette.getOrderedPalettes(10)[r.round()].shadeDefault; + } + } + + Color historyStateColor(String state, int id) { + Color c = _stateColors[state]; + if (c != null) { + return c; + } else { + if (id > -1) { + double r = id.toDouble() % 10; + charts.Color c1 = charts.MaterialPalette.getOrderedPalettes(10)[r.round()].shadeDefault; + return Color.fromARGB(c1.a, c1.r, c1.g, c1.b); + } else { + return _stateColors[EntityState.on]; + } + } + } + } \ No newline at end of file diff --git a/lib/pages/main/main.page.dart b/lib/pages/main/main.page.dart index 5b617a8..3585cb1 100644 --- a/lib/pages/main/main.page.dart +++ b/lib/pages/main/main.page.dart @@ -634,7 +634,7 @@ class _MainPageState extends State with WidgetsBindingObserver, Ticker child: Text( "${entity.displayName}", style: Theme.of(context).textTheme.body1.copyWith( - color: EntityColor.stateColor(entity.state) + color: HAClientTheme().stateColor(entity.state) ) ), value: "${entity.entityId}", @@ -822,9 +822,9 @@ class _MainPageState extends State with WidgetsBindingObserver, Ticker bottomBarChildren.add( CollectionScaleTransition( children: [ - Icon(Icons.stop, size: 10.0, color: EntityColor.stateColor(EntityState.on),), - Icon(Icons.stop, size: 10.0, color: EntityColor.stateColor(EntityState.unavailable),), - Icon(Icons.stop, size: 10.0, color: EntityColor.stateColor(EntityState.off),), + Icon(Icons.stop, size: 10.0, color: HAClientTheme().stateColor(EntityState.on),), + Icon(Icons.stop, size: 10.0, color: HAClientTheme().stateColor(EntityState.unavailable),), + Icon(Icons.stop, size: 10.0, color: HAClientTheme().stateColor(EntityState.off),), ], ), ); diff --git a/lib/plugins/history_chart/combined_history_chart.dart b/lib/plugins/history_chart/combined_history_chart.dart index 785a227..f030901 100644 --- a/lib/plugins/history_chart/combined_history_chart.dart +++ b/lib/plugins/history_chart/combined_history_chart.dart @@ -156,7 +156,7 @@ class _CombinedHistoryChartWidgetState extends State result.add( new charts.Series( id: "value", - colorFn: (EntityHistoryMoment historyMoment, __) => EntityColor.chartHistoryStateColor("_", historyMoment.colorId), + colorFn: (EntityHistoryMoment historyMoment, __) => HAClientTheme().chartHistoryStateColor("_", historyMoment.colorId), radiusPxFn: (EntityHistoryMoment historyMoment, __) { if (historyMoment.hiddenDot) { return 0.0; @@ -179,7 +179,7 @@ class _CombinedHistoryChartWidgetState extends State new charts.Series( id: 'state', radiusPxFn: (EntityHistoryMoment historyMoment, __) => (historyMoment.id == _selectedId) ? 5.0 : 4.0, - colorFn: (EntityHistoryMoment historyMoment, __) => EntityColor.chartHistoryStateColor(historyMoment.state, historyMoment.colorId), + colorFn: (EntityHistoryMoment historyMoment, __) => HAClientTheme().chartHistoryStateColor(historyMoment.state, historyMoment.colorId), domainFn: (EntityHistoryMoment historyMoment, _) => historyMoment.startTime, domainLowerBoundFn: (EntityHistoryMoment historyMoment, _) => historyMoment.startTime, domainUpperBoundFn: (EntityHistoryMoment historyMoment, _) => historyMoment.endTime ?? DateTime.now(), diff --git a/lib/plugins/history_chart/history_control_widget.dart b/lib/plugins/history_chart/history_control_widget.dart index 907f917..915ec2b 100644 --- a/lib/plugins/history_chart/history_control_widget.dart +++ b/lib/plugins/history_chart/history_control_widget.dart @@ -54,7 +54,7 @@ class HistoryControlWidget extends StatelessWidget { "${selectedStates[i] ?? '-'}", textAlign: TextAlign.right, style: Theme.of(context).textTheme.title.copyWith( - color: EntityColor.historyStateColor(selectedStates[i], colorIndexes[i]) + color: HAClientTheme().historyStateColor(selectedStates[i], colorIndexes[i]) ) ) ); diff --git a/lib/plugins/history_chart/numeric_state_history_chart.dart b/lib/plugins/history_chart/numeric_state_history_chart.dart index 8645a37..705deb5 100644 --- a/lib/plugins/history_chart/numeric_state_history_chart.dart +++ b/lib/plugins/history_chart/numeric_state_history_chart.dart @@ -108,7 +108,7 @@ class _NumericStateHistoryChartWidgetState extends State( id: 'State', - colorFn: (EntityHistoryMoment historyMoment, __) => EntityColor.chartHistoryStateColor(EntityState.on, -1), + colorFn: (EntityHistoryMoment historyMoment, __) => HAClientTheme().chartHistoryStateColor(EntityState.on, -1), domainFn: (EntityHistoryMoment historyMoment, _) => historyMoment.startTime, measureFn: (EntityHistoryMoment historyMoment, _) => historyMoment.value ?? historyMoment.previousValue, data: data, diff --git a/lib/plugins/history_chart/simple_state_history_chart.dart b/lib/plugins/history_chart/simple_state_history_chart.dart index 0e1cc6c..63d0353 100644 --- a/lib/plugins/history_chart/simple_state_history_chart.dart +++ b/lib/plugins/history_chart/simple_state_history_chart.dart @@ -107,7 +107,7 @@ class _SimpleStateHistoryChartWidgetState extends State( id: 'State', strokeWidthPxFn: (EntityHistoryMoment historyMoment, __) => (historyMoment.id == _selectedId) ? 6.0 : 3.0, - colorFn: (EntityHistoryMoment historyMoment, __) => EntityColor.chartHistoryStateColor(historyMoment.state, historyMoment.colorId), + colorFn: (EntityHistoryMoment historyMoment, __) => HAClientTheme().chartHistoryStateColor(historyMoment.state, historyMoment.colorId), domainFn: (EntityHistoryMoment historyMoment, _) => historyMoment.startTime, measureFn: (EntityHistoryMoment historyMoment, _) => 10, data: data, @@ -115,7 +115,7 @@ class _SimpleStateHistoryChartWidgetState extends State( id: 'State', radiusPxFn: (EntityHistoryMoment historyMoment, __) => (historyMoment.id == _selectedId) ? 5.0 : 3.0, - colorFn: (EntityHistoryMoment historyMoment, __) => EntityColor.chartHistoryStateColor(historyMoment.state, historyMoment.colorId), + colorFn: (EntityHistoryMoment historyMoment, __) => HAClientTheme().chartHistoryStateColor(historyMoment.state, historyMoment.colorId), domainFn: (EntityHistoryMoment historyMoment, _) => historyMoment.startTime, measureFn: (EntityHistoryMoment historyMoment, _) => 10, data: data, @@ -123,7 +123,7 @@ class _SimpleStateHistoryChartWidgetState extends State( id: 'State', radiusPxFn: (EntityHistoryMoment historyMoment, __) => (historyMoment.id == _selectedId) ? 5.0 : 3.0, - colorFn: (EntityHistoryMoment historyMoment, __) => EntityColor.chartHistoryStateColor(historyMoment.state, historyMoment.colorId), + colorFn: (EntityHistoryMoment historyMoment, __) => HAClientTheme().chartHistoryStateColor(historyMoment.state, historyMoment.colorId), domainFn: (EntityHistoryMoment historyMoment, _) => historyMoment.endTime ?? DateTime.now(), measureFn: (EntityHistoryMoment historyMoment, _) => 10, data: data,