WIP Themes: New light theme

This commit is contained in:
Yegor Vialov 2020-04-04 20:54:32 +00:00
parent 37c721e4f6
commit d6f7096055
13 changed files with 107 additions and 98 deletions

View File

@ -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":
{

View File

@ -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];
}
}
}
}

View File

@ -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)
),
);
}

View File

@ -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,
)
)
);

View File

@ -33,7 +33,7 @@ class _MediaPlayerProgressBarState extends State<MediaPlayerProgressBar> {
return LinearProgressIndicator(
value: progress,
backgroundColor: Colors.black45,
valueColor: AlwaysStoppedAnimation<Color>(EntityColor.stateColor(EntityState.on)),
valueColor: AlwaysStoppedAnimation<Color>(HAClientTheme().stateColor(EntityState.on)),
);
}

View File

@ -94,7 +94,7 @@ class MediaPlayerWidget extends StatelessWidget {
Icon(
MaterialDesignIcons.getIconDataFromIconName("mdi:movie"),
size: 150.0,
color: EntityColor.stateColor("$state"),
color: HAClientTheme().stateColor("$state"),
)
],
);

View File

@ -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';

View File

@ -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];
}
}
}
}

View File

@ -634,7 +634,7 @@ class _MainPageState extends State<MainPage> 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<MainPage> with WidgetsBindingObserver, Ticker
bottomBarChildren.add(
CollectionScaleTransition(
children: <Widget>[
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),),
],
),
);

View File

@ -156,7 +156,7 @@ class _CombinedHistoryChartWidgetState extends State<CombinedHistoryChartWidget>
result.add(
new charts.Series<EntityHistoryMoment, DateTime>(
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<CombinedHistoryChartWidget>
new charts.Series<EntityHistoryMoment, DateTime>(
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(),

View File

@ -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])
)
)
);

View File

@ -108,7 +108,7 @@ class _NumericStateHistoryChartWidgetState extends State<NumericStateHistoryChar
return [
new charts.Series<EntityHistoryMoment, DateTime>(
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,

View File

@ -107,7 +107,7 @@ class _SimpleStateHistoryChartWidgetState extends State<SimpleStateHistoryChartW
new charts.Series<EntityHistoryMoment, DateTime>(
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<SimpleStateHistoryChartW
new charts.Series<EntityHistoryMoment, DateTime>(
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<SimpleStateHistoryChartW
new charts.Series<EntityHistoryMoment, DateTime>(
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,