Modifier の width と requiredWidth と wrapContentWidth

↑の3番目について

wrapContentWith() を指定すると、そのコンテンツの計測したサイズが指定された minWidth よりも小さい場合、minWidth の幅の中に align（デフォルトでは Alignment.CenterHorizontal） で配置される。
↑の3番目では、"Hello" の横幅が指定された minWidth の 70.dp よりも小さいので、70.dp の幅の真ん中に Text が配置されている。

50.dp の Box の中に Text を配置している。

1番目は Text に width として 50.dp よりも大きい 100.dp を指定しているが、parent の maxWidth である 50.dp が利用される。

2番目は requiredWidth で 100.dp を指定しているので、parent の maxWidth によらずそれが利用される。

3番目は wrapContentWidth() を指定していて、かつ "Hello World" の幅が 50.dp よりも大きいが unbounded が false（デフォルトは false） なので parent の maxWidth が利用される。

4〜6番目は wrapContentWidth() を指定していて、かつ "Hello World" の幅が 50.dp よりも大きく unbounded が true なので "Hello World" の幅が利用され、align の指定にそって配置される。

view plainprint?

1. Box(  
2.     Modifier  
3.         .size(50.dp)  
4.         .background(Color.LightGray)  
5. ) {  
6.     GrayText(  
7.         "Hello Android",  
8.         modifier = Modifier  
9.             .width(100.dp)  
10.     )  
11. }  
12.   
13. Spacer(Modifier.height(24.dp))  
14.   
15. Box(  
16.     Modifier  
17.         .size(50.dp)  
18.         .background(Color.LightGray)  
19. ) {  
20.     GrayText(  
21.         "Hello Android",  
22.         modifier = Modifier  
23.             .requiredWidth(100.dp)  
24.     )  
25. }  
26.   
27. Spacer(Modifier.height(24.dp))  
28.   
29. Box(  
30.     Modifier  
31.         .size(50.dp)  
32.         .background(Color.LightGray)  
33. ) {  
34.     GrayText(  
35.         "Hello Android",  
36.         modifier = Modifier  
37.             .wrapContentWidth()  
38.     )  
39. }  
40.   
41. Spacer(Modifier.height(24.dp))  
42.   
43. Box(  
44.     Modifier  
45.         .size(50.dp)  
46.         .background(Color.LightGray)  
47. ) {  
48.     GrayText(  
49.         "Hello Android",  
50.         modifier = Modifier  
51.             .wrapContentWidth(align = Alignment.Start, unbounded = true)  
52.     )  
53. }  
54.   
55. Spacer(Modifier.height(24.dp))  
56.   
57. Box(  
58.     Modifier  
59.         .size(50.dp)  
60.         .background(Color.LightGray)  
61. ) {  
62.     GrayText(  
63.         "Hello Android",  
64.         modifier = Modifier  
65.             .wrapContentWidth(align = Alignment.CenterHorizontally, unbounded = true)  
66.     )  
67. }  
68.   
69. Spacer(Modifier.height(24.dp))  
70.   
71. Box(  
72.     Modifier  
73.         .size(50.dp)  
74.         .background(Color.LightGray)  
75. ) {  
76.     GrayText(  
77.         "Hello Android",  
78.         modifier = Modifier  
79.             .wrapContentWidth(align = Alignment.End, unbounded = true)  
80.     )  
81. }  

Box( Modifier .size(50.dp) .background(Color.LightGray) ) { GrayText( "Hello Android", modifier = Modifier .width(100.dp) ) } Spacer(Modifier.height(24.dp)) Box( Modifier .size(50.dp) .background(Color.LightGray) ) { GrayText( "Hello Android", modifier = Modifier .requiredWidth(100.dp) ) } Spacer(Modifier.height(24.dp)) Box( Modifier .size(50.dp) .background(Color.LightGray) ) { GrayText( "Hello Android", modifier = Modifier .wrapContentWidth() ) } Spacer(Modifier.height(24.dp)) Box( Modifier .size(50.dp) .background(Color.LightGray) ) { GrayText( "Hello Android", modifier = Modifier .wrapContentWidth(align = Alignment.Start, unbounded = true) ) } Spacer(Modifier.height(24.dp)) Box( Modifier .size(50.dp) .background(Color.LightGray) ) { GrayText( "Hello Android", modifier = Modifier .wrapContentWidth(align = Alignment.CenterHorizontally, unbounded = true) ) } Spacer(Modifier.height(24.dp)) Box( Modifier .size(50.dp) .background(Color.LightGray) ) { GrayText( "Hello Android", modifier = Modifier .wrapContentWidth(align = Alignment.End, unbounded = true) ) }