たくさんの自由帳

Jetpack Compose の AndroidView で SurfaceView を使うとはみ出して真っ暗になる

投稿日 : | 0 日前

文字数(だいたい) : 508

目次

どうもこんばんわ。
もうすでにIssue Trackerで解決策が書いてありますが

本題

Android 12以上と未満で表示が崩れてしまった。
はみ出して背景が真っ暗になってしまった。

Android 11Android 12
ImgurImgur

なおしかた

AndroidViewにModifier.clipToBoundsをつければ終わり。
ありがとうIssue Tracker。

https://issuetracker.google.com/issues/283147300

@Composable
fun ComposeSurfaceView(
    modifier: Modifier = Modifier,
    onCreateSurface: (SurfaceHolder) -> Unit,
    onSizeChanged: (width: Int, height: Int) -> Unit,
    onDestroySurface: () -> Unit
) {
    AndroidView(
        modifier = modifier.clipToBounds(), // Android 11 以前で AndroidView + SurfaceView すると背景が真っ暗になるので必要
        factory = { context ->
            SurfaceView(context).apply {
                holder.addCallback(object : SurfaceHolder.Callback {
                    override fun surfaceCreated(holder: SurfaceHolder) = onCreateSurface(holder)
                    override fun surfaceChanged(holder: SurfaceHolder, format: Int, width: Int, height: Int) = onSizeChanged(width, height)
                    override fun surfaceDestroyed(holder: SurfaceHolder) = onDestroySurface()
                })
            }
        }
    )
}