Compos Modifier

padding(边距)

* 在设置size之前设置相当于外边距
* 在设置size之后设置相当于内边距,组件大小不变
* 设置背景,对应背景来说,在它之前设置的也相当于外边距
* 同理点击区域的大小也一样的

background(背景)

Color 单色 或者 Brush 多色混合   https://developer.android.google.cn/reference/kotlin/androidx/compose/ui/graphics/Brush
你想设置背景图片?
你可以使用
drawBehind

drawBehind(在组件背后绘制)

这是一个绘制背景的例子
val bgImg = LocalContext.current.getDrawable(R.mipmap.bg)
Modifier.drawBehind {
            bgImg?.updateBounds(0, 0, size.width.toInt(), size.height.toInt())
            bgImg?.draw(drawContext.canvas.nativeCanvas)
        }

clickable(点击事件)

size(布局大小)

animateContentSize( 为其自己的大小改变设置动画)

@Composable
private fun CardContent(name: String) {
    var expanded by remember { mutableStateOf(false) }

    Row(
        modifier = Modifier
            .padding(12.dp)
            .animateContentSize(
                animationSpec = spring(
                    dampingRatio = Spring.DampingRatioMediumBouncy,
                    stiffness = Spring.StiffnessLow
                ),
                finishedListener = { _: IntSize, _: IntSize ->
                    expanded = !expanded
                }
            )
    ) {
        Column(
            modifier = Modifier
                .weight(1f)
                .padding(12.dp)
        ) {
            Text(text = "Hello, ")
            Text(
                text = name,
                style = MaterialTheme.typography.h4.copy(
                    fontWeight = FontWeight.ExtraBold
                )
            )
            if (expanded) {
                Text(
                    text = ("Composem ipsum color sit lazy, " +
                        "padding theme elit, sed do bouncy. ").repeat(4),
                )
            }
        }
        IconButton(onClick = { expanded = !expanded }) {
            Icon(
                imageVector = if (expanded) Filled.ExpandLess else Filled.ExpandMore,
                contentDescription = if (expanded) {
                    stringResource(R.string.show_less)
                } else {
                    stringResource(R.string.show_more)
                }

            )
        }
    }
}

 

posted @ 2022-05-30 11:40  勤奋的小铁  阅读(42)  评论(0编辑  收藏  举报