Column

img

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
//SpaceEvenly每一個佈局間的間隔是一樣的
Column(
  modifier = Modifier
    .size(200.dp)
    .background(Color.Green),
  verticalArrangement = Arrangement.SpaceEvenly
){
//Modifier.weight(1f) 比重 fill預設為TRUE,填滿所有空間
  //先佈局沒有分配比重的Text(),剩餘的空間就分配給有比重
  Text(
    "Column First Item",
    modifier = Modifier.weight(1f, true)
  )
  Text("Column Second Item")
}

img

1
modifier = Modifier.weight(1f, false)   

img

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
//SpaceEvenly每一個佈局間的間隔是一樣的
Column(
  modifier = Modifier
    .size(200.dp)
    .background(Color.Green),
  verticalArrangement = Arrangement.SpaceEvenly
){
//Modifier.weight(1f) 比重 fill預設為TRUE,填滿所有空間
  //先佈局沒有分配比重的Text(),剩餘的空間就分配給有比重
  Text(
    "Column First Item",
    modifier = Modifier.weight(1f, true)
  )
  Text("Column Second Item",
    modifier = Modifier.weight(1f, true))
}

img

增加spacer

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
Column(
  modifier = Modifier
    .size(200.dp)
    .background(Color.Green)
){
//Modifier.weight(1f) 比重 fill預設為TRUE,填滿所有空間
  //先佈局沒有分配比重的Text(),剩餘的空間就分配給有比重
  Text(
    "Column First Item",
    modifier = Modifier.background(Color.Red)
  )
  Spacer(modifier = Modifier.height(10.dp))
  Text("Column Second Item",
    modifier = Modifier.background(Color.Red))
}

img

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
//SpaceEvenly每一個佈局間的間隔是一樣的
Column(
  modifier = Modifier
    .size(200.dp)
    .background(Color.Green),
  verticalArrangement = Arrangement.SpaceEvenly
) {
  //Modifier.weight(1f) 比重 fill預設為TRUE,填滿所有空間
  //先佈局沒有分配比重的Text(),剩餘的空間就分配給有比重
  Text(
    "Column First Item",
    modifier = Modifier.weight(1f, false)
  )
  Text("Column Second Item")
}

img

results matching ""

    No results matching ""