兼容与共生：如何在旧项目中优雅地引入 Compose？

前言

作为一名 Android 老兵，我们面临的最现实问题往往不是"如何写一个全新的 Compose 项目"，而是"如何在拥有成百上千个 Activity/Fragment 的旧项目中引入 Compose"。

你不可能一夜之间推翻重来。幸运的是，Google 在设计 Compose 之初就考虑到了这一点，提供了极其强大的互操作性（Interoperability）。

今天，我们就来聊聊 Compose 与传统 View 体系的"双向奔赴"：如何在 XML 里塞进 Compose，以及如何在 Compose 里调用那些复杂的旧插件。

一、场景 A：在 View 体系中引入 Compose (Top-down)

这是最常见的场景：你想用 Compose 写一个新功能，或者重构某一个复杂的列表项。

1. 使用 ComposeView

在 XML 布局中，你可以直接放置一个 ComposeView 作为占位符：

xml 复制代码

<androidx.compose.ui.platform.ComposeView
    android:id="@+id/compose_view"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" />

然后在 Activity/Fragment 中绑定：

kotlin 复制代码

binding.composeView.setContent {
    MatherialTheme {
        MyNewComposeFeature()
    }
}

2. 在 Fragment 中使用

如果你想把一整个页面换成 Compose，直接在 onCreateView 中返回 ComposeView 即可，甚至连 XML 都不需要了。

老兵 Tips ：记得设置 ViewCompositionStrategy。默认情况下，Compose 会在 View 从窗口移除时销毁。在 Fragment 中，建议设置为 DisposeOnViewTreeLifecycleDestroyed，以匹配 Fragment 的生命周期。

二、场景 B：在 Compose 中调用传统 View (Bottom-up)

有些复杂的旧插件（如谷歌地图 Google Maps、WebView、或者公司内部沉淀的视频播放器）还没有 Compose 版本。

使用 AndroidView

kotlin 复制代码

@Composable
fun LegacyWebView(url: String) {
    AndroidView(
        factory = { context ->
            WebView(context).apply {
                webViewClient = WebViewClient()
            }
        },
        update = { webView ->
            webView.loadUrl(url)
        }
    )
}

factory：只在第一次组合时运行，用于创建 View 实例。
update ：在重组时运行。如果 url 变了，update 块会被触发，你可以在这里更新 View 的属性。

三、状态同步：两个世界的桥梁

混合开发最难的是数据同步。

View -> Compose ：将 View 的监听器转换为 Compose 的 MutableState。
Compose -> View ：在 AndroidView 的 update 块中，根据 Compose 状态调用 View 的 Setter 方法。
ViewModel 共享 ：这是终极方案。由于 Compose 和 View 都可以绑定到同一个 ViewModel（通过 Activity 作用域），你可以让两套体系观察同一个 StateFlow，实现真正的无缝衔接。

四、给开发者的混编建议

从"叶子节点"开始重构：不要一上来就改 Activity。先从一个小按钮、一个复杂的列表 Item 开始。
主题统一 ：这是视觉灾难的高发区。如果你在旧体系用了 AppCompat 主题，在 Compose 中需要通过 Adapter（如 MdcTheme）将 XML 颜色映射到 Compose 的 MaterialTheme。
性能陷阱 ：避免在 AndroidView 的 update 块中执行耗时操作。虽然它能工作，但频繁重组时会导致 View 的 Setter 被过度调用。

结语

Compose 与 View 的混编不是一种权宜之计，而是一个长期的过渡状态。掌握了双向互操作，你就拥有了"渐进式重构"的主动权。你可以一边保持业务的稳定运行，一边享受声明式 UI 带来的开发红利。

下一篇我们将开启最终阶段：Compose Multiplatform 揭秘：一套代码如何搞定 Android、iOS、Desktop 和 Web。

如果你觉得有帮助，欢迎点赞关注，我们在代码上演进，在原理上深耕。

兼容与共生：如何在旧项目中优雅地引入 Compose？

前言

一、 场景 A：在 View 体系中引入 Compose (Top-down)