Arrangement.spacedBy()

Arrangement.spacedBy() を使うと、Column や Row の要素間に同じ大きさの余白を設けることができます。

Spacer で余白を実装する場合、上端や下端に余白が入らないように index を使った制御が必要になります。

view plainprint?

1. Column {  
2.     list.forEachIndexed { index, item ->  
3.         if (index > 0) {  
4.             Spacer(Modifier.height(8.dp))  
5.         }  
6.   
7.         ListItem(...)  
8.     }  
9. }  

Column { list.forEachIndexed { index, item -> if (index > 0) { Spacer(Modifier.height(8.dp)) } ListItem(...) } } Arrangement.spacedBy() を使う場合、Spacer や index を使った制御が不要になるほか、if 文で要素を表示しないときに余白も自動で表示されなくなります。

view plainprint?

1. Column(  
2.     verticalArrangement = Arrangement.spacedBy(8.dp)  
3. ) {  
4.     list.forEach { item ->  
5.         ListItem(...)  
6.     }  
7. }  

Column( verticalArrangement = Arrangement.spacedBy(8.dp) ) { list.forEach { item -> ListItem(...) } }