一个例子学会使用Jetpack Compose Modifier，面试的时候突然遇到答不上的问题怎么办

3.1 整体布局

---

Modifier.padding

我们使用Row、Column对Item内的元素进行了基本布局，但是元素之间缺少间距

Compose通过Modifier在Composable之间添加Padding

@Composable

fun Decorated() {

Row(

modifier = Modifier

.fillMaxWidth()

.preferredHeightIn(min = 64.dp)

.padding(8.dp) //外间隙

.border(1.dp, Color.LightGray, RoundedCornerShape(4.dp))

.padding(8.dp) //内间隙

) {

…

}

}

复制代码

如上，我们对Item整体添加Padding。 border前后各有一个padding，分别表示对外和对内的间距。相对于传统布局有Margin和Padding区分，Modifier中只有padding，根据调用链中的位置不同发挥不同作用，使用更加简单。

Modifier.border

border用来定义边框，RoundedCornerShape是一个Shape类型，用来指定边框的形状为圆角矩形。

我们还可以调用两次background来实现border的效果：

modifier = Modifier

.background(Color.LightGray)

.padding(1.dp) //两个backgound之间形成边框

.background(Color.White)

复制代码

Modifier.preferredHeight / Modifier.preferredHeightIn

preferedXXX等用来设置初始的size，例如preferedHeight可以设置Composable的默认高度，这个值可能被其他约束覆盖，若想要高度不被覆盖，就使用Modifier.height设置固定值

本例中使用preferedHeightIn，可以设置minHeight和<