WIP Themes: New light theme
This commit is contained in:
parent
37c721e4f6
commit
d6f7096055
@ -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":
|
||||
{
|
||||
|
@ -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];
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
@ -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)
|
||||
),
|
||||
);
|
||||
}
|
||||
|
@ -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,
|
||||
)
|
||||
)
|
||||
);
|
||||
|
@ -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)),
|
||||
);
|
||||
}
|
||||
|
||||
|
@ -94,7 +94,7 @@ class MediaPlayerWidget extends StatelessWidget {
|
||||
Icon(
|
||||
MaterialDesignIcons.getIconDataFromIconName("mdi:movie"),
|
||||
size: 150.0,
|
||||
color: EntityColor.stateColor("$state"),
|
||||
color: HAClientTheme().stateColor("$state"),
|
||||
)
|
||||
],
|
||||
);
|
||||
|
@ -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';
|
||||
|
@ -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];
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
@ -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),),
|
||||
],
|
||||
),
|
||||
);
|
||||
|
@ -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(),
|
||||
|
@ -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])
|
||||
)
|
||||
)
|
||||
);
|
||||
|
@ -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,
|
||||
|
@ -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,
|
||||
|
Reference in New Issue
Block a user