4.27 | 冲刺day9
完成发布社区活动页
package com.codelab.basiclayouts.app.MainScreen import android.util.Log import androidx.compose.foundation.border import androidx.compose.foundation.clickable import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.Spacer import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.height import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.size import androidx.compose.foundation.layout.width import androidx.compose.foundation.layout.wrapContentSize import androidx.compose.foundation.layout.wrapContentWidth import androidx.compose.foundation.shape.RoundedCornerShape import androidx.compose.foundation.text.BasicTextField import androidx.compose.material.icons.Icons import androidx.compose.material.icons.filled.ArrowDropDown import androidx.compose.material3.Button import androidx.compose.material3.ButtonDefaults import androidx.compose.material3.DropdownMenu import androidx.compose.material3.DropdownMenuItem import androidx.compose.material3.Icon import androidx.compose.material3.Text import androidx.compose.runtime.Composable import androidx.compose.runtime.getValue import androidx.compose.runtime.mutableStateOf import androidx.compose.runtime.remember import androidx.compose.runtime.setValue import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.graphics.Color import androidx.compose.ui.text.TextStyle import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.sp import androidx.navigation.NavHostController import com.codelab.basiclayouts.data.Data import com.codelab.basiclayouts.service.ActService import com.codelab.basiclayouts.service.ServiceCreator @Composable fun AddSocialPage(navController: NavHostController) { var name by remember { mutableStateOf("") } var date by remember { mutableStateOf("") } var time by remember { mutableStateOf("") } var selectedType by remember { mutableStateOf(0) } var person by remember { mutableStateOf("") } var limit by remember { mutableStateOf("") } var text by remember { mutableStateOf("") } val types = listOf("活动", "聊天", "求助", "其他") var isDropdownExpanded by remember { mutableStateOf(false) } // 用于显示当前选中的下拉框选项的文本 var selectedOptionText = remember { mutableStateOf(types[selectedType]) } Column( modifier = Modifier .fillMaxSize() .padding(16.dp) ) { // 文本提示输入活动名称 Text(text = "请输入活动名称:", fontSize = 18.sp) // 输入框 BasicTextField( value = name, onValueChange = { name = it }, textStyle = TextStyle(fontSize = 16.sp), // 调整字体大小 modifier = Modifier .fillMaxWidth() .padding(vertical = 8.dp) .border(1.dp, Color(0xFF87CEFA), RoundedCornerShape(8.dp)) // 边框 .padding(8.dp) // 内边距 ) Spacer(modifier = Modifier.height(16.dp)) // 并排输入框,一个输入日期一个输入时间 Row( modifier = Modifier.fillMaxWidth(), verticalAlignment = Alignment.CenterVertically ) { // 输入日期 Column( modifier = Modifier.weight(1f) ) { Text(text = "请选择日期:", fontSize = 18.sp) BasicTextField( value = date, onValueChange = { date = it }, textStyle = TextStyle(fontSize = 16.sp), // 调整字体大小 modifier = Modifier .fillMaxWidth() .padding(vertical = 8.dp) .border(1.dp, Color(0xFF87CEFA), RoundedCornerShape(8.dp)) // 边框 .padding(8.dp) // 内边距 ) } Spacer(modifier = Modifier.width(16.dp)) // 输入时间 Column( modifier = Modifier.weight(1f) ) { Text(text = "请选择时间:", fontSize = 18.sp) BasicTextField( value = time, onValueChange = { time = it }, textStyle = TextStyle(fontSize = 16.sp), // 调整字体大小 modifier = Modifier .fillMaxWidth() .padding(vertical = 8.dp) .border(1.dp, Color(0xFF87CEFA), RoundedCornerShape(8.dp)) // 边框 .padding(8.dp) // 内边距 ) } } Spacer(modifier = Modifier.height(16.dp)) // 下拉框和策划人姓名输入框 Row( modifier = Modifier.fillMaxWidth(), verticalAlignment = Alignment.CenterVertically ) { // 文本显示选中的选项 Text( text = selectedOptionText.value, fontSize = 18.sp, modifier = Modifier .weight(1f) .padding(end = 16.dp) // 添加右侧边距,使得下拉箭头与文本有间隔 ) // 下拉箭头 Icon( imageVector = Icons.Default.ArrowDropDown, contentDescription = "Dropdown", modifier = Modifier .size(24.dp) .clickable { isDropdownExpanded = !isDropdownExpanded } ) // Dropdown menu if (isDropdownExpanded) { DropdownMenu( expanded = isDropdownExpanded, onDismissRequest = { isDropdownExpanded = false }, modifier = Modifier .padding(start = 16.dp) // 左侧边距 .wrapContentWidth(Alignment.Start) // 使下拉菜单左对齐 .wrapContentSize() // Ensure dropdown menu size wraps its content .padding(vertical = 4.dp) // Add vertical padding to dropdown menu ) { types.forEachIndexed { index, type -> DropdownMenuItem( onClick = { selectedType = index // 修改选中的选项文本 selectedOptionText.value = types[selectedType] isDropdownExpanded = false // Close dropdown after selection }, text = { Text(text = type) } ) } } } Spacer(modifier = Modifier.width(16.dp)) // 策划人姓名输入框 Column( modifier = Modifier.weight(1f) ) { Text(text = "请输入策划人姓名:", fontSize = 18.sp) BasicTextField( value = person, onValueChange = { person = it }, textStyle = TextStyle(fontSize = 16.sp), // 调整字体大小 modifier = Modifier .fillMaxWidth() .padding(vertical = 8.dp) .border(1.dp, Color(0xFF87CEFA), RoundedCornerShape(8.dp)) // 边框 .padding(8.dp) // 内边距 ) } } Spacer(modifier = Modifier.height(16.dp)) // 限制人数+输入框 Text(text = "请输入活动限制人数:", fontSize = 18.sp) // 输入框 BasicTextField( value = limit, onValueChange = { limit = it }, textStyle = TextStyle(fontSize = 16.sp), // 调整字体大小 modifier = Modifier .fillMaxWidth() .padding(vertical = 8.dp) .border(1.dp, Color(0xFF87CEFA), RoundedCornerShape(8.dp)) // 边框 .padding(8.dp) // 内边距 ) Spacer(modifier = Modifier.height(16.dp)) // 活动详情输入框 Text(text = "请输入活动详情:", fontSize = 18.sp) // 输入框 Box( modifier = Modifier .fillMaxWidth() .height(120.dp) // 调整高度 .padding(vertical = 8.dp) .border(1.dp, Color(0xFF87CEFA), RoundedCornerShape(8.dp)) // 添加圆角边框 ) { BasicTextField( value = text, onValueChange = { text = it }, textStyle = TextStyle(fontSize = 16.sp), // 调整字体大小 modifier = Modifier .fillMaxSize() // 填充整个父布局 .padding(horizontal = 16.dp), // 添加水平内边距 //shape = RoundedCornerShape(8.dp) // 设置圆角 ) } Spacer(modifier = Modifier.weight(1f)) // 提交按钮 Button( onClick = { onClickButton(Data(name, date, time, types[selectedType], person, limit, text)) }, modifier = Modifier .fillMaxWidth() .height(56.dp) // 调整高度 .padding(vertical = 8.dp), // 添加垂直内边距 colors = ButtonDefaults.buttonColors(Color(0xFF87CEFA)), // 按钮颜色 shape = RoundedCornerShape(8.dp) // 圆角 ) { Text( text = "提交", color = Color.White, // 文本颜色 fontSize = 18.sp ) } } } fun onClickButton(data: Data) { val service=ServiceCreator.create(ActService::class.java) service.add(data).enqueue(object :retrofit2.Callback<Int>{ override fun onResponse(call: retrofit2.Call<Int>, response: retrofit2.Response<Int>) { Log.e("TAG", "onResponse: 添加成功", ) } override fun onFailure(call: retrofit2.Call<Int>, t: Throwable) { Log.e("TAG", "onFailure: ${t.toString()}", ) } }) }