Widget rendering improvements
This commit is contained in:
parent
513bf85cae
commit
16c06a2d48
@ -19,6 +19,7 @@ class HACard {
|
||||
String unit;
|
||||
int min;
|
||||
int max;
|
||||
int depth;
|
||||
Map severity;
|
||||
|
||||
HACard({
|
||||
@ -37,6 +38,7 @@ class HACard {
|
||||
this.unit,
|
||||
this.min,
|
||||
this.max,
|
||||
this.depth: 1,
|
||||
this.severity,
|
||||
@required this.type
|
||||
}) {
|
||||
|
@ -87,12 +87,14 @@ class CardWidget extends StatelessWidget {
|
||||
child: childCard.build(context),
|
||||
)
|
||||
).toList();
|
||||
return Row(
|
||||
return IntrinsicHeight(
|
||||
child: Row(
|
||||
mainAxisSize: MainAxisSize.max,
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||
children: children,
|
||||
);
|
||||
),
|
||||
);
|
||||
}
|
||||
return Container(height: 0.0, width: 0.0,);
|
||||
}
|
||||
@ -237,52 +239,48 @@ class CardWidget extends StatelessWidget {
|
||||
if (entitiesToShow.isEmpty && !card.showEmpty) {
|
||||
return Container(height: 0.0, width: 0.0,);
|
||||
}
|
||||
List<Widget> rows = [];
|
||||
rows.add(CardHeader(name: card.name));
|
||||
|
||||
int columnsCount = entitiesToShow.length >= card.columnsCount ? card.columnsCount : entitiesToShow.length;
|
||||
|
||||
rows.add(
|
||||
Padding(
|
||||
padding: EdgeInsets.only(bottom: Sizes.rowPadding, top: Sizes.rowPadding),
|
||||
child: FractionallySizedBox(
|
||||
widthFactor: 1,
|
||||
child: LayoutBuilder(
|
||||
builder: (BuildContext context, BoxConstraints constraints) {
|
||||
List<Widget> buttons = [];
|
||||
double buttonWidth = constraints.maxWidth / columnsCount;
|
||||
entitiesToShow.forEach((EntityWrapper entity) {
|
||||
buttons.add(
|
||||
SizedBox(
|
||||
width: buttonWidth,
|
||||
child: EntityModel(
|
||||
entityWrapper: entity,
|
||||
child: GlanceCardEntityContainer(
|
||||
showName: card.showName,
|
||||
showState: card.showState,
|
||||
),
|
||||
handleTap: true
|
||||
),
|
||||
)
|
||||
);
|
||||
});
|
||||
return Wrap(
|
||||
//spacing: 5.0,
|
||||
//alignment: WrapAlignment.spaceEvenly,
|
||||
runSpacing: Sizes.doubleRowPadding,
|
||||
children: buttons,
|
||||
);
|
||||
}
|
||||
),
|
||||
),
|
||||
int length = entitiesToShow.length;
|
||||
int columnsCount = length >= card.columnsCount ? card.columnsCount : entitiesToShow.length;
|
||||
int rowsCount = (length / columnsCount).round();
|
||||
List<TableRow> rows = [];
|
||||
for (int i = 0; i < rowsCount; i++) {
|
||||
int start = i*columnsCount;
|
||||
int end = start + math.min(columnsCount, length - start);
|
||||
List<Widget> rowChildren = [];
|
||||
rowChildren.addAll(entitiesToShow.sublist(
|
||||
start, end
|
||||
).map(
|
||||
(EntityWrapper entity){
|
||||
return EntityModel(
|
||||
entityWrapper: entity,
|
||||
child: GlanceCardEntityContainer(
|
||||
showName: card.showName,
|
||||
showState: card.showState,
|
||||
),
|
||||
handleTap: true
|
||||
);
|
||||
}
|
||||
).toList()
|
||||
);
|
||||
while (rowChildren.length < columnsCount) {
|
||||
rowChildren.add(
|
||||
Container()
|
||||
);
|
||||
}
|
||||
rows.add(
|
||||
TableRow(
|
||||
children: rowChildren
|
||||
)
|
||||
);
|
||||
);
|
||||
}
|
||||
|
||||
return Card(
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: rows
|
||||
child: Padding(
|
||||
padding: EdgeInsets.symmetric(vertical: Sizes.rowPadding),
|
||||
child: Table(
|
||||
children: rows
|
||||
)
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
@ -303,6 +301,7 @@ class CardWidget extends StatelessWidget {
|
||||
child: EntityModel(
|
||||
entityWrapper: card.linkedEntityWrapper,
|
||||
child: EntityButtonCardBody(
|
||||
depth: card.depth,
|
||||
showName: card.showName,
|
||||
),
|
||||
handleTap: true
|
||||
|
@ -3,9 +3,10 @@ part of '../../main.dart';
|
||||
class EntityButtonCardBody extends StatelessWidget {
|
||||
|
||||
final bool showName;
|
||||
final int depth;
|
||||
|
||||
EntityButtonCardBody({
|
||||
Key key, this.showName: true,
|
||||
Key key, this.showName: true, @required this.depth
|
||||
}) : super(key: key);
|
||||
|
||||
@override
|
||||
@ -17,27 +18,20 @@ class EntityButtonCardBody extends StatelessWidget {
|
||||
if (entityWrapper.entity.statelessType > StatelessEntityType.MISSED) {
|
||||
return Container(width: 0.0, height: 0.0,);
|
||||
}
|
||||
|
||||
double widthBase = math.min(MediaQuery.of(context).size.width, MediaQuery.of(context).size.height) / 6;
|
||||
return InkWell(
|
||||
onTap: () => entityWrapper.handleTap(),
|
||||
onLongPress: () => entityWrapper.handleHold(),
|
||||
onDoubleTap: () => entityWrapper.handleDoubleTap(),
|
||||
child: FractionallySizedBox(
|
||||
widthFactor: 1,
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: <Widget>[
|
||||
LayoutBuilder(
|
||||
builder: (BuildContext context, BoxConstraints constraints) {
|
||||
return EntityIcon(
|
||||
padding: EdgeInsets.fromLTRB(2.0, 6.0, 2.0, 2.0),
|
||||
size: constraints.maxWidth / 2.5,
|
||||
);
|
||||
}
|
||||
),
|
||||
_buildName()
|
||||
],
|
||||
),
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: <Widget>[
|
||||
EntityIcon(
|
||||
padding: EdgeInsets.fromLTRB(2.0, 6.0, 2.0, 2.0),
|
||||
size: widthBase / (depth * 0.5),
|
||||
),
|
||||
_buildName()
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
@ -94,75 +94,61 @@ class GaugeCardBody extends StatelessWidget {
|
||||
onDoubleTap: () => entityWrapper.handleDoubleTap(),
|
||||
child: AspectRatio(
|
||||
aspectRatio: 2,
|
||||
child: LayoutBuilder(
|
||||
builder: (BuildContext context, BoxConstraints constraints) {
|
||||
double fontSizeFactor;
|
||||
if (constraints.maxWidth > 300.0) {
|
||||
fontSizeFactor = 1.6;
|
||||
} else if (constraints.maxWidth > 150.0) {
|
||||
fontSizeFactor = 1;
|
||||
} else if (constraints.maxWidth > 100.0) {
|
||||
fontSizeFactor = 0.6;
|
||||
} else {
|
||||
fontSizeFactor = 0.4;
|
||||
}
|
||||
return SfRadialGauge(
|
||||
axes: <RadialAxis>[
|
||||
RadialAxis(
|
||||
maximum: max.toDouble(),
|
||||
minimum: 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: Theme.of(context).textTheme.body1.fontSize * fontSizeFactor
|
||||
),
|
||||
),
|
||||
child: SfRadialGauge(
|
||||
axes: <RadialAxis>[
|
||||
RadialAxis(
|
||||
maximum: max.toDouble(),
|
||||
minimum: 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: Theme.of(context).textTheme.body1.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: Theme.of(context).textTheme.title.fontSize * fontSizeFactor,
|
||||
),
|
||||
),
|
||||
)
|
||||
],
|
||||
startAngle: 180,
|
||||
endAngle: 0,
|
||||
pointers: <GaugePointer>[
|
||||
RangePointer(
|
||||
value: fixedValue,
|
||||
sizeUnit: GaugeSizeUnit.factor,
|
||||
width: 0.3,
|
||||
color: currentColor,
|
||||
enableAnimation: true,
|
||||
animationType: AnimationType.bounceOut,
|
||||
)
|
||||
]
|
||||
),
|
||||
),
|
||||
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: Theme.of(context).textTheme.title.fontSize,
|
||||
),
|
||||
),
|
||||
)
|
||||
],
|
||||
);
|
||||
},
|
||||
),
|
||||
startAngle: 180,
|
||||
endAngle: 0,
|
||||
pointers: <GaugePointer>[
|
||||
RangePointer(
|
||||
value: fixedValue,
|
||||
sizeUnit: GaugeSizeUnit.factor,
|
||||
width: 0.3,
|
||||
color: currentColor,
|
||||
enableAnimation: true,
|
||||
animationType: AnimationType.bounceOut,
|
||||
)
|
||||
]
|
||||
)
|
||||
],
|
||||
)
|
||||
),
|
||||
);
|
||||
}
|
||||
|
@ -1,5 +1,6 @@
|
||||
import 'dart:convert';
|
||||
import 'dart:async';
|
||||
import 'dart:math' as math;
|
||||
import 'package:flutter/foundation.dart';
|
||||
import 'package:flutter/rendering.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
|
@ -33,10 +33,10 @@ class HAView {
|
||||
});
|
||||
}
|
||||
|
||||
cards.addAll(_createLovelaceCards(rawData["cards"] ?? []));
|
||||
cards.addAll(_createLovelaceCards(rawData["cards"] ?? [], 1));
|
||||
}
|
||||
|
||||
List<HACard> _createLovelaceCards(List rawCards) {
|
||||
List<HACard> _createLovelaceCards(List rawCards, int depth) {
|
||||
List<HACard> result = [];
|
||||
rawCards.forEach((rawCard){
|
||||
try {
|
||||
@ -58,10 +58,11 @@ class HAView {
|
||||
min: rawCardInfo['min'] ?? 0,
|
||||
max: rawCardInfo['max'] ?? 100,
|
||||
unit: rawCardInfo['unit'],
|
||||
depth: depth,
|
||||
severity: rawCardInfo['severity']
|
||||
);
|
||||
if (rawCardInfo["cards"] != null) {
|
||||
card.childCards = _createLovelaceCards(rawCardInfo["cards"]);
|
||||
card.childCards = _createLovelaceCards(rawCardInfo["cards"], depth + 1);
|
||||
}
|
||||
var rawEntities = rawCard["entities"] ?? rawCardInfo["entities"];
|
||||
rawEntities?.forEach((rawEntity) {
|
||||
|
@ -26,6 +26,11 @@ class ViewWidget extends StatelessWidget {
|
||||
} else {
|
||||
cardsContainer = Container();
|
||||
}
|
||||
return ListView(
|
||||
shrinkWrap: false,
|
||||
padding: EdgeInsets.all(0),
|
||||
children: this.view.cards.map((card) => card.build(context)).toList()
|
||||
);
|
||||
return ListView(
|
||||
shrinkWrap: true,
|
||||
padding: EdgeInsets.all(0),
|
||||
|
Reference in New Issue
Block a user