UI调整,群聊天室开发

This commit is contained in:
weber
2025-08-18 19:02:11 +08:00
parent 2de8127882
commit 791b24b2fb
8 changed files with 1108 additions and 110 deletions

View File

@@ -15,6 +15,7 @@ import com.aiosman.ravenow.data.UserServiceImpl
import com.aiosman.ravenow.exp.formatChatTime
import com.aiosman.ravenow.ui.NavigationRoute
import com.aiosman.ravenow.ui.navigateToChat
import com.aiosman.ravenow.ui.navigateToGroupChat
import com.tencent.imsdk.v2.V2TIMConversation
import com.tencent.imsdk.v2.V2TIMConversationListFilter
import com.tencent.imsdk.v2.V2TIMConversationResult
@@ -168,7 +169,7 @@ object GroupChatListViewModel : ViewModel() {
viewModelScope.launch {
try {
// 群聊直接使用群ID进行导航
//navController.navigateToChat(conversation.groupId)
navController.navigateToGroupChat(conversation.groupId)
} catch (e: Exception) {
error = ""
e.printStackTrace()

View File

@@ -1,5 +1,6 @@
package com.aiosman.ravenow.ui.index.tabs.moment.tabs.expolre
import android.annotation.SuppressLint
import androidx.compose.foundation.Image
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.fillMaxSize
@@ -25,6 +26,7 @@ import androidx.compose.foundation.layout.wrapContentSize
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.ui.platform.LocalContext
import androidx.compose.material.ExperimentalMaterialApi
import androidx.compose.material.Icon
import androidx.compose.material.pullrefresh.PullRefreshIndicator
import androidx.compose.material.pullrefresh.pullRefresh
import androidx.compose.material.pullrefresh.rememberPullRefreshState
@@ -58,6 +60,7 @@ import com.aiosman.ravenow.data.Agent
import com.aiosman.ravenow.data.api.ApiClient
import com.aiosman.ravenow.ui.NavigationRoute
import com.aiosman.ravenow.ui.composables.AgentCard
import com.aiosman.ravenow.ui.modifiers.noRippleClickable
import com.aiosman.ravenow.ui.post.NewPostViewModel
// Banner数据类
@@ -74,9 +77,9 @@ data class BannerItem(
fun fromRoom(room: Room): BannerItem {
return BannerItem(
id = room.id,
title = room.name ?: "聊天室",
subtitle = room.description ?: "欢迎加入我们的聊天室",
imageUrl = "${ApiClient.BASE_API_URL+"/outside"}${room.creator.profile.avatar}"+"?token="+"${AppStore.token}" ?: "",
title = room.name ,
subtitle = room.description ,
imageUrl = "${ApiClient.RETROFIT_URL}${room.creator.profile.avatar}"+"?token="+"${AppStore.token}" ?: "",
backgroundImageUrl = "${ApiClient.BASE_API_URL+"/outside"}${room.recommendBanner}"+"?token="+"${AppStore.token}" ?: "",
userCount = room.userCount,
agentName = room.creator.profile.nickname
@@ -138,6 +141,7 @@ fun Explore() {
}
)
@SuppressLint("SuspiciousIndentation")
@Composable
fun AgentCard2(agentItem: AgentItem) {
val AppColors = LocalAppTheme.current
@@ -192,14 +196,14 @@ fun Explore() {
overflow = androidx.compose.ui.text.style.TextOverflow.Ellipsis
)
Spacer(modifier = Modifier.height(4.dp))
Spacer(modifier = Modifier.height(8.dp))
// 描述
Text(
text = agentItem.desc,
fontSize = 12.sp,
color = AppColors.secondaryText,
maxLines = 2,
maxLines = 1,
overflow = androidx.compose.ui.text.style.TextOverflow.Ellipsis
)
}
@@ -316,17 +320,19 @@ fun Explore() {
verticalAlignment = Alignment.CenterVertically
) {
// 左侧图标
Spacer(modifier = Modifier.width(16.dp))
Box(
modifier = Modifier
.size(24.dp)
.padding(start = 16.dp),
.size(24.dp),
contentAlignment = Alignment.Center
) {
Image(
painter = painterResource(R.drawable.rider_pro_group_chat),
contentDescription = "chat",
modifier = Modifier.size(12.dp),
Icon(
painter = painterResource(id = R.drawable.rider_pro_group_chat),
contentDescription = null,
modifier = Modifier
.size(24.dp),
tint = AppColors.text
)
}
@@ -362,13 +368,13 @@ fun Explore() {
horizontalArrangement = androidx.compose.foundation.layout.Arrangement.spacedBy(8.dp)
) {
repeat(3) { columnIndex ->
val itemIndex = rowIndex * 3 + columnIndex
val itemIndex = rowIndex * 2 + columnIndex
if (itemIndex < roomItems.size) {
val roomItem = roomItems[itemIndex]
HotChatRoomGridItem(roomItem = roomItem)
} else {
// 填充空白占位
Spacer(modifier = Modifier.width(80.dp))
//Spacer(modifier = Modifier.width(80.dp))
}
}
}
@@ -379,23 +385,23 @@ fun Explore() {
@Composable
fun HotChatRoomGridSection(roomItems: List<BannerItem>) {
val AppColors = LocalAppTheme.current
// 每行显示3个数据总共3行
val itemsPerRow = 3
val totalRows = 3
val totalItems = itemsPerRow * totalRows
// 计算需要多少个完整的3x3网格
val gridCount = (roomItems.size + totalItems - 1) / totalItems
LazyRow(
modifier = Modifier.fillMaxWidth(),
contentPadding = androidx.compose.foundation.layout.PaddingValues(horizontal = 0.dp),
horizontalArrangement = androidx.compose.foundation.layout.Arrangement.spacedBy(6.dp)
) {
repeat(gridCount) { gridIndex ->
repeat(1) { gridIndex ->
item {
HotChatRoomGrid(roomItems = roomItems.drop(gridIndex * totalItems).take(totalItems))
HotChatRoomGrid(roomItems = viewModel.bannerItems.take(8))
}
}
}
@@ -473,6 +479,8 @@ fun Explore() {
Text(
text = bannerItem.title,
fontSize = 24.sp,
maxLines = 1,
overflow = androidx.compose.ui.text.style.TextOverflow.Ellipsis,
fontWeight = androidx.compose.ui.text.font.FontWeight.Bold,
color = Color.White,
modifier = Modifier.padding(start = 16.dp)
@@ -484,12 +492,13 @@ fun Explore() {
color = Color.White.copy(alpha = 0.9f),
maxLines = 2,
overflow = androidx.compose.ui.text.style.TextOverflow.Ellipsis,
modifier = Modifier.padding(start = 16.dp)
modifier = Modifier.padding(start = 16.dp, end = 16.dp)
)
Spacer(modifier = Modifier.height(16.dp))
Row(
modifier = Modifier.fillMaxWidth().background(brush = androidx.compose.ui.graphics.Brush.verticalGradient(
modifier = Modifier.fillMaxWidth()
.background(brush = androidx.compose.ui.graphics.Brush.verticalGradient(
colors = listOf(
Color(0x00000000), // 底部颜色(透明)
Color(0x33000000), // 顶部颜色
@@ -499,81 +508,75 @@ fun Explore() {
horizontalArrangement = androidx.compose.foundation.layout.Arrangement.SpaceBetween,
verticalAlignment = Alignment.CenterVertically
) {
// Agent信息
Row( modifier = Modifier
.fillMaxWidth()
.padding(16.dp),
verticalAlignment = Alignment.CenterVertically){
// 左侧头像
Box(
modifier = Modifier
.wrapContentWidth()
.padding(8.dp),
.size(24.dp)
.background(
Color.White.copy(alpha = 0.2f),
RoundedCornerShape(16.dp)
)
) {
CustomAsyncImage(
context = context,
imageUrl = bannerItem.imageUrl,
contentDescription = "agent Image",
contentScale = ContentScale.Crop,
modifier = Modifier.fillMaxSize()
.clip(RoundedCornerShape(24.dp)))
}
// 中间信息区域占比1
Column(
modifier = Modifier
.weight(1f)
.padding(horizontal = 8.dp)
) {
Text(
text = bannerItem.agentName,
fontSize = 10.sp,
color = Color(0xfff5f5f5).copy(alpha = 0.6f),
fontWeight = androidx.compose.ui.text.font.FontWeight.W500
)
Text(
text = bannerItem.subtitle,
fontSize = 12.sp,
color = Color.White,
maxLines = 1,
fontWeight = androidx.compose.ui.text.font.FontWeight.W400,
modifier = Modifier.padding(top = 2.dp)
)
}
// 右侧进入按钮
Box(
modifier = Modifier
.width(69.dp)
.height(29.dp)
.background(
color = Color(0x7dffffff),
shape = RoundedCornerShape(8.dp)
)
.clickable {
// 进入房间逻辑
},
contentAlignment = Alignment.Center
) {
Row(
verticalAlignment = Alignment.CenterVertically,
modifier = Modifier.padding(horizontal = 12.dp, vertical = 8.dp)
) {
Box(
modifier = Modifier
.size(24.dp)
.background(
Color.White.copy(alpha = 0.2f),
RoundedCornerShape(16.dp)
).blur(6.dp),
contentAlignment = Alignment.Center
) {
CustomAsyncImage(
context = context,
imageUrl = bannerItem.imageUrl,
contentDescription = "agent Image",
contentScale = ContentScale.Crop,
modifier = Modifier
.fillMaxSize()
)
}
Spacer(modifier = Modifier.width(8.dp))
Column {
Text(
text = bannerItem.agentName,
fontSize = 10.sp,
color = Color(0xfff5f5f5).copy(alpha = 0.6f),
fontWeight = androidx.compose.ui.text.font.FontWeight.W500
)
// 新增的文字行
Text(
text = bannerItem.subtitle,
fontSize = 12.sp,
color = Color.White,
fontWeight = androidx.compose.ui.text.font.FontWeight.W400,
modifier = Modifier.padding(top = 2.dp)
)
}
}
Text(
text = "进入",
fontSize = 14.sp,
color = Color.White,
fontWeight = androidx.compose.ui.text.font.FontWeight.W600
)
}
Column (
modifier = Modifier
.wrapContentWidth()
.padding(end = 16.dp)
){
// 进入按钮
Box(
modifier = Modifier
.width(69.dp)
.height(29.dp)
.background(
color = Color(0x7dffffff),
shape = RoundedCornerShape(8.dp)
)
.clickable {
// 进入房间逻辑
},
contentAlignment = Alignment.Center
) {
Text(
text = "进入",
fontSize = 14.sp,
color = Color.White,
fontWeight = androidx.compose.ui.text.font.FontWeight.W600
)
}
}
}
}
}
@@ -810,12 +813,11 @@ fun BannerSection(bannerItems: List<BannerItem>) {
painter = painterResource(R.mipmap.rider_pro_fire2),
contentDescription = "fire",
modifier = Modifier.size(28.dp),
colorFilter = ColorFilter.tint(Color(0xFFEF4444))
)
Spacer(modifier = Modifier.width(4.dp))
Text(
text = "正在高能对话中",
fontSize = 20.sp,
fontSize = 16.sp,
fontWeight = androidx.compose.ui.text.font.FontWeight.W600,
color = AppColors.text
)
@@ -854,7 +856,7 @@ fun BannerSection(bannerItems: List<BannerItem>) {
}
// Agent ViewPager
AgentViewPagerSection(agentItems = viewModel.agentItems)
AgentViewPagerSection(agentItems = viewModel.agentItems.take(9))
}
}
@@ -874,7 +876,6 @@ fun BannerSection(bannerItems: List<BannerItem>) {
painter = painterResource(R.mipmap.rider_pro_hot_room),
contentDescription = "chat room",
modifier = Modifier.size(24.dp),
colorFilter = ColorFilter.tint(Color(0xFFFFA500))
)
Spacer(modifier = Modifier.width(4.dp))
Text(

View File

@@ -69,6 +69,7 @@ fun HotMomentsList() {
modifier = Modifier
.fillMaxSize()
.pullRefresh(state)
) {
Column(
modifier = Modifier.fillMaxWidth().background(
@@ -80,6 +81,7 @@ fun HotMomentsList() {
modifier = Modifier
.fillMaxWidth()
.weight(1f)
.padding(2.dp)
) {
DiscoverView()
PullRefreshIndicator(refreshing, state, Modifier.align(Alignment.TopCenter))
@@ -107,7 +109,6 @@ fun DiscoverView() {
.fillMaxWidth()
.aspectRatio(1f)
.padding(2.dp)
.clip(RoundedCornerShape(8.dp))
.noRippleClickable {
navController.navigateToPost(
id = momentItem.id,