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

更新ui

Browse Source
This commit is contained in:
wyf
2025-08-16 17:45:55 +08:00
parent 7d3e4ad1e8
commit 111bd78a24
15 changed files with 477 additions and 137 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
lib/pages/sleep_report/chart/DataShowWidget.dart
View File

@@ -50,7 +50,7 @@ class _DataShowWidgetState extends State<DataShowWidget> {
children: [
// 放入传入的 widget1
Container(
width: MediaQuery.sizeOf(context).width * 0.35, // 固定宽度
width: MediaQuery.sizeOf(context).width * 0.33, // 固定宽度
decoration: BoxDecoration(),
child: Align(
alignment: Alignment.centerLeft,
@@ -90,7 +90,7 @@ class _DataShowWidgetState extends State<DataShowWidget> {
),
// 放入传入的 widget4
Container(
width: MediaQuery.sizeOf(context).width * 0.1, // 固定宽度
width: MediaQuery.sizeOf(context).width * 0.12, // 固定宽度
decoration: BoxDecoration(),
child: Align(
alignment: widget.alignment == MainAxisAlignment.start

4
lib/pages/sleep_report/chart/ScatterPlotChart.dart
View File

@@ -23,11 +23,11 @@ class ScatterPlotChart extends StatelessWidget {
// 计算向上取整后的最大值
// double xMaxCeil = (xMax / divisions).ceil() * divisions.toDouble();
double temp = (xMax / divisions).ceil().toDouble(); // 计算向上取整后的每个分区的最大值
double xMaxCeil = (((temp / 100).ceil()) * 100 * (divisions - 1))
double xMaxCeil = (((temp / 100).ceil()) * 100 * (divisions))
.toDouble(); // 向百取整并乘以 divisions
double tempy = (yMax / divisions).ceil().toDouble(); // 计算向上取整后的每个分区的最大值
double yMaxCeil =
(((tempy / 100).ceil()) * 100 * (divisions - 1)).toDouble();
(((tempy / 100).ceil()) * 100 * (divisions)).toDouble();
return SizedBox(
child: ScatterChart(

404
lib/pages/sleep_report/chart/SnoreWaveform.dart
View File

@@ -1,3 +1,280 @@
// import 'dart:ui' as ui;
// import 'package:flutter/material.dart';
// import 'package:flutterflow_ui/flutterflow_ui.dart';
// import 'package:vbvs_app/common/util/FitTool.dart';
// import 'package:vbvs_app/common/util/MyUtils.dart';
// import 'package:intl/intl.dart';
// class SnoreChartContainer extends StatelessWidget {
// final List<dynamic> snoreValues;
// final List<dynamic> barData;
// final List<dynamic> showLabel;
// final int startTime;
// final int endTime;
// const SnoreChartContainer({
// required this.snoreValues,
// required this.barData,
// required this.showLabel,
// required this.startTime,
// required this.endTime,
// super.key,
// });
// @override
// Widget build(BuildContext context) {
// return Column(
// crossAxisAlignment: CrossAxisAlignment.start,
// children: [
// SnoreBarOverlay(
// barData: barData,
// showLabel: showLabel,
// startTime: startTime,
// endTime: endTime,
// ),
// Container(height: 32.rpx),
// Container(
// height: 23.rpx,
// child: SnoreWaveform(
// snoreValues: snoreValues,
// startTime: startTime,
// endTime: endTime,
// ),
// ),
// ],
// );
// }
// }
// class SnoreBarOverlay extends StatelessWidget {
// final List<dynamic> barData;
// final List<dynamic> showLabel; // ✅ 加入
// final int startTime;
// final int endTime;
// const SnoreBarOverlay({
// required this.barData,
// required this.showLabel, // ✅ 加入
// required this.startTime,
// required this.endTime,
// super.key,
// });
// @override
// Widget build(BuildContext context) {
// const double barHeight = 50;
// return SizedBox(
// height: barHeight,
// child: CustomPaint(
// size: Size(double.infinity, barHeight),
// painter: SnoreBarPainter(
// barData: barData,
// showLabel: showLabel, // ✅ 加入
// startTime: startTime,
// endTime: endTime,
// ),
// ),
// );
// }
// }
// class SnoreBarPainter extends CustomPainter {
// final List<dynamic> barData;
// final List<dynamic> showLabel; // ✅ 加入
// final int startTime;
// final int endTime;
// SnoreBarPainter({
// required this.barData,
// required this.showLabel, // ✅ 加入
// required this.startTime,
// required this.endTime,
// });
// @override
// void paint(Canvas canvas, Size size) {
// final double width = size.width;
// final double height = size.height;
// final double pixelPerMs = width / (endTime - startTime);
// for (var item in barData) {
// final int st = item['st'];
// final int et = item['et'];
// final int type = item['type'];
// // 查找匹配的颜色
// final match = showLabel.firstWhere(
// (e) => e['type'] == type,
// orElse: () => null,
// );
// Color barColor = Colors.transparent;
// if (match != null) {
// final dynamic colorStr = match['color'];
// if (colorStr != null && colorStr.toString().isNotEmpty) {
// barColor = stringToColor(colorStr);
// }
// }
// final Paint barPaint = Paint()
// ..color = barColor
// ..style = PaintingStyle.fill;
// final double leftX = (st - startTime) * pixelPerMs;
// final double rightX = (et - startTime) * pixelPerMs;
// final double barWidth = rightX - leftX;
// final double barHeight = (type + 5).toDouble() * 8;
// final double top = height - barHeight;
// final rect = Rect.fromLTWH(leftX, top, barWidth, barHeight);
// canvas.drawRect(rect, barPaint);
// }
// }
// @override
// bool shouldRepaint(covariant CustomPainter oldDelegate) => true;
// }
// class SnoreWaveform extends StatelessWidget {
// final List<dynamic> snoreValues;
// final int startTime;
// final int endTime;
// const SnoreWaveform({
// required this.snoreValues,
// required this.startTime,
// required this.endTime,
// super.key,
// });
// @override
// Widget build(BuildContext context) {
// return SizedBox(
// height: 150,
// child: CustomPaint(
// size: Size(double.infinity, 150),
// painter: SnoreWaveformPainter(
// snoreValues: snoreValues,
// startTime: startTime,
// endTime: endTime,
// ),
// ),
// );
// }
// }
// class SnoreWaveformPainter extends CustomPainter {
// final List<dynamic> snoreValues;
// final int startTime;
// final int endTime;
// SnoreWaveformPainter({
// required this.snoreValues,
// required this.startTime,
// required this.endTime,
// });
// @override
// void paint(Canvas canvas, Size size) {
// final double width = size.width;
// final double height = size.height;
// final double centerY = height / 2;
// final double totalDuration = (endTime - startTime).toDouble();
// final double pixelPerMs = width / totalDuration;
// final Paint wavePaint = Paint()
// ..color = stringToColor("#8E7DEF").withOpacity(0.8)
// ..strokeWidth = 1.5
// ..style = PaintingStyle.stroke;
// final Path upperPath = Path();
// final Path lowerPath = Path();
// // ✅ 获取最大值用于自适应比例
// double maxValue = snoreValues.fold<double>(0, (prev, e) {
// final value = e["value"]?.toDouble() ?? 0;
// return value > prev ? value : prev;
// });
// // ✅ 自适应缩放比例，限制波形最大高度为 height * 0.45
// final double maxWaveHeight = height * 1;
// final double scaleY = maxValue > 0 ? (maxWaveHeight / maxValue) : 1;
// for (int i = 0; i < snoreValues.length; i++) {
// final timestamp = snoreValues[i]["st"];
// final value = snoreValues[i]["value"]?.toDouble() ?? 0;
// final x = (timestamp - startTime) * pixelPerMs;
// final y = centerY - value * scaleY;
// final yMirror = centerY + value * scaleY;
// if (i == 0) {
// upperPath.moveTo(x, y);
// lowerPath.moveTo(x, yMirror);
// } else {
// upperPath.lineTo(x, y);
// lowerPath.lineTo(x, yMirror);
// }
// }
// canvas.drawPath(upperPath, wavePaint);
// canvas.drawPath(lowerPath, wavePaint);
// // ✅ 最后绘制中心线，防止被覆盖
// final Paint axisPaint = Paint()
// ..color = Colors.grey.withOpacity(0.6)
// ..strokeWidth = 0.5;
// canvas.drawLine(Offset(0, centerY), Offset(width, centerY), axisPaint);
// // ✅ 时间刻度绘制
// final textPainter = TextPainter(
// textAlign: TextAlign.center,
// textDirection: ui.TextDirection.ltr,
// );
// final int hourMs = 60 * 60 * 1000;
// for (int t = startTime; t < endTime; t += hourMs) {
// double x = (t - startTime) * pixelPerMs;
// DateTime dt = DateTime.fromMillisecondsSinceEpoch(t);
// String label = t == startTime
// ? DateFormat('HH:mm').format(dt)
// : DateFormat('h').format(dt); // 12小时制
// textPainter.text = TextSpan(
// text: label,
// style: TextStyle(fontSize: 10, color: Colors.grey),
// );
// textPainter.layout();
// textPainter.paint(
// canvas,
// Offset(x - textPainter.width / 2, height + 2), // 标签显示在底部
// );
// }
// // ✅ 画终点时间
// {
// double x = (endTime - startTime) * pixelPerMs;
// DateTime dt = DateTime.fromMillisecondsSinceEpoch(endTime);
// String label = DateFormat('HH:mm').format(dt);
// textPainter.text = TextSpan(
// text: label,
// style: TextStyle(fontSize: 10, color: Colors.grey),
// );
// textPainter.layout();
// textPainter.paint(
// canvas,
// Offset(x - textPainter.width / 2, height + 2),
// );
// }
// }
// @override
// bool shouldRepaint(covariant CustomPainter oldDelegate) => true;
// }
import 'dart:ui' as ui;
import 'package:flutter/material.dart';
import 'package:flutterflow_ui/flutterflow_ui.dart';
@@ -48,13 +325,13 @@ class SnoreChartContainer extends StatelessWidget {
class SnoreBarOverlay extends StatelessWidget {
final List<dynamic> barData;
final List<dynamic> showLabel; // ✅ 加入
final List<dynamic> showLabel;
final int startTime;
final int endTime;
const SnoreBarOverlay({
required this.barData,
required this.showLabel, // ✅ 加入
required this.showLabel,
required this.startTime,
required this.endTime,
super.key,
@@ -69,7 +346,7 @@ class SnoreBarOverlay extends StatelessWidget {
size: Size(double.infinity, barHeight),
painter: SnoreBarPainter(
barData: barData,
showLabel: showLabel, // ✅ 加入
showLabel: showLabel,
startTime: startTime,
endTime: endTime,
),
@@ -80,13 +357,13 @@ class SnoreBarOverlay extends StatelessWidget {
class SnoreBarPainter extends CustomPainter {
final List<dynamic> barData;
final List<dynamic> showLabel; // ✅ 加入
final List<dynamic> showLabel;
final int startTime;
final int endTime;
SnoreBarPainter({
required this.barData,
required this.showLabel, // ✅ 加入
required this.showLabel,
required this.startTime,
required this.endTime,
});
@@ -102,7 +379,6 @@ class SnoreBarPainter extends CustomPainter {
final int et = item['et'];
final int type = item['type'];
// 查找匹配的颜色
final match = showLabel.firstWhere(
(e) => e['type'] == type,
orElse: () => null,
@@ -191,13 +467,11 @@ class SnoreWaveformPainter extends CustomPainter {
final Path upperPath = Path();
final Path lowerPath = Path();
// ✅ 获取最大值用于自适应比例
double maxValue = snoreValues.fold<double>(0, (prev, e) {
final value = e["value"]?.toDouble() ?? 0;
return value > prev ? value : prev;
});
// ✅ 自适应缩放比例，限制波形最大高度为 height * 0.45
final double maxWaveHeight = height * 1;
final double scaleY = maxValue > 0 ? (maxWaveHeight / maxValue) : 1;
@@ -221,54 +495,104 @@ class SnoreWaveformPainter extends CustomPainter {
canvas.drawPath(upperPath, wavePaint);
canvas.drawPath(lowerPath, wavePaint);
// ✅ 最后绘制中心线，防止被覆盖
final Paint axisPaint = Paint()
..color = Colors.grey.withOpacity(0.6)
..strokeWidth = 0.5;
canvas.drawLine(Offset(0, centerY), Offset(width, centerY), axisPaint);
// ✅ 时间刻度绘制
final textPainter = TextPainter(
textAlign: TextAlign.center,
textDirection: ui.TextDirection.ltr,
);
final int hourMs = 60 * 60 * 1000;
for (int t = startTime; t < endTime; t += hourMs) {
double x = (t - startTime) * pixelPerMs;
final int totalHours = (endTime - startTime) ~/ hourMs;
DateTime dt = DateTime.fromMillisecondsSinceEpoch(t);
String label = t == startTime
? DateFormat('HH:mm').format(dt)
: DateFormat('h').format(dt); // 12小时制
// 1. 始终显示开始时间
double x = 0;
DateTime startDt = DateTime.fromMillisecondsSinceEpoch(startTime);
String label = DateFormat('HH:mm').format(startDt);
textPainter.text = TextSpan(
text: label,
style: TextStyle(fontSize: 10, color: Colors.grey),
);
textPainter.layout();
textPainter.paint(
canvas,
Offset(x - textPainter.width / 2, height + 2), // 标签显示在底部
);
textPainter.text = TextSpan(
text: label,
style: TextStyle(fontSize: 10, color: Colors.grey),
);
textPainter.layout();
textPainter.paint(
canvas,
Offset(x - textPainter.width / 2, height + 2),
);
// 2. 决定显示策略
if (totalHours <= 8) {
// 小时间段：显示所有整点小时
for (int t = startTime + hourMs; t < endTime; t += hourMs) {
x = (t - startTime) * pixelPerMs;
DateTime dt = DateTime.fromMillisecondsSinceEpoch(t);
// 判断是否接近边界（30分钟内不显示）
if (t - startTime < 30 * 60 * 1000 || endTime - t < 30 * 60 * 1000) {
continue;
}
label = dt.hour == 0 ? "0" : "${dt.hour}";
textPainter.text = TextSpan(
text: label,
style: TextStyle(fontSize: 10, color: Colors.grey),
);
textPainter.layout();
textPainter.paint(
canvas,
Offset(x - textPainter.width / 2, height + 2),
);
}
} else {
// 长时间段：使用自适应间隔
int labelInterval = (totalHours / 6).ceil();
// 计算第一个标签位置（对齐整点）
int firstLabelMs =
((startTime ~/ (labelInterval * hourMs))) * labelInterval * hourMs;
if (firstLabelMs <= startTime) {
firstLabelMs += labelInterval * hourMs;
}
// 绘制中间标签
for (int t = firstLabelMs; t < endTime; t += labelInterval * hourMs) {
// 跳过太接近边界的时间点（1小时内不显示）
if (t - startTime < hourMs || endTime - t < hourMs) continue;
x = (t - startTime) * pixelPerMs;
DateTime dt = DateTime.fromMillisecondsSinceEpoch(t);
label = dt.hour == 0 ? "0" : "${dt.hour}";
textPainter.text = TextSpan(
text: label,
style: TextStyle(fontSize: 10, color: Colors.grey),
);
textPainter.layout();
textPainter.paint(
canvas,
Offset(x - textPainter.width / 2, height + 2),
);
}
}
// ✅ 画终点时间
{
double x = (endTime - startTime) * pixelPerMs;
DateTime dt = DateTime.fromMillisecondsSinceEpoch(endTime);
String label = DateFormat('HH:mm').format(dt);
// 3. 始终显示结束时间
x = (endTime - startTime) * pixelPerMs;
DateTime endDt = DateTime.fromMillisecondsSinceEpoch(endTime);
label = DateFormat('HH:mm').format(endDt);
textPainter.text = TextSpan(
text: label,
style: TextStyle(fontSize: 10, color: Colors.grey),
);
textPainter.layout();
textPainter.paint(
canvas,
Offset(x - textPainter.width / 2, height + 2),
);
}
textPainter.text = TextSpan(
text: label,
style: TextStyle(fontSize: 10, color: Colors.grey),
);
textPainter.layout();
textPainter.paint(
canvas,
Offset(x - textPainter.width / 2, height + 2),
);
}
@override