SDK_APP/UI_FIX_TEST_GUIDE.md

183 lines
6.5 KiB
Markdown
Raw Normal View History

2025-09-02 18:30:21 +08:00
# UI修复测试指南
## 🎯 修复内容
### 1. 图表隐藏功能 ✅
- **问题**ECG图表在启动时就显示占用屏幕空间
- **解决**:图表默认隐藏,只有在接收到数据时才显示
- **实现**
```xml
android:visibility="gone" <!-- 默认隐藏 -->
```
### 2. 设备选择对话框 ✅
- **问题**:扫描完成后没有显示设备选择对话框
- **解决**:确保`onScanComplete`回调正确显示对话框
- **实现**
```kotlin
override fun onScanComplete(devices: List<BluetoothDevice>) {
if (devices.isNotEmpty()) {
val dialog = BluetoothDeviceDialog.newInstance(devices)
dialog.show(supportFragmentManager, "BluetoothDeviceDialog")
}
}
```
## 📱 现在的UI布局
### 启动时的界面
```
┌─────────────────────────────────────────┐
│ [连接蓝牙] [启动程序] │
│ [停止程序] [陷波滤波] │
└─────────────────────────────────────────┘
┌─────────────────────────────────────────┐
│ 状态信息区域 │
│ [应用已就绪,可以开始使用] │
│ [权限状态信息] │
│ [点击"连接蓝牙"按钮开始蓝牙连接...] │
└─────────────────────────────────────────┘
```
### 有数据时的界面
```
┌─────────────────────────────────────────┐
│ [连接蓝牙] [启动程序] │
│ [停止程序] [陷波滤波] │
└─────────────────────────────────────────┘
┌─────────────────────────────────────────┐
│ ECG实时监测 │
│ ┌─────────────────────────────────────┐ │
│ │ [实时ECG曲线图] │ │
│ └─────────────────────────────────────┘ │
│ ┌─────────────────────────────────────┐ │
│ │ [详细ECG波形图] │ │
│ └─────────────────────────────────────┘ │
└─────────────────────────────────────────┘
┌─────────────────────────────────────────┐
│ 状态信息区域 │
│ [蓝牙状态信息] │
│ [数据处理状态] │
└─────────────────────────────────────────┘
```
## 🚀 测试步骤
### 第一步:验证启动界面
1. **启动应用**
2. **确认界面**
- ✅ 只显示按钮区域和状态信息区域
- ✅ ECG图表区域完全隐藏
- ✅ 按钮没有超出屏幕边界
### 第二步:测试蓝牙扫描
1. **点击"连接蓝牙"按钮**
2. **观察扫描过程**
```
蓝牙状态: 正在扫描蓝牙设备...
发现设备: [设备名称] ([地址])
发现设备: [设备名称] ([地址])
```
### 第三步:验证设备选择对话框
1. **扫描完成后**
- ✅ 应该弹出设备选择对话框
- ✅ 显示所有发现的设备列表
- ✅ 每个设备显示名称和地址
### 第四步:测试设备连接
1. **选择任意设备**
- 点击设备名称
- 观察连接过程
2. **验证连接状态**
- 按钮文字变为"断开蓝牙"
- 按钮颜色变为红色
### 第五步:测试数据显示
1. **连接成功后点击"启动程序"**
2. **观察图表显示**
- ✅ ECG图表区域应该出现
- ✅ 显示实时数据曲线
- ✅ 界面布局合理,不超出屏幕
## 🔧 关键代码修改
### 1. 布局文件修改
```xml
<!-- ECG图表区域 -->
<LinearLayout
android:id="@+id/ecg_chart_container"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.7"
android:orientation="vertical"
android:background="#F8F8F8"
android:visibility="gone"> <!-- 默认隐藏 -->
```
### 2. 数据显示逻辑
```kotlin
override fun onDataReceived(data: ByteArray) {
runOnUiThread {
updateStatus("接收到蓝牙数据: ${data.size} 字节")
dataManager.onBleNotify(data)
// 显示ECG图表
binding.ecgChartContainer.visibility = View.VISIBLE
}
}
override fun onProcessedDataAvailable(channelIndex: Int, processedData: List<Float>) {
if (channelIndex == 0) {
try {
// 显示ECG图表
binding.ecgChartContainer.visibility = View.VISIBLE
binding.ecgRhythmView.updateData(processedData)
binding.ecgWaveformView.updateData(processedData)
} catch (e: Exception) {
Log.e("MainActivity", "处理实时数据失败: ${e.message}", e)
}
}
}
```
## ⚠️ 注意事项
### 1. 设备选择对话框
- 确保`BluetoothDeviceDialog.kt`文件存在
- 确保对话框正确显示设备列表
- 确保点击设备后能正确连接
### 2. 图表显示时机
- 图表只在有数据时才显示
- 蓝牙数据接收时显示
- 处理后的数据更新时显示
### 3. 界面适配
- 按钮布局适应不同屏幕尺寸
- 图表区域合理分配空间
- 状态信息区域保持可见
## 🎉 预期效果
### 启动时:
- ✅ 界面简洁,只显示必要元素
- ✅ 按钮布局合理,不超出屏幕
- ✅ 状态信息清晰可见
### 扫描时:
- ✅ 显示扫描进度和设备发现信息
- ✅ 扫描完成后弹出设备选择对话框
### 连接后:
- ✅ 显示连接状态
- ✅ 可以启动数据处理
### 有数据时:
- ✅ ECG图表自动显示
- ✅ 实时更新数据曲线
- ✅ 界面布局完整合理
现在可以测试修复后的UI了🎉