我正在开发使用Jetpack composable将框中的可组合对象划分为列的形式。我想知道其他可组合对象是否会受到框中可组合对象大小的影响，并且可以自动调整大小。
日历的形状会随着TopAppBar中自定义切换开关的变化而变化，根据日历的形状，我想改变日历下面的框的Row类型文本的大小，比如被拉、被推。
我该怎么修呢？
代码：
val states = listOf("월간", "주간")
var selectedOption by remember { mutableStateOf(states[0]) }
val onSelectionChange = { text: String -> selectedOption = text }
var isVisible by remember { mutableStateOf(false) }
Scaffold(topBar = {
TopAppBar(title = {
Box(modifier = Modifier.fillMaxWidth(), contentAlignment = Alignment.Center) {
Row(modifier = Modifier
.width(115.dp)
.height(35.dp)
.clip(shape = RoundedCornerShape(24.dp))
.background(Color(0xffe9e9ed))
.padding(start = 10.dp, end = 5.dp, top = 6.dp, bottom = 5.dp)) {
states.forEach { text ->
Text(text = text,
fontSize = 10.sp,
lineHeight = 16.sp,
color = if (text == selectedOption) {
Color.Black
} else {
Color.Gray
},
fontWeight = FontWeight.Medium,
modifier = Modifier
.clip(shape = RoundedCornerShape(24.dp))
.clickable {
onSelectionChange(text)
isVisible = (text == states[1])
// isVisible = !isVisible
}
.background(if (text == selectedOption) {
Color.White
} else {
Color(0xffe9e9ed)
})
.padding(
vertical = 5.dp,
horizontal = 16.dp,
))
}
}
}
},
actions = {
IconButton(onClick = {
goDetailProfile(NAV_ROUTE.PROFILE, routeAction)
}) {
Icon(imageVector = Icons.Filled.Menu, contentDescription = "profile")
}
},
colors = TopAppBarDefaults.smallTopAppBarColors(containerColor = Color.White,
titleContentColor = Color.Black))
}) {
Column(
modifier = Modifier
.fillMaxSize()
.background(Color(0xfff0f0f0))) {
Box(
modifier = Modifier
.fillMaxWidth()
.aspectRatio(1f),
) {
Box(
modifier = Modifier
.fillMaxSize()
.clip(shape = RoundedCornerShape(bottomStart = 30.dp, bottomEnd = 30.dp))) {
if (isVisible) {
Kalendar(
modifier = Modifier
.fillMaxWidth()
.padding(top = 45.dp)
.clip(shape = RoundedCornerShape(bottomStart = 30.dp,
bottomEnd = 30.dp)),
kalendarHeaderConfig = KalendarHeaderConfig(
kalendarTextConfig = KalendarTextConfig(
kalendarTextColor = KalendarTextColor(Color.Black),
kalendarTextSize = KalendarTextSize.SubTitle)
),
// kalendarEvents = List<KalendarDay> (
// size = ,
// init =
// ),
kalendarType = KalendarType.Oceanic(),
kalendarDayColors = KalendarDayColors(Color.Black, Color.Black),
kalendarThemeColor = KalendarThemeColor(backgroundColor = Color.White,
dayBackgroundColor = Color(0xffFBE3C7),
headerTextColor = Color.Black),
onCurrentDayClick = { kalendarDay: KalendarDay, kalendarEvents: List<KalendarEvent> ->
year = kalendarDay.localDate.year
month = kalendarDay.localDate.monthNumber
day = kalendarDay.localDate.dayOfMonth
readTodo(token, year, month, day, response = {
todoList.clear()
for (i in it!!.data) {
todoList.add(i)
}
})
})
} else {
Kalendar(
modifier = Modifier
.fillMaxWidth()
.padding(top = 25.dp)
.clip(
shape = RoundedCornerShape(
bottomStart = 30.dp,
bottomEnd = 30.dp)),
kalendarHeaderConfig = KalendarHeaderConfig(kalendarTextConfig = KalendarTextConfig(
kalendarTextColor = KalendarTextColor(Color.Black),
kalendarTextSize = KalendarTextSize.SubTitle)),
// com.himanshoe.kalendar.component.day.KalendarDay(kalendarDay =,
// selectedKalendarDay =,
// kalendarDayColors =,
// dotColor =,
// dayBackgroundColor =),
// kalendarEvents = List<KalendarEvent>(
//
// ),
kalendarType = KalendarType.Firey,
kalendarDayColors = KalendarDayColors(Color.Black, Color.Black),
kalendarThemeColor = KalendarThemeColor(backgroundColor = Color.White,
dayBackgroundColor = Color(0xffFBE3C7),
headerTextColor = Color.Black),
onCurrentDayClick = { kalendarDay: KalendarDay, kalendarEvents: List<KalendarEvent> ->
year = kalendarDay.localDate.year
month = kalendarDay.localDate.monthNumber
day = kalendarDay.localDate.dayOfMonth
readTodo(token, year, month, day, response = {
todoList.clear()
for (i in it!!.data) {
todoList.add(i)
}
})
})
}
}
}
Box(
modifier = Modifier
.fillMaxWidth()
.aspectRatio(1f)
.padding(top = 30.dp)
) {
Box(
modifier = Modifier
.fillMaxSize()
) {
Row(
modifier = Modifier
.fillMaxWidth()
.padding(start = 21.dp, end = 21.dp),
horizontalArrangement = Arrangement.Center,
verticalAlignment = Alignment.CenterVertically
) {
Text(
text = day.toString(),
fontSize = 26.sp,
fontWeight = FontWeight.Bold,
modifier = Modifier.padding(end = 5.dp)
)
Divider(
modifier = Modifier
.fillMaxWidth()
.padding(start = 5.dp),
color = Color(0xffD8D8D8)
)
}
Box(
modifier = Modifier
.fillMaxSize()
.padding(top = 50.dp),
contentAlignment = Alignment.TopCenter
) {
TodoItemList(Todo = todoList)
}
}
}
}
}第一节第一节第一节第一节第一次
1条答案
按热度按时间ogq8wdun1#
我正在Jetpack Compose中开发一个日历应用程序，我使用
Column组合来构建UI。首先，我组合MonthView或WeekView，然后我组合TasksList。通过这样做，当用户在MonthView和WeekView之间切换时，TasksList将自动通过Column布局进行调整。