KMM_Compose 获取当前容器或父视图的尺寸size

mikimo

发布于 2024-07-09 08:28:48

1320

发布于 2024-07-09 08:28:48

获取当前容器或父视图的尺寸可以使用 onGloballyPositioned，不过拿到的是像素点。

var containerSize by remember { mutableStateOf(IntSize.Zero) }
println("momo: container size = ${containerSize}")
Box(
	modifier = Modifier
		.background(color = Color.Red)
		.fillMaxSize()
		.onGloballyPositioned {
			// 这里拿到尺寸后会刷新当前视图
			containerSize = it.size // 这里拿到的是像素!! pixel
		},
		contentAlignment = Alignment.Center
	) {
		Box(
			modifier = Modifier
				.background(color = Color.Blue)
				// 蓝色方块设置为 父视图红色方块 的 1/4 大小
				.width((containerSize.width / 2).pxToDp())
				.height((containerSize.height / 2).pxToDp())
		) {
			// display some compose
		}
	}

将像素点转化为 dp，因双端接口不一致，所以需要分别实现：

commonMain 里声明统一的接口：

/**
 * dp 转 pixel
 */
internal expect fun dpToPx(dp: Float): Float

/**
 * piexl 转 dp
 */
internal expect fun pixelToDp(pixel: Float): Float

iOSMain 里的实现：

import platform.UIKit.UIScreen

internal actual fun dpToPx(dp: Float): Float {
    val scale = UIScreen.mainScreen().scale.toFloat()
    return dp * scale
}
internal actual fun pixelToDp(pixel: Float): Float {
    val scale = UIScreen.mainScreen().scale.toFloat()
    return pixel / scale
}

androidMain 里的实现：

import android.content.res.Resources

internal actual fun dpToPx(dp: Float): Float {
    val density = Resources.getSystem().displayMetrics.density
    return dp * density + 0.5f
}

internal actual fun pixelToDp(pixel: Float): Float {
    val density = Resources.getSystem().displayMetrics.density
    return pixel / density + 0.5f
}

本文参与腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。

原始发表：2024-07-08，如有侵权请联系 cloudcommunity@tencent.com 删除

size