android - 当创建它的参数发生变化时,如何替换 Android Jetpack Compose AndroidView?

标签 android kotlin android-view android-jetpack-compose

我有一个应用程序可以显示封装在 AndroidView 中的多个不同 View 。在下面要重现的简单示例中,这些只是 TextView 实例。问题是更改文本(在本例中循环显示三个不同的值)似乎不会更新应用程序显示的内容。

sealed class AppView
data class ShowSomeText(val text: String) : AppView()
data class SomeOtherState(val data: Any?) : AppView()
data class ShowSomeText2(val text: String) : AppView()

class AppViewModel : ViewModel() {

    var currentView = MutableLiveData<AppView>(ShowSomeText("original text"))
    var currentViewWorkaround = MutableLiveData<AppView>(ShowSomeText("original text"))


    private val textRing = arrayOf("one", "two", "three")
    private var textRingPosition = 0

    fun incrementTextState() {
        val nextState = ShowSomeText(textRing[textRingPosition])
        currentView.postValue(nextState)

        val nextStateWorkaround = when(currentViewWorkaround.value) {
            is ShowSomeText -> ShowSomeText2(textRing[textRingPosition])
            else -> ShowSomeText(textRing[textRingPosition])
        }
        currentViewWorkaround.postValue(nextStateWorkaround)
        textRingPosition = (textRingPosition + 1) % textRing.size
    }
}

class MainActivity : AppCompatActivity() {

    private val viewModel = AppViewModel()

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            ViewContainer(viewModel)
        }
    }
}

@Composable
fun ViewContainer(viewModel: AppViewModel) {

    // Add this to gradle.build for the observeAsState function:
    //     implementation "androidx.compose.runtime:runtime-livedata:$compose_version"
    val currentView: AppView by viewModel.currentView.observeAsState(ShowSomeText("starting text"))
    val currentViewWorkaround: AppView by viewModel.currentViewWorkaround.observeAsState(ShowSomeText("starting text"))

    Column {
        Button(onClick = viewModel::incrementTextState) {
            Text(
                text = "tap to change",
                style = TextStyle(fontSize = 12.em)
            )
        }
        Text("Compose Text")
        when (currentView) {
            is ShowSomeText -> createComposeTextView((currentView as ShowSomeText).text)
            is SomeOtherState -> Text("the other state")
        }
        Text("AndroidView wrapping TextView")
        when (currentView) {
            is ShowSomeText -> createAndroidViewForTextView((currentView as ShowSomeText).text)
            is SomeOtherState -> Text("the other state")
        }
        Text("AndroidView wrapping TextView with 2-state workaround")
        when (currentViewWorkaround) {
            is ShowSomeText -> createAndroidViewForTextView((currentViewWorkaround as ShowSomeText).text)
            is ShowSomeText2 -> createAndroidViewForTextView((currentViewWorkaround as ShowSomeText2).text)
            is SomeOtherState -> Text("the other state")
        }
    }

}

@Composable
fun createAndroidViewForTextView(text: String) {
    val context = ContextAmbient.current
    val tv = remember(text, context) {
        val x = TextView(context)
        x.text = text
        x.textSize = 48.0f
        x
    }
    AndroidView({ tv })
}

@Composable
fun createComposeTextView(text: String) {
    Text(text, style = TextStyle(fontSize = 12.em))
}

第一个文本通过 Compose Text 函数显示并且有效,第二个文本使用 TextView 包装了 AndroidView Compose 函数但不起作用,第三个文本也使用相同的 AndroidView 包装器但通过使用另一个状态变量以某种方式触发更改。

为什么中间文本不更新?

使用 hack 修复复制 kt 文件的完整要点:https://gist.github.com/okhobb/ba7791af4562ea672d0c52769a7cd8ba

============

更新:基于已接受答案的工作代码:

@Composable
fun TraditionalViewAsComposable(text: String){

    var updatableString by remember{mutableStateOf("")}
    updatableString = text

    AndroidView(
        factory={ TextView(it).apply {
            this.text = text
            this.textSize = 48.0f
        } },
        update={ it.text = updatableString }
    )
}

最佳答案

AndroidView() 可组合项默认情况下不会在状态更改时重新组合。您必须通过显式定义更新参数来“选择加入”以收听状态。

所以语法应该是这样的:

@Composable
fun TraditionalViewAsComposable(initialString:String){
    var updatableString by remember{mutableStateOf("")}
    AndroidView(factory={it:Context->
        TraditionalView(it).apply{this:TraditionalView->
            this.property=initialString
        },
        update={it:TraditionalView->
            it.property=updatableString
            },
        modifier=Modifier
        )
}

关于android - 当创建它的参数发生变化时,如何替换 Android Jetpack Compose AndroidView?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/64189317/

相关文章:

Android RelativeLayout,隐藏 View 并将 View 向上推

java - arrayListOf(),sortedWith,compareBy与Java等效

android - 使用 onDraw 扩展 android 按钮

Android - 如何将 View 的 x 和 y 坐标放入 gridLayout 中?

android - aChartEngine:使用多种颜色绘制系列下方的区域时不显示底层系列

android - 如何生成新的应用程序签名 key 并添加到 android 中的现有 keystore

android - onIBeaconServiceConnect() 在 android 中没有被调用

android - 在Interceptor中抛出IOException会导致Retrofit崩溃

java - 在Android导航架构中,如何从主机( Activity )调用目标 fragment 的方法之一

android - 可以在 x 和 y 坐标上跟踪 SeekBar 的拇指吗?