Gauge card elements scale fix
This commit is contained in:
parent
0dc12963f0
commit
d715aaf5e5
@ -3,7 +3,6 @@ part of '../main.dart';
|
||||
class CardData {
|
||||
|
||||
String type;
|
||||
final int depth;
|
||||
List<EntityWrapper> entities = [];
|
||||
List conditions;
|
||||
bool showEmpty;
|
||||
@ -11,22 +10,22 @@ class CardData {
|
||||
|
||||
EntityWrapper get entity => entities.isNotEmpty ? entities[0] : null;
|
||||
|
||||
factory CardData.parse(Map<String, dynamic> rawData, {depth: 1}) {
|
||||
factory CardData.parse(Map<String, dynamic> rawData) {
|
||||
switch (rawData['type']) {
|
||||
case CardType.ENTITIES:
|
||||
return EntitiesCardData(rawData, depth: depth);
|
||||
return EntitiesCardData(rawData);
|
||||
break;
|
||||
case CardType.ALARM_PANEL:
|
||||
return AlarmPanelCardData(rawData, depth: depth);
|
||||
return AlarmPanelCardData(rawData);
|
||||
break;
|
||||
case CardType.BUTTON:
|
||||
return ButtonCardData(rawData, depth: depth);
|
||||
return ButtonCardData(rawData);
|
||||
break;
|
||||
case CardType.ENTITY_BUTTON:
|
||||
return ButtonCardData(rawData, depth: depth);
|
||||
return ButtonCardData(rawData);
|
||||
break;
|
||||
case CardType.CONDITIONAL:
|
||||
return CardData.parse(rawData['card'], depth: depth);
|
||||
return CardData.parse(rawData['card']);
|
||||
break;
|
||||
case CardType.ENTITY_FILTER:
|
||||
Map<String, dynamic> cardData = Map.from(rawData);
|
||||
@ -35,38 +34,38 @@ class CardData {
|
||||
cardData.addAll(rawData['card']);
|
||||
}
|
||||
cardData['type'] ??= CardType.ENTITIES;
|
||||
return CardData.parse(cardData, depth: depth);
|
||||
return CardData.parse(cardData);
|
||||
break;
|
||||
case CardType.GAUGE:
|
||||
return GaugeCardData(rawData, depth: depth);
|
||||
return GaugeCardData(rawData);
|
||||
break;
|
||||
case CardType.GLANCE:
|
||||
return GlanceCardData(rawData, depth: depth);
|
||||
return GlanceCardData(rawData);
|
||||
break;
|
||||
case CardType.HORIZONTAL_STACK:
|
||||
return HorizontalStackCardData(rawData, depth: depth);
|
||||
return HorizontalStackCardData(rawData);
|
||||
break;
|
||||
case CardType.VERTICAL_STACK:
|
||||
return VerticalStackCardData(rawData, depth: depth);
|
||||
return VerticalStackCardData(rawData);
|
||||
break;
|
||||
case CardType.MARKDOWN:
|
||||
return MarkdownCardData(rawData, depth: depth);
|
||||
return MarkdownCardData(rawData);
|
||||
break;
|
||||
case CardType.MEDIA_CONTROL:
|
||||
return MediaControlCardData(rawData, depth: depth);
|
||||
return MediaControlCardData(rawData);
|
||||
break;
|
||||
default:
|
||||
if (rawData.containsKey('entities')) {
|
||||
return EntitiesCardData(rawData, depth: depth);
|
||||
return EntitiesCardData(rawData);
|
||||
} else if (rawData.containsKey('entity')) {
|
||||
rawData['entities'] = [rawData['entity']];
|
||||
return EntitiesCardData(rawData, depth: depth);
|
||||
return EntitiesCardData(rawData);
|
||||
}
|
||||
return CardData(rawData, depth: depth);
|
||||
return CardData(rawData);
|
||||
}
|
||||
}
|
||||
|
||||
CardData(Map<String, dynamic> rawData, {this.depth: 1}) {
|
||||
CardData(Map<String, dynamic> rawData) {
|
||||
type = rawData['type'] ?? CardType.ENTITIES;
|
||||
conditions = rawData['conditions'] ?? [];
|
||||
showEmpty = rawData['show_empty'] ?? true;
|
||||
@ -160,7 +159,7 @@ class EntitiesCardData extends CardData {
|
||||
return EntitiesCard(card: this);
|
||||
}
|
||||
|
||||
EntitiesCardData(Map<String, dynamic> rawData, {int depth: 1}) : super(rawData, depth: depth) {
|
||||
EntitiesCardData(Map<String, dynamic> rawData) : super(rawData) {
|
||||
//Parsing card data
|
||||
title = rawData["title"];
|
||||
icon = rawData['icon'];
|
||||
@ -247,7 +246,7 @@ class AlarmPanelCardData extends CardData {
|
||||
return AlarmPanelCard(card: this);
|
||||
}
|
||||
|
||||
AlarmPanelCardData(Map<String, dynamic> rawData, {int depth: 1}) : super(rawData, depth: depth) {
|
||||
AlarmPanelCardData(Map<String, dynamic> rawData) : super(rawData) {
|
||||
//Parsing card data
|
||||
name = rawData['name'];
|
||||
states = rawData['states'];
|
||||
@ -274,18 +273,30 @@ class ButtonCardData extends CardData {
|
||||
String icon;
|
||||
bool showName;
|
||||
bool showIcon;
|
||||
double iconHeightPx = 0;
|
||||
double iconHeightRem = 0;
|
||||
|
||||
@override
|
||||
Widget buildCardWidget() {
|
||||
return EntityButtonCard(card: this);
|
||||
}
|
||||
|
||||
ButtonCardData(Map<String, dynamic> rawData, {int depth: 1}) : super(rawData, depth: depth) {
|
||||
ButtonCardData(Map<String, dynamic> rawData) : super(rawData) {
|
||||
//Parsing card data
|
||||
name = rawData['name'];
|
||||
icon = rawData['icon'];
|
||||
showName = rawData['show_name'] ?? true;
|
||||
showIcon = rawData['show_icon'] ?? true;
|
||||
if (rawData.containsKey('icon_height')) {
|
||||
String rawHeight = rawData['icon_height'];
|
||||
if (rawHeight.contains('px')) {
|
||||
iconHeightPx = double.tryParse(rawHeight.replaceFirst('px', '')) ?? 0;
|
||||
} else if (rawHeight.contains('rem')) {
|
||||
iconHeightRem = double.tryParse(rawHeight.replaceFirst('rem', '')) ?? 0;
|
||||
} else if (rawHeight.contains('em')) {
|
||||
iconHeightRem = double.tryParse(rawHeight.replaceFirst('em', '')) ?? 0;
|
||||
}
|
||||
}
|
||||
//Parsing entity
|
||||
var entitiId = rawData["entity"];
|
||||
if (entitiId != null && entitiId is String) {
|
||||
@ -330,7 +341,7 @@ class GaugeCardData extends CardData {
|
||||
return GaugeCard(card: this);
|
||||
}
|
||||
|
||||
GaugeCardData(Map<String, dynamic> rawData, {int depth: 1}) : super(rawData, depth: depth) {
|
||||
GaugeCardData(Map<String, dynamic> rawData) : super(rawData) {
|
||||
//Parsing card data
|
||||
name = rawData['name'];
|
||||
unit = rawData['unit'];
|
||||
@ -370,7 +381,7 @@ class GlanceCardData extends CardData {
|
||||
return GlanceCard(card: this);
|
||||
}
|
||||
|
||||
GlanceCardData(Map<String, dynamic> rawData, {int depth: 1}) : super(rawData, depth: depth) {
|
||||
GlanceCardData(Map<String, dynamic> rawData) : super(rawData) {
|
||||
//Parsing card data
|
||||
title = rawData["title"];
|
||||
showName = rawData['show_name'] ?? true;
|
||||
@ -417,10 +428,10 @@ class HorizontalStackCardData extends CardData {
|
||||
return HorizontalStackCard(card: this);
|
||||
}
|
||||
|
||||
HorizontalStackCardData(Map<String, dynamic> rawData, {int depth: 1}) : super(rawData, depth: depth) {
|
||||
HorizontalStackCardData(Map<String, dynamic> rawData) : super(rawData) {
|
||||
if (rawData.containsKey('cards')) {
|
||||
childCards = rawData['cards'].map<CardData>((childCard) {
|
||||
return CardData.parse(childCard, depth: this.depth + 1);
|
||||
return CardData.parse(childCard);
|
||||
}).toList();
|
||||
} else {
|
||||
childCards = [];
|
||||
@ -438,7 +449,7 @@ class VerticalStackCardData extends CardData {
|
||||
return VerticalStackCard(card: this);
|
||||
}
|
||||
|
||||
VerticalStackCardData(Map<String, dynamic> rawData, {int depth: 1}) : super(rawData, depth: depth) {
|
||||
VerticalStackCardData(Map<String, dynamic> rawData) : super(rawData) {
|
||||
if (rawData.containsKey('cards')) {
|
||||
childCards = rawData['cards'].map<CardData>((childCard) {
|
||||
return CardData.parse(childCard);
|
||||
@ -460,7 +471,7 @@ class MarkdownCardData extends CardData {
|
||||
return MarkdownCard(card: this);
|
||||
}
|
||||
|
||||
MarkdownCardData(Map<String, dynamic> rawData, {int depth: 1}) : super(rawData, depth: depth) {
|
||||
MarkdownCardData(Map<String, dynamic> rawData) : super(rawData) {
|
||||
//Parsing card data
|
||||
title = rawData['title'];
|
||||
content = rawData['content'];
|
||||
@ -475,7 +486,7 @@ class MediaControlCardData extends CardData {
|
||||
return MediaControlsCard(card: this);
|
||||
}
|
||||
|
||||
MediaControlCardData(Map<String, dynamic> rawData, {int depth: 1}) : super(rawData, depth: depth) {
|
||||
MediaControlCardData(Map<String, dynamic> rawData) : super(rawData) {
|
||||
var entitiId = rawData["entity"];
|
||||
if (entitiId != null && entitiId is String) {
|
||||
if (HomeAssistant().entities.isExist(entitiId)) {
|
||||
|
@ -20,15 +20,37 @@ class EntityButtonCard extends StatelessWidget {
|
||||
} else if (entityWrapper.entity.statelessType != StatelessEntityType.ghost && entityWrapper.entity.statelessType != StatelessEntityType.none) {
|
||||
return Container(width: 0.0, height: 0.0,);
|
||||
}
|
||||
double widthBase = math.min(MediaQuery.of(context).size.width, MediaQuery.of(context).size.height) / 6;
|
||||
|
||||
double iconSize = math.max(card.iconHeightPx, card.iconHeightRem * Theme.of(context).textTheme.body1.fontSize);
|
||||
|
||||
Widget buttonIcon;
|
||||
if (!card.showIcon) {
|
||||
buttonIcon = Container(height: Sizes.rowPadding, width: 10);
|
||||
} else if (iconSize > 0) {
|
||||
buttonIcon = SizedBox(
|
||||
height: iconSize,
|
||||
child: FractionallySizedBox(
|
||||
widthFactor: 0.5,
|
||||
child: FittedBox(
|
||||
fit: BoxFit.contain,
|
||||
child: EntityIcon(
|
||||
//padding: EdgeInsets.only(top: 6),
|
||||
),
|
||||
)
|
||||
),
|
||||
);
|
||||
} else {
|
||||
buttonIcon = EntityIcon(
|
||||
padding: EdgeInsets.fromLTRB(2.0, 6.0, 2.0, 2.0),
|
||||
size: widthBase / (card.depth * 0.5),
|
||||
buttonIcon = AspectRatio(
|
||||
aspectRatio: 2,
|
||||
child: FractionallySizedBox(
|
||||
widthFactor: 0.5,
|
||||
child: FittedBox(
|
||||
fit: BoxFit.fitWidth,
|
||||
child: EntityIcon(
|
||||
//padding: EdgeInsets.only(top: 6),
|
||||
),
|
||||
)
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
@ -45,7 +67,7 @@ class EntityButtonCard extends StatelessWidget {
|
||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||
children: <Widget>[
|
||||
buttonIcon,
|
||||
_buildName()
|
||||
_buildName(context)
|
||||
],
|
||||
)
|
||||
),
|
||||
@ -55,12 +77,13 @@ class EntityButtonCard extends StatelessWidget {
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildName() {
|
||||
Widget _buildName(BuildContext context) {
|
||||
if (card.showName) {
|
||||
return EntityName(
|
||||
padding: EdgeInsets.fromLTRB(Sizes.buttonPadding, 0.0, Sizes.buttonPadding, Sizes.rowPadding),
|
||||
textOverflow: TextOverflow.ellipsis,
|
||||
maxLines: 3,
|
||||
textStyle: Theme.of(context).textTheme.subhead,
|
||||
wordsWrap: true,
|
||||
textAlign: TextAlign.center
|
||||
);
|
||||
|
@ -97,9 +97,8 @@ class GaugeCard extends StatelessWidget {
|
||||
];
|
||||
}
|
||||
|
||||
double fontSize = 30 / card.depth;
|
||||
|
||||
return CardWrapper(
|
||||
padding: EdgeInsets.all(4),
|
||||
child: EntityModel(
|
||||
entityWrapper: entityWrapper,
|
||||
child: InkWell(
|
||||
@ -107,60 +106,65 @@ class GaugeCard extends StatelessWidget {
|
||||
onLongPress: () => entityWrapper.handleHold(),
|
||||
onDoubleTap: () => entityWrapper.handleDoubleTap(),
|
||||
child: AspectRatio(
|
||||
aspectRatio: 2,
|
||||
child: SfRadialGauge(
|
||||
axes: <RadialAxis>[
|
||||
RadialAxis(
|
||||
maximum: card.max.toDouble(),
|
||||
minimum: card.min.toDouble(),
|
||||
showLabels: false,
|
||||
useRangeColorForAxis: true,
|
||||
showTicks: false,
|
||||
canScaleToFit: true,
|
||||
ranges: ranges,
|
||||
axisLineStyle: AxisLineStyle(
|
||||
thickness: 0.3,
|
||||
thicknessUnit: GaugeSizeUnit.factor,
|
||||
color: Colors.transparent
|
||||
),
|
||||
annotations: <GaugeAnnotation>[
|
||||
GaugeAnnotation(
|
||||
angle: -90,
|
||||
positionFactor: 1.3,
|
||||
//verticalAlignment: GaugeAlignment.far,
|
||||
widget: EntityName(
|
||||
textStyle: Theme.of(context).textTheme.body1.copyWith(
|
||||
fontSize: fontSize
|
||||
),
|
||||
),
|
||||
),
|
||||
GaugeAnnotation(
|
||||
angle: 180,
|
||||
positionFactor: 0,
|
||||
verticalAlignment: GaugeAlignment.center,
|
||||
widget: SimpleEntityState(
|
||||
expanded: false,
|
||||
maxLines: 1,
|
||||
textAlign: TextAlign.center,
|
||||
textStyle: Theme.of(context).textTheme.title.copyWith(
|
||||
fontSize: fontSize,
|
||||
),
|
||||
aspectRatio: 1.8,
|
||||
child: Stack(
|
||||
alignment: Alignment.topCenter,
|
||||
children: <Widget>[
|
||||
SfRadialGauge(
|
||||
axes: <RadialAxis>[
|
||||
RadialAxis(
|
||||
maximum: card.max.toDouble(),
|
||||
minimum: card.min.toDouble(),
|
||||
showLabels: false,
|
||||
useRangeColorForAxis: true,
|
||||
showTicks: false,
|
||||
canScaleToFit: true,
|
||||
ranges: ranges,
|
||||
axisLineStyle: AxisLineStyle(
|
||||
thickness: 0.3,
|
||||
thicknessUnit: GaugeSizeUnit.factor,
|
||||
color: Colors.transparent
|
||||
),
|
||||
startAngle: 180,
|
||||
endAngle: 0,
|
||||
pointers: <GaugePointer>[
|
||||
RangePointer(
|
||||
value: fixedValue,
|
||||
sizeUnit: GaugeSizeUnit.factor,
|
||||
width: 0.3,
|
||||
color: currentColor,
|
||||
enableAnimation: true,
|
||||
animationType: AnimationType.bounceOut,
|
||||
)
|
||||
]
|
||||
)
|
||||
],
|
||||
startAngle: 180,
|
||||
endAngle: 0,
|
||||
pointers: <GaugePointer>[
|
||||
RangePointer(
|
||||
value: fixedValue,
|
||||
sizeUnit: GaugeSizeUnit.factor,
|
||||
width: 0.3,
|
||||
color: currentColor,
|
||||
enableAnimation: true,
|
||||
animationType: AnimationType.bounceOut,
|
||||
)
|
||||
]
|
||||
)
|
||||
),
|
||||
FractionallySizedBox(
|
||||
heightFactor: 0.2,
|
||||
widthFactor: 1,
|
||||
child: FittedBox(
|
||||
fit: BoxFit.fitHeight,
|
||||
child: EntityName(
|
||||
textStyle: Theme.of(context).textTheme.subhead
|
||||
),
|
||||
)
|
||||
),
|
||||
FractionallySizedBox(
|
||||
widthFactor: 0.4,
|
||||
heightFactor: 0.95,
|
||||
alignment: Alignment.bottomCenter,
|
||||
child: FittedBox(
|
||||
fit: BoxFit.fitWidth,
|
||||
alignment: Alignment.bottomCenter,
|
||||
child: SimpleEntityState(
|
||||
padding: EdgeInsets.all(0),
|
||||
expanded: false,
|
||||
maxLines: 1,
|
||||
textAlign: TextAlign.center
|
||||
),
|
||||
)
|
||||
),
|
||||
],
|
||||
)
|
||||
),
|
||||
|
@ -3,13 +3,17 @@ part of '../../main.dart';
|
||||
class CardWrapper extends StatelessWidget {
|
||||
|
||||
final Widget child;
|
||||
final EdgeInsets padding;
|
||||
|
||||
const CardWrapper({Key key, this.child}) : super(key: key);
|
||||
const CardWrapper({Key key, this.child, this.padding: const EdgeInsets.all(0)}) : super(key: key);
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Card(
|
||||
child: child,
|
||||
child: Padding(
|
||||
padding: padding,
|
||||
child: child
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
|
@ -50,13 +50,10 @@ class EntityIcon extends StatelessWidget {
|
||||
iconCode = getDefaultIconByEntityId(data.entity.entityId,
|
||||
data.entity.deviceClass, data.entity.state); //
|
||||
}
|
||||
return Padding(
|
||||
padding: EdgeInsets.fromLTRB(6.0, 6.0, 6.0, 6.0),
|
||||
child: Icon(
|
||||
IconData(iconCode, fontFamily: 'Material Design Icons'),
|
||||
size: size,
|
||||
color: color,
|
||||
)
|
||||
return Icon(
|
||||
IconData(iconCode, fontFamily: 'Material Design Icons'),
|
||||
size: size,
|
||||
color: color,
|
||||
);
|
||||
}
|
||||
|
||||
@ -66,8 +63,8 @@ class EntityIcon extends StatelessWidget {
|
||||
return Padding(
|
||||
padding: padding,
|
||||
child: buildIcon(
|
||||
entityWrapper,
|
||||
color ?? HAClientTheme().getColorByEntityState(entityWrapper.entity.state, context)
|
||||
entityWrapper,
|
||||
color ?? HAClientTheme().getColorByEntityState(entityWrapper.entity.state, context)
|
||||
),
|
||||
);
|
||||
}
|
||||
|
Reference in New Issue
Block a user