From a0a0cb4612caad9afd00bff12a012a18bd57158d Mon Sep 17 00:00:00 2001 From: Yegor Vialov Date: Sat, 4 Apr 2020 15:13:55 +0000 Subject: [PATCH] WIP Themes: Make all fonts depend on theme --- lib/cards/card_widget.dart | 3 -- .../alarm_control_panel_controls.widget.dart | 4 +- lib/entities/badge.widget.dart | 7 +-- .../default_entity_container.widget.dart | 4 +- lib/entities/entity_page_layout.widget.dart | 6 +-- .../light/widgets/light_controls.dart | 4 +- .../widgets/media_player_seek_bar.widget.dart | 14 ++--- .../widgets/media_player_widgets.dart | 11 ++-- .../vacuum/widgets/vacuum_state_button.dart | 5 +- lib/main.dart | 4 +- lib/managers/theme_manager.dart | 12 +++-- lib/pages/integration_settings.page.dart | 7 ++- lib/pages/main/main.page.dart | 52 ++++++++----------- lib/pages/play_media.page.dart | 10 ++-- lib/pages/settings.page.dart | 21 +++----- lib/pages/widgets/page_loading_error.dart | 2 +- lib/pages/widgets/page_loading_indicator.dart | 2 +- .../widgets/product_purchase.widget.dart | 11 ++-- lib/panels/panel_class.dart | 2 +- .../history_chart/history_control_widget.dart | 12 ++--- 20 files changed, 88 insertions(+), 105 deletions(-) diff --git a/lib/cards/card_widget.dart b/lib/cards/card_widget.dart index d3cca01..dac7ebe 100644 --- a/lib/cards/card_widget.dart +++ b/lib/cards/card_widget.dart @@ -198,9 +198,6 @@ class CardWidget extends StatelessWidget { body.add(CardHeader( name: card.name ?? "", subtitle: Text("${card.linkedEntityWrapper.entity.displayState}", - style: TextStyle( - color: Colors.grey - ), ), trailing: Row( mainAxisSize: MainAxisSize.min, diff --git a/lib/entities/alarm_control_panel/widgets/alarm_control_panel_controls.widget.dart b/lib/entities/alarm_control_panel/widgets/alarm_control_panel_controls.widget.dart index ff9e707..51eb666 100644 --- a/lib/entities/alarm_control_panel/widgets/alarm_control_panel_controls.widget.dart +++ b/lib/entities/alarm_control_panel/widgets/alarm_control_panel_controls.widget.dart @@ -248,7 +248,9 @@ class _AlarmControlPanelControlsWidgetWidgetState extends State _askToTrigger(entity), ) diff --git a/lib/entities/badge.widget.dart b/lib/entities/badge.widget.dart index 0643f15..a2ac28b 100644 --- a/lib/entities/badge.widget.dart +++ b/lib/entities/badge.widget.dart @@ -64,7 +64,6 @@ class BadgeWidget extends StatelessWidget { overflow: TextOverflow.fade, softWrap: false, textAlign: TextAlign.center, - style: TextStyle(fontSize: stateFontSize), ), ); break; @@ -77,7 +76,9 @@ class BadgeWidget extends StatelessWidget { onBadgeText = Container( padding: EdgeInsets.fromLTRB(6.0, 2.0, 6.0, 2.0), child: Text("$onBadgeTextValue", - style: TextStyle(fontSize: 12.0, color: Colors.white), + style: Theme.of(context).textTheme.overline.copyWith( + color: Colors.white + ), textAlign: TextAlign.center, softWrap: false, overflow: TextOverflow.fade), @@ -131,7 +132,7 @@ class BadgeWidget extends StatelessWidget { child: Text( "${entityModel.entityWrapper.displayName}", textAlign: TextAlign.center, - style: TextStyle(fontSize: 12.0), + style: Theme.of(context).textTheme.caption, softWrap: true, maxLines: 3, overflow: TextOverflow.ellipsis, diff --git a/lib/entities/default_entity_container.widget.dart b/lib/entities/default_entity_container.widget.dart index ac725d6..8eff0a9 100644 --- a/lib/entities/default_entity_container.widget.dart +++ b/lib/entities/default_entity_container.widget.dart @@ -29,7 +29,9 @@ class DefaultEntityContainer extends StatelessWidget { ), Text( "${entityModel.entityWrapper.entity.displayName}", - style: TextStyle(color: Colors.blue), + style: Theme.of(context).textTheme.body1.copyWith( + color: Colors.blue + ), ) ], ); diff --git a/lib/entities/entity_page_layout.widget.dart b/lib/entities/entity_page_layout.widget.dart index 209445d..228596f 100644 --- a/lib/entities/entity_page_layout.widget.dart +++ b/lib/entities/entity_page_layout.widget.dart @@ -25,10 +25,8 @@ class EntityPageLayout extends StatelessWidget { padding: EdgeInsets.only(left: 8), child: Text( entity.displayName, - style: TextStyle( - fontWeight: FontWeight.bold, - color: Colors.white, - fontSize: 22 + style: Theme.of(context).textTheme.headline.copyWith( + color: Colors.white ), ), ), diff --git a/lib/entities/light/widgets/light_controls.dart b/lib/entities/light/widgets/light_controls.dart index 13f45eb..86cb02b 100644 --- a/lib/entities/light/widgets/light_controls.dart +++ b/lib/entities/light/widgets/light_controls.dart @@ -183,7 +183,7 @@ class _LightControlsWidgetState extends State { } return UniversalSlider( title: "Color temperature", - leading: Text("Cold", style: TextStyle(color: Colors.lightBlue),), + leading: Text("Cold", style: Theme.of(context).textTheme.body1.copyWith(color: Colors.lightBlue)), value: val, onChangeEnd: (value) => _setColorTemp(entity, value), max: entity.maxMireds, @@ -194,7 +194,7 @@ class _LightControlsWidgetState extends State { _tmpColorTemp = value.round(); }); }, - closing: Text("Warm", style: TextStyle(color: Colors.amberAccent),), + closing: Text("Warm", style: Theme.of(context).textTheme.body1.copyWith(color: Colors.amberAccent),), ); } else { return Container(width: 0.0, height: 0.0); diff --git a/lib/entities/media_player/widgets/media_player_seek_bar.widget.dart b/lib/entities/media_player/widgets/media_player_seek_bar.widget.dart index edfb513..da8a36d 100644 --- a/lib/entities/media_player/widgets/media_player_seek_bar.widget.dart +++ b/lib/entities/media_player/widgets/media_player_seek_bar.widget.dart @@ -13,12 +13,6 @@ class _MediaPlayerSeekBarState extends State { double _currentPosition = 0; int _savedPosition = 0; - final TextStyle _seekTextStyle = TextStyle( - fontSize: 20, - color: Colors.blue, - fontWeight: FontWeight.bold - ); - @override initState() { super.initState(); @@ -79,7 +73,13 @@ class _MediaPlayerSeekBarState extends State { children: [ Text("00:00"), Expanded( - child: Text("${Duration(seconds: _currentPosition.toInt()).toString().split(".")[0]}",textAlign: TextAlign.center, style: _seekTextStyle), + child: Text( + "${Duration(seconds: _currentPosition.toInt()).toString().split(".")[0]}", + textAlign: TextAlign.center, + style: Theme.of(context).textTheme.title.copyWith( + color: Colors.blue + ) + ), ), Text("${Duration(seconds: entity.durationSeconds).toString().split(".")[0]}") ], diff --git a/lib/entities/media_player/widgets/media_player_widgets.dart b/lib/entities/media_player/widgets/media_player_widgets.dart index 4e9c9fb..773fb5e 100644 --- a/lib/entities/media_player/widgets/media_player_widgets.dart +++ b/lib/entities/media_player/widgets/media_player_widgets.dart @@ -19,7 +19,7 @@ class MediaPlayerWidget extends StatelessWidget { right: 0.0, child: Container( color: Colors.black45, - child: _buildState(entity), + child: _buildState(entity, context), ), ), Positioned( @@ -35,12 +35,9 @@ class MediaPlayerWidget extends StatelessWidget { ); } - Widget _buildState(MediaPlayerEntity entity) { - TextStyle style = TextStyle( - fontSize: 14.0, - color: Colors.white, - fontWeight: FontWeight.normal, - height: 1.2 + Widget _buildState(MediaPlayerEntity entity, BuildContext context) { + TextStyle style = Theme.of(context).textTheme.body1.copyWith( + color: Colors.white ); List states = []; states.add(Text("${entity.displayName}", style: style)); diff --git a/lib/entities/vacuum/widgets/vacuum_state_button.dart b/lib/entities/vacuum/widgets/vacuum_state_button.dart index 7f25db8..c151419 100644 --- a/lib/entities/vacuum/widgets/vacuum_state_button.dart +++ b/lib/entities/vacuum/widgets/vacuum_state_button.dart @@ -27,10 +27,7 @@ class VacuumStateButton extends StatelessWidget { text: "RETURN TO DOCK" ); } else { - result = Text(entity.state.toUpperCase(), style: TextStyle( - fontSize: 16, - color: Colors.grey - )); + result = Text(entity.state.toUpperCase(), style: Theme.of(context).textTheme.subhead); } return Padding( padding: EdgeInsets.only(right: 15), diff --git a/lib/main.dart b/lib/main.dart index aebf7e8..8ce3609 100644 --- a/lib/main.dart +++ b/lib/main.dart @@ -262,7 +262,9 @@ class _HAClientAppState extends State { title: new Text("Login with HA"), actions: [ FlatButton( - child: Text("Manual", style: TextStyle(color: Colors.white)), + child: Text("Manual", style: Theme.of(context).textTheme.button.copyWith( + decoration: TextDecoration.underline + )), onPressed: () { eventBus.fire(ShowPageEvent(path: "/connection-settings", goBackFirst: true)); }, diff --git a/lib/managers/theme_manager.dart b/lib/managers/theme_manager.dart index 9db9b8f..0263595 100644 --- a/lib/managers/theme_manager.dart +++ b/lib/managers/theme_manager.dart @@ -14,7 +14,7 @@ class HAClientTheme { HAClientTheme._internal(); final ThemeData lightTheme = ThemeData.light().copyWith( - primaryColor: Colors.blue, + //primaryColor: Colors.blue, textTheme: ThemeData.light().textTheme.copyWith( display1: TextStyle(fontSize: 34, fontWeight: FontWeight.normal, color: Colors.black54), display2: TextStyle(fontSize: 34, fontWeight: FontWeight.normal, color: Colors.redAccent), @@ -24,8 +24,14 @@ class HAClientTheme { body1: TextStyle(fontSize: 15, fontWeight: FontWeight.normal, color: defaultFontColor), body2: TextStyle(fontSize: 15, fontWeight: FontWeight.w500, color: defaultFontColor), subtitle: TextStyle(fontSize: 15, fontWeight: FontWeight.w500, color: Colors.black45), - caption: TextStyle(fontSize: 14, fontWeight: FontWeight.normal, color: Colors.black26), - overline: TextStyle(fontSize: 10, fontWeight: FontWeight.normal, color: Colors.black26), + caption: TextStyle(fontSize: 12, fontWeight: FontWeight.normal, color: Colors.black45), + overline: TextStyle( + fontSize: 10, + fontWeight: FontWeight.normal, + color: Colors.black26, + letterSpacing: 1, + ), + button: TextStyle(fontSize: 14, fontWeight: FontWeight.w500, color: Colors.white), ) ); diff --git a/lib/pages/integration_settings.page.dart b/lib/pages/integration_settings.page.dart index 7831795..6817776 100644 --- a/lib/pages/integration_settings.page.dart +++ b/lib/pages/integration_settings.page.dart @@ -121,9 +121,8 @@ class _IntegrationSettingsPageState extends State { onTap: () => Launcher.launchURLInCustomTab(context: context, url: "http://ha-client.app/docs#location-tracking"), child: Text( "Please read documentation!", - style: TextStyle( + style: Theme.of(context).textTheme.subhead.copyWith( color: Colors.blue, - fontSize: 16, decoration: TextDecoration.underline ) ), @@ -180,13 +179,13 @@ class _IntegrationSettingsPageState extends State { RaisedButton( color: Colors.blue, onPressed: () => updateRegistration(), - child: Text("Check integration", style: TextStyle(color: Colors.white)) + child: Text("Check integration", style: Theme.of(context).textTheme.button) ), Container(width: 10.0,), RaisedButton( color: Colors.redAccent, onPressed: () => resetRegistration(), - child: Text("Reset integration", style: TextStyle(color: Colors.white)) + child: Text("Reset integration", style: Theme.of(context).textTheme.button) ) ], ), diff --git a/lib/pages/main/main.page.dart b/lib/pages/main/main.page.dart index 0606a85..5b617a8 100644 --- a/lib/pages/main/main.page.dart +++ b/lib/pages/main/main.page.dart @@ -347,11 +347,10 @@ class _MainPageState extends State with WidgetsBindingObserver, Ticker accountName: Text(HomeAssistant().userName), accountEmail: Text(HomeAssistant().locationName ?? ""), currentAccountPicture: CircleAvatar( + backgroundColor: Theme.of(context).backgroundColor, child: Text( HomeAssistant().userAvatarText, - style: TextStyle( - fontSize: 32.0 - ), + style: Theme.of(context).textTheme.display1 ), ), ) @@ -360,21 +359,7 @@ class _MainPageState extends State with WidgetsBindingObserver, Ticker HomeAssistant().panels.forEach((Panel panel) { if (!panel.isHidden) { menuItems.add( - new ListTile( - leading: Icon(MaterialDesignIcons.getIconDataFromIconName(panel.icon)), - title: Row( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - Text("${panel.title}"), - Container(width: 4.0,), - panel.isWebView ? Text("webview", style: TextStyle(fontSize: 8.0, color: Colors.black45),) : Container(width: 1.0,) - ], - ), - onTap: () { - Navigator.of(context).pop(); - panel.handleOpen(context); - } - ) + panel.getMenuItemWidget(context) ); } }); @@ -458,9 +443,9 @@ class _MainPageState extends State with WidgetsBindingObserver, Ticker }, child: Text( "ha-client.app", - style: TextStyle( - color: Colors.blue, - decoration: TextDecoration.underline + style: Theme.of(context).textTheme.body1.copyWith( + color: Colors.blue, + decoration: TextDecoration.underline, ), ), ), @@ -474,9 +459,9 @@ class _MainPageState extends State with WidgetsBindingObserver, Ticker }, child: Text( "Terms and Conditions", - style: TextStyle( - color: Colors.blue, - decoration: TextDecoration.underline + style: Theme.of(context).textTheme.body1.copyWith( + color: Colors.blue, + decoration: TextDecoration.underline, ), ), ), @@ -490,9 +475,9 @@ class _MainPageState extends State with WidgetsBindingObserver, Ticker }, child: Text( "Privacy Policy", - style: TextStyle( - color: Colors.blue, - decoration: TextDecoration.underline + style: Theme.of(context).textTheme.body1.copyWith( + color: Colors.blue, + decoration: TextDecoration.underline, ), ), ) @@ -648,9 +633,9 @@ class _MainPageState extends State with WidgetsBindingObserver, Ticker activePlayers.map((entity) => PopupMenuItem( child: Text( "${entity.displayName}", - style: TextStyle( + style: Theme.of(context).textTheme.body1.copyWith( color: EntityColor.stateColor(entity.state) - ), + ) ), value: "${entity.entityId}", )).toList() @@ -679,7 +664,12 @@ class _MainPageState extends State with WidgetsBindingObserver, Ticker shape: BoxShape.circle, ), child: Center( - child: Text("$playersCount", style: TextStyle(fontSize: 12)), + child: Text( + "$playersCount", + style: Theme.of(context).textTheme.caption.copyWith( + color: Colors.white + ) + ), ), ), ) @@ -697,7 +687,7 @@ class _MainPageState extends State with WidgetsBindingObserver, Ticker mainAxisAlignment: MainAxisAlignment.center, children: [ FlatButton( - child: Text("Login with Home Assistant", style: TextStyle(fontSize: 16.0, color: Colors.white)), + child: Text("Login with Home Assistant", style: Theme.of(context).textTheme.button), color: Colors.blue, onPressed: () => _fullLoad(), ) diff --git a/lib/pages/play_media.page.dart b/lib/pages/play_media.page.dart index e1c170d..a3a3ed5 100644 --- a/lib/pages/play_media.page.dart +++ b/lib/pages/play_media.page.dart @@ -135,7 +135,9 @@ class _PlayMediaPageState extends State { if (_validationMessage.isNotEmpty) { children.add(Text( "$_validationMessage", - style: TextStyle(color: Colors.red) + style: Theme.of(context).textTheme.body1.copyWith( + color: Theme.of(context).errorColor + ) )); } children.addAll([ @@ -193,9 +195,9 @@ class _PlayMediaPageState extends State { }, child: Text( "How?", - style: TextStyle( - color: Colors.blue, - decoration: TextDecoration.underline + style: Theme.of(context).textTheme.body1.copyWith( + color: Colors.blue, + decoration: TextDecoration.underline ), ), ), diff --git a/lib/pages/settings.page.dart b/lib/pages/settings.page.dart index e1c984a..5aafa77 100644 --- a/lib/pages/settings.page.dart +++ b/lib/pages/settings.page.dart @@ -138,10 +138,7 @@ class _ConnectionSettingsPageState extends State { children: [ Text( "Connection settings", - style: TextStyle( - color: Colors.black45, - fontSize: 20.0 - ), + style: Theme.of(context).textTheme.headline, ), new Row( children: [ @@ -176,16 +173,13 @@ class _ConnectionSettingsPageState extends State { ), new Text( "Try ports 80 and 443 if default is not working and you don't know why.", - style: TextStyle(color: Colors.grey), + style: Theme.of(context).textTheme.caption, ), Padding( padding: EdgeInsets.only(top: 20.0), child: Text( "UI", - style: TextStyle( - color: Colors.black45, - fontSize: 20.0 - ), + style: Theme.of(context).textTheme.headline, ), ), new Row( @@ -203,15 +197,14 @@ class _ConnectionSettingsPageState extends State { ), Text( "Authentication settings", - style: TextStyle( - color: Colors.black45, - fontSize: 20.0 - ), + style: Theme.of(context).textTheme.headline, ), Container(height: 10.0,), Text( "You can leave this field blank to make app generate new long-lived token automatically by asking you to login to your Home Assistant. Use this field only if you still want to use manually generated long-lived token. Leave it blank if you don't understand what we are talking about.", - style: TextStyle(color: Colors.redAccent), + style: Theme.of(context).textTheme.body1.copyWith( + color: Colors.redAccent + ), ), new TextField( decoration: InputDecoration( diff --git a/lib/pages/widgets/page_loading_error.dart b/lib/pages/widgets/page_loading_error.dart index 4b8ea7a..45c14f4 100644 --- a/lib/pages/widgets/page_loading_error.dart +++ b/lib/pages/widgets/page_loading_error.dart @@ -23,7 +23,7 @@ class PageLoadingError extends StatelessWidget { size: 48.0 ) ), - Text(this.errorText, style: TextStyle(color: Colors.black45)) + Text(this.errorText, style: Theme.of(context).textTheme.subtitle) ], ) ], diff --git a/lib/pages/widgets/page_loading_indicator.dart b/lib/pages/widgets/page_loading_indicator.dart index 1ca969c..1777a02 100644 --- a/lib/pages/widgets/page_loading_indicator.dart +++ b/lib/pages/widgets/page_loading_indicator.dart @@ -14,7 +14,7 @@ class PageLoadingIndicator extends StatelessWidget { padding: EdgeInsets.only(top: 40.0, bottom: 20.0), child: CircularProgressIndicator() ), - Text("Loading...", style: TextStyle(color: Colors.black45)) + Text("Loading...", style: Theme.of(context).textTheme.subtitle) ], ) ], diff --git a/lib/pages/widgets/product_purchase.widget.dart b/lib/pages/widgets/product_purchase.widget.dart index 692e03f..3317ec9 100644 --- a/lib/pages/widgets/product_purchase.widget.dart +++ b/lib/pages/widgets/product_purchase.widget.dart @@ -40,10 +40,7 @@ class ProductPurchase extends StatelessWidget { children: [ Text( "${product.title}", - style: TextStyle( - fontWeight: FontWeight.bold, - fontSize: 16.0 - ), + style: Theme.of(context).textTheme.body2, ), Container(height: Sizes.rowPadding,), Text( @@ -53,7 +50,9 @@ class ProductPurchase extends StatelessWidget { softWrap: true, ), Container(height: Sizes.rowPadding,), - Text("${product.price} $period", style: TextStyle(color: priceColor)), + Text("${product.price} $period", style: Theme.of(context).textTheme.body1.copyWith( + color: priceColor + )), ], ) ), @@ -61,7 +60,7 @@ class ProductPurchase extends StatelessWidget { Expanded( flex: 2, child: RaisedButton( - child: Text(this.purchased ? buttonTextInactive : buttonText, style: TextStyle(color: Colors.white)), + child: Text(this.purchased ? buttonTextInactive : buttonText, style: Theme.of(context).textTheme.button), color: Colors.blue, onPressed: this.purchased ? null : () => this.onBuy(this.product), ), diff --git a/lib/panels/panel_class.dart b/lib/panels/panel_class.dart index d2dbd9b..df89b05 100644 --- a/lib/panels/panel_class.dart +++ b/lib/panels/panel_class.dart @@ -56,7 +56,7 @@ class Panel { children: [ Text("${this.title}"), Container(width: 4.0,), - isWebView ? Text("webview", style: TextStyle(fontSize: 8.0, color: Colors.black45),) : Container(width: 1.0,) + isWebView ? Text("webview", style: Theme.of(context).textTheme.overline) : Container(width: 1.0,) ], ), onTap: () { diff --git a/lib/plugins/history_chart/history_control_widget.dart b/lib/plugins/history_chart/history_control_widget.dart index c8fbb18..907f917 100644 --- a/lib/plugins/history_chart/history_control_widget.dart +++ b/lib/plugins/history_chart/history_control_widget.dart @@ -28,7 +28,7 @@ class HistoryControlWidget extends StatelessWidget { Expanded( child: Padding( padding: EdgeInsets.only(right: 10.0), - child: _buildStates(), + child: _buildStates(context), ), ), _buildTime(), @@ -46,18 +46,16 @@ class HistoryControlWidget extends StatelessWidget { } } - Widget _buildStates() { + Widget _buildStates(BuildContext context) { List children = []; for (int i = 0; i < selectedStates.length; i++) { children.add( Text( "${selectedStates[i] ?? '-'}", textAlign: TextAlign.right, - style: TextStyle( - fontWeight: FontWeight.bold, - color: EntityColor.historyStateColor(selectedStates[i], colorIndexes[i]), - fontSize: 22.0 - ), + style: Theme.of(context).textTheme.title.copyWith( + color: EntityColor.historyStateColor(selectedStates[i], colorIndexes[i]) + ) ) ); }