tt/VibeCoding_ComposeRemote
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(server): 完善远程 UI 页面内容并优化文档解析日志

Browse Source
This commit is contained in:
tongtongstudio
2026-08-14 10:54:11 +08:00
parent 2bb3255704
commit 3f4e2b2812
2 changed files with 65 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
ComposeRemoteAndroid/app/src/main/java/com/ttstd/composeremote/ui/RemoteUIScreen.kt
View File

@@ -79,17 +79,18 @@ private fun RemoteDocumentView(
key(contentKey) {
AndroidView(
factory = { ctx ->
Log.d("RemoteUIScreen", "Creating RemoteComposePlayer")
// 仅创建播放器实例
RemoteComposePlayer(ctx)
},
update = { view ->
try {
// 显式解析 ByteArray 为 RemoteDocument 对象
// 1. 将二进制显式解析为 RemoteDocument 对象
val document = RemoteDocument(bytes)
// 2. 使用 RemoteDocument 重载版本设置文档，确保解析与生命周期同步
view.setDocument(document)
Log.d("RemoteUIScreen", "RemoteDocument set successfully")
Log.d("RemoteUIScreen", "文档解析并加载成功: ${bytes.size} 字节")
} catch (e: Exception) {
Log.e("RemoteUIScreen", "Failed to set RemoteDocument", e)
Log.e("RemoteUIScreen", "文档解析失败", e)
}
},
modifier = modifier

66
ComposeRemoteServer/src/main/kotlin/com/ttstd/composeremote/server/RemoteDocumentBuilder.kt
View File

@@ -27,12 +27,66 @@ fun buildRemoteDocument(page: String): ByteArray {
)
val rcProfile = RcProfile(profile, false)
return createRcBuffer(rcProfile) {
Column(Modifier.fillMaxSize().background(0xFFFFFFFF.toInt()).padding(16f)) {
Text(
text = if (page == "home") "Home Page" else "Detail Page",
fontSize = RcSp(36f),
color = 0xFF0000FF.toInt() // Blue
)
//加了RcRoot会不显示
// RcRoot {
Column(Modifier.fillMaxSize().background(0xFFFFFFFF.toInt()).padding(16f)) {
when (page) {
"detail" -> detailContent()
else -> homeContent()
}
}
// }
}
}
private fun RcColumnScope.homeContent() {
Text(
text = "Remote Compose",
fontSize = RcSp(36f),
color = TITLE_COLOR,
modifier = Modifier.padding(0f, 0f, 0f, 4f)
)
Text(
text = "服务端驱动 UI · 演示",
fontSize = RcSp(18f),
color = BODY_COLOR,
modifier = Modifier.padding(0f, 0f, 0f, 16f)
)
Spacer(Modifier)
card(title = "首页", body = "这个界面由后端实时生成并下发二进制文档。")
Spacer(Modifier)
card(title = "技术栈", body = "Spring Boot 4 + Remote Compose 1.0.0-alpha17")
}
private fun RcColumnScope.detailContent() {
Text(
text = "详情页",
fontSize = RcSp(36f),
color = TITLE_COLOR,
modifier = Modifier.padding(0f, 0f, 0f, 4f)
)
Text(
text = "Detail",
fontSize = RcSp(18f),
color = BODY_COLOR,
modifier = Modifier.padding(0f, 0f, 0f, 16f)
)
Spacer(Modifier)
card(title = "接口", body = "GET /api/remote-ui/detail")
Spacer(Modifier)
card(title = "说明", body = "每个页面对应后端的一个独立接口，按需下发。")
}
private fun RcColumnScope.card(title: String, body: String) {
Box(Modifier.fillMaxWidth().background(CARD_BG).padding(16f)) {
Column(Modifier.fillMaxWidth()) {
Text(text = title, fontSize = RcSp(22f), color = TITLE_COLOR, modifier = Modifier)
Spacer(Modifier)
Text(text = body, fontSize = RcSp(15f), color = BODY_COLOR, modifier = Modifier)
}
}
}
private const val TITLE_COLOR = 0xFF0D47A1.toInt()
private const val BODY_COLOR = 0xFF212121.toInt()
private const val CARD_BG = 0xFFE3F2FD.toInt()