Flagship/abox-mgr
5
2
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Limit feature to device list component

Browse Source
This commit is contained in:
alZerNest
2026-08-24 21:23:11 +08:00
parent 1fb046cb09
commit 5971dd5e4e
8 changed files with 93 additions and 572 deletions
Download Patch File Download Diff File Expand all files Collapse all files
docs/device-control-compose-ui-change-log.md
+86 -235
View File
@@ -1,114 +1,51 @@
# Device Control Compose UI Change Log
# Device List Compose UI Change Log
Branch: `feature/device-control-compose-ui`
## Summary
This branch adds a Kotlin Jetpack Compose implementation for the device-control UI owned by this feature area.
This branch adds only the Kotlin Jetpack Compose device list page owned by this feature area.
The implementation introduces a new device-control entry point and a group of Compose screens for the three device types required by the current project scope:
- Socket device control
- Temperature/humidity status display
- Infrared remote control actions
The existing placeholder/foundation app flow is preserved. The new device-control flow is added as an additional navigation path instead of replacing the existing screens.
## Modified Files
### `android/app/src/main/kotlin/com/flagship/abox/manager/ui/ABoxManagerApp.kt`
Changes:
- Added an entry button on the foundation screen for the Kotlin device-control UI.
- Registered the new device-control navigation graph in the existing `NavHost`.
- Preserved the existing foundation and placeholder routes.
Purpose:
- Allows teammates to open the newly added device-control screens from the current Compose app shell.
## Added Files
### `android/app/src/main/kotlin/com/flagship/abox/manager/ui/devicecontrol/DeviceControlRoutes.kt`
Adds navigation routes and a small navigation graph for the device-control feature.
Routes included:
- Device list
- Socket control
- Temperature/humidity status
- Infrared control
### `android/app/src/main/kotlin/com/flagship/abox/manager/ui/devicecontrol/DeviceListScreen.kt`
Adds the top-level device list screen.
The screen contains entries for:
The implementation provides a reusable Compose screen that displays the ABox terminal device categories:
- Smart socket
- Temperature/humidity sensor
- Infrared remote controller
- Infrared controller
Each entry navigates to its corresponding Compose screen.
This branch intentionally does not modify the app entry point or app shell routing. The app shell, login flow, and detail-feature routing are owned by other feature branches.
### `android/app/src/main/kotlin/com/flagship/abox/manager/ui/devicecontrol/DeviceControlComponents.kt`
## Added Files
Adds shared UI components used by the device-control screens.
### `android/app/src/main/kotlin/com/flagship/abox/manager/ui/devicecontrollist/DeviceListScreen.kt`
Included components:
Adds the device list page.
- Shared device page scaffold
- Primary action button wrapper
- Two-column action button row
The page displays entries for:
Purpose:
- Keeps repeated screen layout and action button patterns consistent across device screens.
### `android/app/src/main/kotlin/com/flagship/abox/manager/ui/devicecontrol/SocketControlScreen.kt`
Adds a Compose screen for socket control.
- Smart socket
- Temperature/humidity sensor
- Infrared controller
Current scope:
- Displays socket status text.
- Provides actions for refreshing status, turning on, and turning off.
- Uses local Compose state as a placeholder.
- Display the device categories as list entry UI.
- Keep the UI in Kotlin Compose.
- Expose click callbacks for each device category.
- Avoid adding app-shell routing, detail routes, or detail control pages in this branch.
Integration API:
```kotlin
DeviceListScreen(
onSocketClick = { /* route to socket module later */ },
onTemperatureHumidityClick = { /* route to temperature/humidity module later */ },
onInfraredClick = { /* route to infrared controller module later */ },
)
```
Future integration point:
- Replace placeholder state handling with `SocketGateway.getStatus(...)` and `SocketGateway.setPower(...)` through a ViewModel.
### `android/app/src/main/kotlin/com/flagship/abox/manager/ui/devicecontrol/TemperatureHumidityScreen.kt`
Adds a Compose screen for temperature/humidity display.
Current scope:
- Displays temperature and humidity values.
- Provides a refresh action.
- Uses local Compose state as a placeholder.
Future integration point:
- Replace placeholder state handling with `TemperatureHumidityGateway.getReading(...)` through a ViewModel.
### `android/app/src/main/kotlin/com/flagship/abox/manager/ui/devicecontrol/InfraredControlScreen.kt`
Adds a Compose screen for infrared remote operations.
Current scope:
- Allows entering an infrared device name.
- Allows entering an infrared key name.
- Provides send and learn actions.
- Uses local Compose state as a placeholder.
Future integration point:
- Replace placeholder state handling with `InfraredGateway.sendKey(...)` and `InfraredGateway.learnKey(...)` through a ViewModel.
- The app shell or feature owner responsible for routing can host this screen and connect these callbacks to their own routes/modules later.
## Architecture Notes
@@ -117,33 +54,22 @@ This branch follows the current repository direction:
- Kotlin instead of Java
- Jetpack Compose instead of XML layouts
- Single-Activity UI instead of multiple Activities
- Navigation Compose instead of `Intent`-based Activity navigation
- Navigation Compose compatibility through external callbacks
- Existing design-system wrappers where practical
This branch intentionally does not copy the previous Java/XML experiment module into the team repository.
## ABSDK Integration Notes
The UI screens added in this branch do not call ABSDK directly.
The repository already contains domain abstractions and an ABSDK bridge:
- `SocketGateway`
- `TemperatureHumidityGateway`
- `InfraredGateway`
- `AbsdkBridge`
- `VendorAbsdkClient`
Recommended next step:
- Add ViewModels for the device-control screens.
- Inject/use the gateway interfaces from the domain layer.
- Expose screen UI state from ViewModels to the Compose screens.
## Scope Intentionally Not Included
This branch does not include:
- App entry point changes
- App shell or login routing changes
- A device-control navigation graph file
- Socket control screen implementation
- Temperature/humidity status screen implementation
- Infrared controller screen implementation
- Shared detail-control component scaffolding
- Direct ABSDK calls from Compose UI
- New Java Activity classes
- XML layout files
@@ -151,138 +77,74 @@ This branch does not include:
- Full session/login integration for device gateway calls
- Persistent infrared key storage
These should be added in later branches or follow-up commits after team architecture review.
These should be added by the corresponding feature owners in later branches or follow-up commits after team architecture review.
## Verification
- Built and ran `android.app` from Android Studio successfully during local validation.
- `:android:app:assembleDebug` completed successfully after trimming the feature scope.
## Files Intended for Commit
The intended commit scope is limited to:
```text
android/app/src/main/kotlin/com/flagship/abox/manager/ui/ABoxManagerApp.kt
android/app/src/main/kotlin/com/flagship/abox/manager/ui/devicecontrol/
android/app/src/main/kotlin/com/flagship/abox/manager/ui/devicecontrollist/DeviceListScreen.kt
docs/device-control-compose-ui-change-log.md
```
`settings.gradle.kts` is intentionally not part of this feature commit unless the team decides the local toolchain resolver change is required.
`settings.gradle.kts` is intentionally excluded from this feature commit. Local Gradle/JDK/toolchain setup should be handled on the developer machine and should not modify the team-provided project configuration in this branch.
---
# 设备控制 Compose UI 修改说明（中文）
# 设备列表 Compose UI 修改说明（中文）
分支：`feature/device-control-compose-ui`
## 概要
本分支新增了一套 Kotlin Jetpack Compose 版本的设备控制 UI，用于承载当前负责的设备列表与三类终端设备页面。
本分支只新增当前分工负责的 Kotlin Jetpack Compose 设备列表页面。
本次新增的设备范围包括：
- 智能插座控制
- 温湿度状态显示
- 红外遥控器操作
本分支没有替换原有的 foundation / placeholder 页面，而是在现有 Compose 应用壳中新增了一个设备控制入口。因此，原有占位流程仍然保留，设备控制流程是额外新增的导航路径。
## 修改文件
### `android/app/src/main/kotlin/com/flagship/abox/manager/ui/ABoxManagerApp.kt`
修改内容：
- 在 foundation 页面增加了一个进入 Kotlin 版设备控制 UI 的按钮。
- 在现有 `NavHost` 中注册了设备控制导航图。
- 保留了原有 foundation route 和 placeholder route。
作用：
- 方便团队成员从当前 Compose 应用入口进入新增加的设备控制页面。
## 新增文件
### `android/app/src/main/kotlin/com/flagship/abox/manager/ui/devicecontrol/DeviceControlRoutes.kt`
新增设备控制相关的 Compose Navigation 路由与导航图。
包含的页面路由：
- 设备列表
- 智能插座控制
- 温湿度状态
- 红外遥控器控制
### `android/app/src/main/kotlin/com/flagship/abox/manager/ui/devicecontrol/DeviceListScreen.kt`
新增设备列表页面。
页面包含三个设备入口：
设备列表展示的设备类别包括：
- 智能插座
- 温湿度传感器
- 红外遥控器
- 红外控制器
每个入口会跳转到对应的 Compose 设备页面。
本分支故意不修改 App 入口或应用壳路由。程序入口、登录流程和各设备详情模块路由由其他功能分支负责。
### `android/app/src/main/kotlin/com/flagship/abox/manager/ui/devicecontrol/DeviceControlComponents.kt`
## 新增文件
新增设备控制页面共用 UI 组件。
### `android/app/src/main/kotlin/com/flagship/abox/manager/ui/devicecontrollist/DeviceListScreen.kt`
包含：
新增设备列表页面。
- 通用设备页面脚手架
- 主要操作按钮封装
- 双按钮横向操作区
页面展示三个设备入口：
作用：
- 减少各设备页面中的重复布局代码。
- 让插座、温湿度、红外页面保持相似的视觉结构。
### `android/app/src/main/kotlin/com/flagship/abox/manager/ui/devicecontrol/SocketControlScreen.kt`
新增智能插座控制页面。
- 智能插座
- 温湿度传感器
- 红外控制器
当前实现范围：
- 显示插座状态文本。
- 提供刷新状态、打开、关闭三个操作入口。
- 当前使用本地 Compose state 作为占位状态。
- 展示设备类别入口 UI。
- 保持 Kotlin Compose 实现。
- 为每个设备类别暴露点击回调。
- 不在本分支实现 App 入口接入、设备详情 route 或设备控制页面。
对接 API：
```kotlin
DeviceListScreen(
onSocketClick = { /* 后续跳转到智能插座模块 */ },
onTemperatureHumidityClick = { /* 后续跳转到温湿度模块 */ },
onInfraredClick = { /* 后续跳转到红外控制器模块 */ },
)
```
后续接入点：
- 通过 ViewModel 接入 `SocketGateway.getStatus(...)`。
- 通过 ViewModel 接入 `SocketGateway.setPower(...)`。
### `android/app/src/main/kotlin/com/flagship/abox/manager/ui/devicecontrol/TemperatureHumidityScreen.kt`
新增温湿度状态页面。
当前实现范围：
- 显示温度值。
- 显示湿度值。
- 提供刷新温湿度按钮。
- 当前使用本地 Compose state 作为占位状态。
后续接入点：
- 通过 ViewModel 接入 `TemperatureHumidityGateway.getReading(...)`。
### `android/app/src/main/kotlin/com/flagship/abox/manager/ui/devicecontrol/InfraredControlScreen.kt`
新增红外遥控器页面。
当前实现范围：
- 输入红外设备名称。
- 输入红外按键 KEY。
- 提供发送红外按键操作。
- 提供学习红外按键操作。
- 当前使用本地 Compose state 作为占位状态。
后续接入点：
- 通过 ViewModel 接入 `InfraredGateway.sendKey(...)`。
- 通过 ViewModel 接入 `InfraredGateway.learnKey(...)`。
- 由负责 App shell 或对应设备模块的同学，在各自分支中挂载这个页面，并把这些回调连接到他们自己的详情路由或功能模块。
## 架构说明
@@ -291,37 +153,22 @@ docs/device-control-compose-ui-change-log.md
- 使用 Kotlin，而不是 Java。
- 使用 Jetpack Compose，而不是 XML layout。
- 使用单 Activity 架构，而不是多个 Activity 跳转。
- 使用 Navigation Compose，而不是 `Intent` 页面跳转。
- 通过外部回调保持与 Navigation Compose 的兼容性。
- 尽量复用已有 design system 中的组件封装。
本分支没有把之前个人实验项目中的 Java/XML 模块直接复制进团队仓库。
## ABSDK 接入说明
本次新增的 Compose UI 页面没有直接调用 ABSDK。
当前仓库中已经存在较正式的 domain 抽象和 ABSDK bridge：
- `SocketGateway`
- `TemperatureHumidityGateway`
- `InfraredGateway`
- `AbsdkBridge`
- `VendorAbsdkClient`
因此后续真实设备控制逻辑建议通过 ViewModel 调用 domain gateway，而不是在 Compose UI 中直接调用 ABSDK。
推荐后续工作：
- 为插座页面新增 ViewModel。
- 为温湿度页面新增 ViewModel。
- 为红外页面新增 ViewModel。
- 在 ViewModel 中调用对应 gateway。
- 将调用结果转换为 Compose UI state。
## 本分支未包含的内容
本分支暂不包含：
- App 入口修改。
- App shell 或登录路由修改。
- 设备控制 navigation graph 文件。
- 智能插座控制页面。
- 温湿度状态页面。
- 红外控制器操作页面。
- 设备详情控制页面共用组件。
- Compose UI 中直接调用 ABSDK。
- 新增 Java Activity。
- 新增 XML layout。
@@ -329,16 +176,20 @@ docs/device-control-compose-ui-change-log.md
- 完整登录/session 与设备 gateway 的联动。
- 红外学习按键的持久化存储。
这些内容建议在团队确认架构之后，作为后续 branch 或后续 commit 继续实现。
这些内容建议由对应模块负责人在后续 branch 或后续 commit 中继续实现。
## 验证
- 本地验证过程中已从 Android Studio 成功 build/run `android.app`。
- 修剪职责范围后，`:android:app:assembleDebug` 构建成功。
## 预期提交范围
本次提交范围应限制在：
```text
android/app/src/main/kotlin/com/flagship/abox/manager/ui/ABoxManagerApp.kt
android/app/src/main/kotlin/com/flagship/abox/manager/ui/devicecontrol/
android/app/src/main/kotlin/com/flagship/abox/manager/ui/devicecontrollist/DeviceListScreen.kt
docs/device-control-compose-ui-change-log.md
```
`settings.gradle.kts` 当前不属于本次设备控制 UI 功能提交范围，除非团队明确认为本地 toolchain resolver 配置也需要进入 PR。
`settings.gradle.kts` 当前不属于本次设备列表 UI 功能提交范围。本地 Gradle/JDK/toolchain 配置应在开发者本机处理，不应修改团队提供的项目配置文件。