enchantedwyf/tuiche
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

更新设备校准

Browse Source
This commit is contained in:
wyf
2025-06-03 09:00:01 +08:00
parent 7a816922fa
commit eed93bc6a4
30 changed files with 4257 additions and 1259 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
lib/pages/sleep_report/chart/LineChartByRange.dart
View File

@@ -1,3 +1,4 @@
import 'package:ef/ef.dart';
import 'package:flutter/material.dart';
import 'package:intl/intl.dart';
import 'package:vbvs_app/common/util/FitTool.dart';
@@ -480,7 +481,7 @@ class _LineChartByRangeState extends State<LineChartByRange> {
child: Text(
'${DateFormat('HH:mm').format(DateTime.fromMillisecondsSinceEpoch(selectedData!['startTime']))} - '
'${DateFormat('HH:mm').format(DateTime.fromMillisecondsSinceEpoch(selectedData!['endTime']))}\n'
'次数: ${selectedData!['times']}',
"时长".tr+ ' ${selectedData!['times']}',
style: TextStyle(
fontSize: 18.rpx,
color: Colors.white,

157
lib/pages/sleep_report/chart/SnoreChart.dart
View File

@@ -24,7 +24,7 @@ class BarData {
});
}
class BarChartWidget extends StatelessWidget {
class BarChartWidget extends StatefulWidget {
final List<BarData> data;
final int startTime; // 毫秒时间戳
final int endTime; // 毫秒时间戳
@@ -40,18 +40,59 @@ class BarChartWidget extends StatelessWidget {
this.yStepCount = 5,
});
@override
State<BarChartWidget> createState() => _BarChartWidgetState();
}
class _BarChartWidgetState extends State<BarChartWidget> {
BarData? selectedBar;
void _handleTapOrDrag(Offset localPosition, Size size) {
final chartWidth = size.width - 30.rpx;
final totalDuration = widget.endTime - widget.startTime;
for (final d in widget.data) {
final left =
((d.st - widget.startTime) / totalDuration) * chartWidth + 30.rpx;
final right =
((d.et - widget.startTime) / totalDuration) * chartWidth + 30.rpx;
if (localPosition.dx >= left && localPosition.dx <= right) {
setState(() {
selectedBar = d;
});
return;
}
}
setState(() {
selectedBar = null;
});
}
@override
Widget build(BuildContext context) {
return CustomPaint(
size: Size(double.infinity, 500.rpx),
painter: BarChartPainter(
data,
startTime,
endTime,
maxYValue: maxYValue,
yStepCount: yStepCount,
),
);
return LayoutBuilder(builder: (context, constraints) {
return GestureDetector(
behavior: HitTestBehavior.opaque,
onPanDown: (details) =>
_handleTapOrDrag(details.localPosition, constraints.biggest),
onPanUpdate: (details) =>
_handleTapOrDrag(details.localPosition, constraints.biggest),
onTapDown: (details) =>
_handleTapOrDrag(details.localPosition, constraints.biggest),
child: CustomPaint(
size: Size(double.infinity, 500.rpx),
painter: BarChartPainter(
widget.data,
widget.startTime,
widget.endTime,
maxYValue: widget.maxYValue,
yStepCount: widget.yStepCount,
selectedBar: selectedBar,
),
),
);
});
}
}
@@ -61,11 +102,11 @@ class BarChartPainter extends CustomPainter {
final int endTime;
final double maxYValue;
final int yStepCount;
final BarData? selectedBar;
final double topPadding = 0; // 控制顶部间距
final double bottomPadding = 0; // 控制底部间距
final double topPadding = 0;
final double bottomPadding = 0;
final double leftPadding = 30.rpx;
// final double labelHeight = 50.rpx;
BarChartPainter(
this.data,
@@ -73,6 +114,7 @@ class BarChartPainter extends CustomPainter {
this.endTime, {
required this.maxYValue,
this.yStepCount = 5,
this.selectedBar,
});
@override
@@ -84,19 +126,11 @@ class BarChartPainter extends CustomPainter {
final textPainter = TextPainter(textDirection: ui.TextDirection.ltr);
final stepValue = maxYValue / yStepCount;
// 绘制 Y 轴刻度线和文字
// Y轴刻度
for (int i = 0; i <= yStepCount; i++) {
final value = stepValue * i;
final y = topPadding + chartHeight - (value / maxYValue) * chartHeight;
// 横线
// canvas.drawLine(
// Offset(leftPadding, y),
// Offset(size.width, y),
// Paint()
// ..color = Colors.grey.withOpacity(0.3)
// ..strokeWidth = 0.5,
// );
final dashPaint = Paint()
..color = Colors.grey.withOpacity(0.5)
..strokeWidth = 0.5;
@@ -104,7 +138,6 @@ class BarChartPainter extends CustomPainter {
drawDashedLine(
canvas, Offset(leftPadding, y), Offset(size.width, y), dashPaint);
// Y轴刻度文字
textPainter.text = TextSpan(
text: value.toStringAsFixed(0),
style: TextStyle(
@@ -114,25 +147,21 @@ class BarChartPainter extends CustomPainter {
);
textPainter.layout();
textPainter.paint(
canvas,
Offset(
leftPadding - textPainter.width - 4, y - textPainter.height / 2));
canvas,
Offset(leftPadding - textPainter.width - 4, y - textPainter.height / 2),
);
}
// X轴时间刻度
// X轴刻度
final startDate = DateTime.fromMillisecondsSinceEpoch(startTime);
final endDate = DateTime.fromMillisecondsSinceEpoch(endTime);
final hourStep = const Duration(hours: 1);
final xPaint = Paint()..color = Colors.grey;
final xAxisY = topPadding + chartHeight;
// 绘制整点小时刻度
for (DateTime t = startDate; t.isBefore(endDate); t = t.add(hourStep)) {
final x = ((t.millisecondsSinceEpoch - startTime) / totalDuration) *
chartWidth +
leftPadding;
final timeLabel = (t == startDate || t == endDate)
? DateFormat('HH:mm').format(t)
: DateFormat('h').format(t);
@@ -148,7 +177,7 @@ class BarChartPainter extends CustomPainter {
textPainter.paint(canvas, Offset(x - textPainter.width / 2, xAxisY + 4));
}
// ✅ 强制绘制结束时间刻度（确保显示）
// 额外终点标签
final endX =
((endTime - startTime) / totalDuration) * chartWidth + leftPadding;
final endLabel = DateFormat('HH:mm').format(endDate);
@@ -162,7 +191,12 @@ class BarChartPainter extends CustomPainter {
textPainter.layout();
textPainter.paint(canvas, Offset(endX - textPainter.width / 2, xAxisY + 4));
// 绘制柱子
// 柱子绘制 & 提示信息缓存
Offset? tipOffset;
Size? tipSize;
String? tipText;
Color tipColor = Colors.black;
for (final d in data) {
final left =
((d.st - startTime) / totalDuration) * chartWidth + leftPadding;
@@ -172,9 +206,60 @@ class BarChartPainter extends CustomPainter {
final top = topPadding + chartHeight - barHeight;
final barPaint = Paint()..color = d.color;
canvas.drawRect(
Rect.fromLTRB(left, top, right, topPadding + chartHeight), barPaint);
Rect.fromLTRB(left, top, right, topPadding + chartHeight),
barPaint,
);
// 缓存 tip 信息
if (selectedBar == d) {
tipText =
'${d.name}\n${d.value.toStringAsFixed(1)}\n${MyUtils.formatToHHmm(d.st)}';
final tp = TextPainter(
text: TextSpan(
text: tipText,
style: TextStyle(fontSize: 16.rpx, color: Colors.white),
),
textAlign: TextAlign.center,
textDirection: ui.TextDirection.ltr,
);
tp.layout();
final tipWidth = tp.width + 20.rpx;
final tipHeight = tp.height + 10.rpx;
final tipLeft = left + (right - left) / 2 - tipWidth / 2;
final tipTop = top - tipHeight - 10.rpx;
tipOffset = Offset(tipLeft, tipTop);
tipSize = Size(tipWidth, tipHeight);
tipColor = Colors.black.withOpacity(0.8);
}
}
// 绘制 tip（在柱子之上）
if (tipText != null && tipOffset != null && tipSize != null) {
final rect = RRect.fromRectAndRadius(
Rect.fromLTWH(
tipOffset.dx, tipOffset.dy, tipSize.width, tipSize.height),
Radius.circular(8.rpx),
);
final tipBgPaint = Paint()..color = tipColor;
canvas.drawRRect(rect, tipBgPaint);
final tipTextPainter = TextPainter(
text: TextSpan(
text: tipText,
style: TextStyle(fontSize: 16.rpx, color: Colors.white),
),
textAlign: TextAlign.center,
textDirection: ui.TextDirection.ltr,
);
tipTextPainter.layout();
tipTextPainter.paint(
canvas,
Offset(tipOffset.dx + 10.rpx, tipOffset.dy + 5.rpx),
);
}
}

389
lib/pages/sleep_report/chart/TimeSeriesChart.dart
View File

@@ -1,243 +1,57 @@
import 'package:flutter/material.dart';
import 'package:fl_chart/fl_chart.dart';
import 'package:vbvs_app/common/color/appConstants.dart';
import 'package:vbvs_app/common/util/FitTool.dart';
import 'dart:math';
import 'package:vbvs_app/common/util/MyUtils.dart';
class TimeSeriesPoint {
final int timestamp;
final double value;
TimeSeriesPoint(this.timestamp, this.value);
}
class TimeSeriesChart extends StatelessWidget {
final int startTime;
final int startTime; // 毫秒时间戳
final int endTime;
final double yMin;
final double yMax;
final List<TimeSeriesPoint> dataPoints;
final double actYMin;
final double actYMax;
TimeSeriesChart({
const TimeSeriesChart({
Key? key,
required this.startTime,
required this.endTime,
required this.yMin,
required this.yMax,
required this.dataPoints,
required this.actYMin,
required this.actYMax,
});
@override
Widget build(BuildContext context) {
final midValue = (yMax + yMin) / 2;
final xLabels = _generateXLabels();
// Prepare spots and segments
List<FlSpot> spots = [];
List<Color> lineColors = [];
for (int i = 0; i < dataPoints.length; i++) {
final point = dataPoints[i];
final xValue = _convertTimeToXValue(point.timestamp);
final yValue = point.value;
spots.add(FlSpot(xValue, yValue));
if (yValue >= yMin && yValue <= yMax) {
lineColors.add(Colors.green); // Color for points within range
} else {
lineColors.add(Colors.red); // Color for points outside range
}
}
return AspectRatio(
aspectRatio: 2,
child: LineChart(
LineChartData(
lineTouchData: LineTouchData(
touchTooltipData: LineTouchTooltipData(
getTooltipItems: (List<LineBarSpot> touchedSpots) {
return touchedSpots.map((spot) {
final time = DateTime.fromMillisecondsSinceEpoch(
_convertXValueToTime(spot.x),
);
return LineTooltipItem(
'${time.hour.toString().padLeft(2, '0')}:${time.minute.toString().padLeft(2, '0')}\n${spot.y.toStringAsFixed(0)}',
const TextStyle(color: Colors.black),
);
}).toList();
},
),
),
gridData: FlGridData(
show: true,
drawVerticalLine: false,
getDrawingHorizontalLine: (value) {
if (value == 0) {
return FlLine(
color: themeController.currentColor.sc4,
strokeWidth: 1,
);
} else if (value == yMin) {
return FlLine(
color: themeController.currentColor.sc9,
strokeWidth: 1,
dashArray: [5, 5],
);
} else if (value == yMax) {
return FlLine(
color: themeController.currentColor.sc9,
strokeWidth: 1,
dashArray: [5, 5],
);
} else if (value == midValue) {
return FlLine(
color: themeController.currentColor.sc4,
strokeWidth: 1,
dashArray: [5, 5],
);
}
return FlLine(
color: Colors.grey.withOpacity(0.1),
strokeWidth: 1,
);
},
),
titlesData: FlTitlesData(
show: true,
rightTitles: AxisTitles(
sideTitles: SideTitles(showTitles: false),
),
topTitles: AxisTitles(
sideTitles: SideTitles(showTitles: false),
),
bottomTitles: AxisTitles(
sideTitles: SideTitles(
showTitles: true,
reservedSize: 30,
getTitlesWidget: (value, meta) {
final index = value.toInt();
if (index >= 0 && index < xLabels.length) {
return Padding(
padding: const EdgeInsets.only(top: 8.0),
child: Text(
xLabels[index].label,
style: TextStyle(
fontSize: 10,
color: Colors.grey,
),
),
);
}
return const Text('');
},
),
),
leftTitles: AxisTitles(
sideTitles: SideTitles(
showTitles: true,
getTitlesWidget: (value, meta) {
if (value == 0) {
return Padding(
padding: EdgeInsets.only(right: 14.rpx),
child: Text(
value.toStringAsFixed(0),
style: TextStyle(
fontSize: 18.rpx,
color: themeController.currentColor.sc4,
),
maxLines: 1,
overflow: TextOverflow.ellipsis,
textAlign: TextAlign.right,
),
);
} else if (value == yMin) {
return Padding(
padding: EdgeInsets.only(right: 14.rpx),
child: Text(
"${actYMin.toStringAsFixed(0)}",
style: TextStyle(
fontSize: 18.rpx,
color: themeController.currentColor.sc4,
),
maxLines: 1,
overflow: TextOverflow.ellipsis,
textAlign: TextAlign.right,
),
);
} else if (value == midValue) {
return Padding(
padding: EdgeInsets.only(right: 14.rpx),
child: Text(
"${((actYMax + actYMin) / 2).toStringAsFixed(0)}",
// "${midValue}",
style: TextStyle(
fontSize: 18.rpx,
color: themeController.currentColor.sc4,
),
maxLines: 1,
overflow: TextOverflow.ellipsis,
textAlign: TextAlign.right,
),
);
} else if (value == yMax) {
return Padding(
padding: EdgeInsets.only(right: 14.rpx),
child: Text(
"${actYMax.toStringAsFixed(0)}",
style: TextStyle(
fontSize: 18.rpx,
color: themeController.currentColor.sc4,
),
maxLines: 1,
overflow: TextOverflow.ellipsis,
textAlign: TextAlign.right,
),
);
}
return const Text('');
},
reservedSize: 40,
),
),
),
borderData: FlBorderData(
show: false,
border: Border.all(color: Colors.grey.withOpacity(0.3)),
),
minX: 0,
maxX: xLabels.length - 1,
minY: min(0, yMin) - (yMax - yMin) * 0.2,
maxY: yMax + (yMax - yMin) * 0.2,
lineBarsData: [
LineChartBarData(
spots: spots,
isCurved: false,
color: themeController.currentColor.sc2,
barWidth: 2,
isStrokeCapRound: true,
dotData: FlDotData(show: false), // Disable dots
belowBarData: BarAreaData(show: false),
),
],
),
),
);
}
}) : super(key: key);
// X轴刻度数据
List<XLabel> _generateXLabels() {
final labels = <XLabel>[];
final startDate = DateTime.fromMillisecondsSinceEpoch(startTime);
final endDate = DateTime.fromMillisecondsSinceEpoch(endTime);
// 第一个刻度，原始 startTime，HH:mm格式
labels.add(XLabel(
time: startTime,
label:
'${startDate.hour.toString().padLeft(2, '0')}:${startDate.minute.toString().padLeft(2, '0')}',
));
// 生成中间整点小时刻度，注意起点向上取整一个小时
DateTime current = DateTime(
startDate.year,
startDate.month,
startDate.day,
startDate.hour + 1,
startDate.hour,
);
if (startDate.minute > 0 ||
startDate.second > 0 ||
startDate.millisecond > 0) {
// 如果 startTime 不是整点，跳到下一个整点小时
current = current.add(Duration(hours: 1));
}
while (current.isBefore(endDate)) {
labels.add(XLabel(
@@ -247,6 +61,7 @@ class TimeSeriesChart extends StatelessWidget {
current = current.add(Duration(hours: 1));
}
// 最后一个刻度，原始 endTime，HH:mm格式
labels.add(XLabel(
time: endTime,
label:
@@ -256,31 +71,157 @@ class TimeSeriesChart extends StatelessWidget {
return labels;
}
double _convertTimeToXValue(int timestamp) {
final totalDuration = endTime - startTime;
final pointDuration = timestamp - startTime;
final xLabels = _generateXLabels();
return (pointDuration / totalDuration) * (xLabels.length - 1);
// 时间戳映射到0~(labels.length-1)之间
double _timeToX(double timestamp, List<XLabel> labels) {
int start = labels.first.time;
int end = labels.last.time;
double total = (end - start).toDouble();
double pos = (timestamp - start).clamp(0, total).toDouble();
return pos / total * (labels.length - 1);
}
int _convertXValueToTime(double xValue) {
@override
Widget build(BuildContext context) {
final xLabels = _generateXLabels();
final totalDuration = endTime - startTime;
final ratio = xValue / (xLabels.length - 1);
return startTime + (totalDuration * ratio).round();
final midY = (yMin + yMax) / 2;
List<FlSpot> spots = dataPoints.map((p) {
return FlSpot(_timeToX(p.timestamp.toDouble(), xLabels), p.value);
}).toList();
return AspectRatio(
aspectRatio: 2,
child: LineChart(
LineChartData(
minX: 0,
maxX: (xLabels.length - 1).toDouble(),
minY: yMin < 0 ? yMin : 0,
maxY: yMax,
gridData: FlGridData(show: false),
extraLinesData: ExtraLinesData(
horizontalLines: [
HorizontalLine(
y: 0,
color: themeController.currentColor.sc4,
strokeWidth: 1.rpx),
HorizontalLine(
y: yMin,
color: themeController.currentColor.sc9,
strokeWidth: 1.rpx,
dashArray: [5, 5]),
HorizontalLine(
y: yMax,
color: themeController.currentColor.sc9,
strokeWidth: 1.rpx,
dashArray: [5, 5]),
HorizontalLine(
y: midY,
color: themeController.currentColor.sc4,
strokeWidth: 1.rpx,
dashArray: [5, 5]),
],
),
titlesData: FlTitlesData(
bottomTitles: AxisTitles(
sideTitles: SideTitles(
showTitles: true,
reservedSize: 30,
interval: 1,
getTitlesWidget: (value, meta) {
int index = value.toInt();
if (index < 0 || index >= xLabels.length)
return const SizedBox.shrink();
final dateTime =
DateTime.fromMillisecondsSinceEpoch(xLabels[index].time);
if (index == 0 || index == xLabels.length - 1) {
// 开始和结束显示 HH:mm
final formatted =
'${dateTime.hour.toString().padLeft(2, '0')}:${dateTime.minute.toString().padLeft(2, '0')}';
return Padding(
padding: const EdgeInsets.only(top: 8.0),
child: Text(formatted,
style: TextStyle(
color: themeController.currentColor.sc4,
fontSize: 16.rpx)),
);
} else {
// 中间显示小时H，24小时制，不补零
final formatted = '${dateTime.hour}';
return Padding(
padding: const EdgeInsets.only(top: 8.0),
child: Text(formatted,
style: TextStyle(
color: themeController.currentColor.sc4,
fontSize: 16.rpx)),
);
}
},
),
),
leftTitles: AxisTitles(
sideTitles: SideTitles(
showTitles: true,
reservedSize: 40.rpx,
interval: 1,
getTitlesWidget: (value, meta) {
// 只显示 yMin, midY, yMax, 和 0
if ((value - 0).abs() < 0.01) {
return Text('0',
style: TextStyle(
color: themeController.currentColor.sc4,
fontSize: 16.rpx));
} else if ((value - yMin).abs() < 0.01) {
return Text(yMin.toStringAsFixed(0),
style: TextStyle(
color: themeController.currentColor.sc4,
fontSize: 16.rpx));
} else if ((value - midY).abs() < 0.01) {
return Text(midY.toStringAsFixed(0),
style: TextStyle(
color: themeController.currentColor.sc4,
fontSize: 16.rpx));
} else if ((value - yMax).abs() < 0.01) {
return Text(yMax.toStringAsFixed(0),
style: TextStyle(
color: themeController.currentColor.sc4,
fontSize: 16.rpx));
} else {
return const SizedBox.shrink();
}
},
),
),
rightTitles: AxisTitles(sideTitles: SideTitles(showTitles: false)),
topTitles: AxisTitles(sideTitles: SideTitles(showTitles: false)),
),
borderData: FlBorderData(
show: true,
border: Border(
bottom: BorderSide(color: Colors.grey.withOpacity(0.3)),
left: BorderSide.none,
right: BorderSide.none,
top: BorderSide.none,
),
),
lineBarsData: [
LineChartBarData(
spots: spots,
isCurved: false,
color: themeController.currentColor.sc2,
barWidth: 2,
dotData: FlDotData(show: false),
)
],
),
),
);
}
}
class TimeSeriesPoint {
final int timestamp;
final double value;
TimeSeriesPoint(this.timestamp, this.value);
}
class XLabel {
final int time;
final String label;
XLabel({required this.time, required this.label});
}