桑拿卡路里模块设计

原创已于 2025-11-21 08:37:12 修改 · 858 阅读

24 ·

CC 4.0 BY-SA版权

文章标签：

#flutter

于 2025-11-21 08:36:43 首次发布

✔ 需求说明（产品级）
✔ 功能结构图
✔ 数据结构（含持久化）
✔ 计算逻辑（与温度联动）
✔ 控制器设计（GetX）
✔ UI 结构（卡路里6、卡路里6-1）
✔ 与主系统（温度、时长、BLE）联动设计
✔ 未来扩展建议

📘 桑拿卡路里模块设计文档

模块编号：Calorie Module
页面：卡路里6（主界面）、卡路里6-1（趋势图）
状态：可开发
依赖：BLE 温度 + 计时模块 + Hive 持久化

1. 模块目标

本模块用于：

实时计算用户在桑拿过程中的卡路里消耗
显示消耗详情、完成度与健康建议
展示历史记录
提供折线趋势图查看长期变化趋势

所有数据支持本地持久化（不丢失）。

2. 卡路里消耗计算规则（核心公式）

根据设计图：

🟧 A 区间：40–55°C

平均每分钟消耗 6 kcal/min
每小时 360 kcal

🟥 B 区间：56–65°C

平均每分钟消耗 10 kcal/min
每小时 600 kcal

🔥 卡路里计算公式

if (temp in 40–55°C)  
    kcal = minutes * 6
else if (temp in 56–65°C)
    kcal = minutes * 10
else
    kcal = 0   # 温度未达到门槛

温度从 DeviceManagerController 的 currentTemp 获取
时长从 桑拿倒计时控制器 获取（你的项目已经有 timer）

3. 模块整体结构

calorie/
 ├─ controllers/
 │     └─ calorie_controller.dart
 │
 ├─ views/
 │     ├─ calorie_page.dart      ← 卡路里6
 │     └─ calorie_trend_page.dart ← 卡路里6-1
 │
 ├─ services/
 │     └─ 使用 AppStorage().addCalorieRecord()
 │
 └─ models/
       └─ CalorieRecord（你已完成）

4. 卡路里数据模型（已完成）

@HiveType(typeId: 1)
class CalorieRecord extends HiveObject {
  @HiveField(0)
  int calories;

  @HiveField(1)
  int durationMin;

  @HiveField(2)
  int temperature;

  @HiveField(3)
  DateTime time;

  CalorieRecord({
    required this.calories,
    required this.durationMin,
    required this.temperature,
    required this.time,
  });
}

5. CalorieController 设计（核心）

class CalorieController extends GetxController {
  final dm = Get.find<DeviceManagerController>();

  RxInt calories = 0.obs;
  RxInt durationMin = 0.obs;
  RxInt targetPercent = 0.obs;

  Timer? timer;

  @override
  void onInit() {
    super.onInit();
    _startTimer();
  }

  void _startTimer() {
    timer = Timer.periodic(Duration(minutes: 1), (_) {
      _calculateCalorie();
    });
  }

  void _calculateCalorie() {
    final temp = dm.temperature.value;

    if (temp >= 40 && temp <= 55) {
      calories.value += 6;
    } else if (temp >= 56 && temp <= 65) {
      calories.value += 10;
    }

    durationMin.value++;

    targetPercent.value = ((calories.value / 300) * 100).clamp(0, 100).toInt();
  }

  void saveRecord() {
    final r = CalorieRecord(
      calories: calories.value,
      durationMin: durationMin.value,
      temperature: dm.temperature.value,
      time: DateTime.now(),
    );

    AppStorage().addCalorieRecord(r);
  }

  @override
  void onClose() {
    timer?.cancel();
    super.onClose();
  }
}

6. 卡路里主界面 UI（卡路里6）

页面元素：

✔ A. 大圆形卡路里显示

外环动画（进度感强）
中间显示 “326 kcal”

✔ B. 温度与时间

60°C     30min

✔ C. 对比昨日

↑ +50 卡路里

✔ D. 目标完成进度条（300 kcal 为 100%）

✔ E. 健康建议

例如：

“建议补充 300 ml 电解质水”
“高温已持续 30 min，注意休息”

✔ F. 历史记录

最近 15 次
单条格式：

00:35     136 kcal

✔ G. 底部导航

首页
趋势
分享

🎨 页面结构代码参考（简化版）

class CaloriePage extends StatelessWidget {
  final c = Get.put(CalorieController());
  final storage = AppStorage();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.black,
      bottomNavigationBar: CommonBottomNav(),
      body: Obx(() => Column(
        children: [
          _buildHeader(),
          _buildCircle(c.calories.value),
          _buildTempTime(dm.temperature.value, c.durationMin.value),
          _buildCompare(),
          _buildTargetBar(c.targetPercent.value),
          _buildAdvice(),
          _buildHistory(storage.history),
        ],
      )),
    );
  }
}

7. 趋势图界面（卡路里 6-1）

内容：

折线图
- 横轴：最近 7 天记录（不足用 0 填充）
- 纵轴：kcal
科普文章
- 使用 ListView
- 文字如设计图
- 未来可热更新
底部导航
- 首页
- 返回

8. 趋势图折线图（使用 fl_chart）

示例：

LineChart(
  LineChartData(
    minY: 0,
    maxY: 600,
    titlesData: ...,
    lineBarsData: [
      LineChartBarData(
        spots: _buildPoints(),
        isCurved: true,
        belowBarData: BarAreaData(show: false),
        color: Colors.blue,
        dotData: FlDotData(show: true),
      )
    ],
  ),
)