我想从我的回调中打开WebView.但我收到了以下错误

@Composable invocations can only happen from the context of a @Composable function

这个代码片段就是问题所在

onNewsLinkedClicked = { newsLink ->
                            WebViewScreen(webLink = newsLink)
                        }

我确实try 过在NewsScreen函数中声明我的lambda,如下所示.

onNewsLinkedClicked: @Composable (newsLink: String) -> Unit

这解决了下面的问题.但后来我遇到了另一个问题,当我从Button onClick事件启动回调时,开始给我一个错误.

对于我下面的代码,有什么方法可以做到这一点吗?

@AndroidEntryPoint
class MainActivity : ComponentActivity() {

    @OptIn(ExperimentalMaterial3Api::class)
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            val newsViewModel: NewsViewModel = hiltViewModel()
            val newsHeadLines = newsViewModel.newsPager.collectAsLazyPagingItems()

            BeerPagingTheme {
                // A surface container using the 'background' color from the theme
                val scrollBehavior = enterAlwaysScrollBehavior()

                Surface(
                    modifier = Modifier.fillMaxSize(),
                    color = MaterialTheme.colorScheme.background
                ) {
                    NewsScreen(
                        newsPagingData = newsHeadLines,
                        modifier = Modifier
                            .fillMaxSize()
                            .nestedScroll(connection = scrollBehavior.nestedScrollConnection),
                        topAppBarScrollBehavior = scrollBehavior,
                        onNewsLinkedClicked = { newsLink ->
                            WebViewScreen(webLink = newsLink)
                        }
                    )
                }
            }
        }
    }
}

@Composable
fun WebViewScreen(webLink: String) {
    AndroidView(
        factory = { context ->

            WebView(context).apply {
                this.layoutParams = ViewGroup.LayoutParams(
                    LayoutParams.MATCH_PARENT,
                    LayoutParams.MATCH_PARENT)

                loadUrl(webLink)
            } },
        update = { webView ->
            webView.loadUrl(webLink)
        },
        modifier = Modifier.fillMaxSize())
}

推荐答案

为了提高可伸缩性,我推荐使用Compose UI可用的众多导航解决方案中的一个.如果你想要一个纯粹的官方解决方案,那可以是合成的导航.如果你想要一个包装,考虑一下compose-destinations.如果你想要完全独立的东西,有AppyxVoyager以及许多其他的.

从战术上讲,您可以这样做:

            BeerPagingTheme {
                // A surface container using the 'background' color from the theme
                val scrollBehavior = enterAlwaysScrollBehavior()
                var newsLink by remember { mutableStateOf<String?>(null) }

                Surface(
                    modifier = Modifier.fillMaxSize(),
                    color = MaterialTheme.colorScheme.background
                ) {
                    if (newsLink == null) {
                        NewsScreen(
                            newsPagingData = newsHeadLines,
                            modifier = Modifier
                                .fillMaxSize()
                                .nestedScroll(connection = scrollBehavior.nestedScrollConnection),
                            topAppBarScrollBehavior = scrollBehavior,
                            onNewsLinkedClicked = { newsLink = it }
                        )
                    } else {
                        WebViewScreen(webLink = newsLink)
                    }
                }
            }

(注:我是凭记忆完成这项工作的,因此可能需要进行一些调整)

Compose是一个声明性react 性框架.你declare"这就是我想要的UI,基于当前状态".在本例中,当前状态为newsLink.你对那个状态的变化有react的react .因此,您的onClick lambda更新了状态(newsLink = it),导致Compose重新运行所有setContent()并基于新的声明更新UI.

Android相关问答推荐

在Android Studio Iguana 2023.2.1中,哪里可以找到能量分析器?

滑动以更改合成中的活动

如何使用Gradle风味在两个Kotlin导入(Google vs Amazon Java billing library)之间进行 Select ?

如何将结果从viewModelScope传递到活动

如何处理穿戴构图上的长点击事件?

如何从LazyColumn中的图标异步获取可绘制的加载?

我想使用代码自动重命名我的Android存储中的文件夹

Android手柄注射周期错误,多个模块引用一个核心模块

数据绑定在Android中等待填充值时显示未填充的值

我无法连接到信号机

LaunchedEffect没有延迟时应用程序崩溃

如何在同一行中滚动自定义布局和惰性列,就好像它们是一个组件一样

将 React Native 应用程序背景带到前台

Android - 如何使 TextInputEditText 的高度恰好为 2 行?

在模块 jetified-kotlin-stdlib-1.8.10 中发现重复的类 kotlin.random.jdk8,带有启动基准

Jetpack compose (Glance) 小部件在加载位图图像后不会重新组合

Jetpack Compose 动画的行为是什么?

Jetpack Compose Material3 禁用 ListItem

Jetpack compose 绘制形状

Android Jetpack Compose:如何让文本利用完整的行空间并将单词换行以防溢出?