Compose ConstraintLayout图片因参考线偏移至屏幕外问题求助

你的问题出在createGuidelineFromEnd的参数使用错误：

• createGuidelineFromStart(ratio)：参数是从屏幕左侧到 guideline 的距离占屏幕宽度的比例
• createGuidelineFromEnd(ratio)：参数是从屏幕右侧到 guideline 的距离占屏幕宽度的比例

你原本想让图片右侧保留0.17f的间距，却传了0.83f，这会导致这条右侧guideline的位置是距离屏幕右侧83%（也就是距离左侧17%），和左侧的guideline完全重合。此时图片的start和end都绑定到同一条线，再加上aspectRatio(1f)的约束，图片会以这条线为中心向左右扩展，自然就会有一半超出屏幕左侧。

修正后的代码 #

ConstraintLayout(
    modifier = Modifier.fillMaxSize()
) {
    val startImgGuideline = createGuidelineFromStart(0.17f)
    // 将右侧guideline的参数改为0.17f，代表距离右侧17%的位置
    val endImgGuideline = createGuidelineFromEnd(0.17f)

    Image(
        painter = painterResource(id = Icon.welcome),
        contentDescription = null,
        modifier = Modifier
            .constrainAs(image) {
                start.linkTo(startImgGuideline)
                end.linkTo(endImgGuideline)
                top.linkTo(parent.top)
            }
            .aspectRatio(1f)
    )
}

内容的提问来源于stack exchange，提问作者Vlad Alexeev