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()}", )
        }

    })
}

 

posted on 2024-04-27 23:29  Daniel350  阅读(3)  评论(0编辑  收藏  举报