如何在 Jetpack Compose 中将图像从一个可组合函数传递到另一个函数？

Question

我正在开发一个带有文本和图像的应用程序。在一个可组合项 (activity) 上，图像看起来很小，就像缩略图一样，旁边是文本。这个想法是：当用户触摸（单击）图像时，导航组件会将用户带到另一个可组合项 (activity) 中该图像的全屏版本。有可能吗？如果是，如何？提前致谢。

Answer 1

您应该传递一些东西来识别图像，而不是传递图像本身。例如：

如果您从资源文件夹加载图像，您应该传递资源 ID（即 R.drawable.your_image）；
如果您正在使用 assets 文件夹或一些远程 URL，您应该传递图像 Uri（即 /path_in_assets/your_image 或 https://foo.bar/your_image） .

然后您可以使用 Intent 附加功能将图像 ID 从“ListActivity”传递给下一个 activity。

startActivity(
    Intent(context, DetailsActivity::class.java).apply {
        putExtra("imageId", yourImageId) // resource ID or image URL
    }
)

在“DetailsActivity”中，在 onCreate 方法内，您将获得图像 ID 并正确加载它...

class DetailsActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        // for uri ID
        val imageId = intent.getStringExtra("imageId")
        // for resource ID
        val imageId = intent.getIntExtra("imageId", -1)

        setContent {
            YourAppTheme {
                YourScreen(imageId)
            }
        }
    }
}

最后，在您的可组合项中，您可以使用以下方法根据资源 ID 加载图像：

Image(painter = painterResource(id = imageId), contentDescription = null)

或将 Coil 用于 URL 资源：

Image(painter = rememberAsyncImagePainter(imageId), contentDescription = null)

如何在 Jetpack Compose 中将图像从一个可组合函数传递到另一个函数？

How to pass an image from one composable function to another in Jetpack Compose?

navigation

android

image

android-jetpack-compose