admin/rider-pro-android-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

UI调整

Browse Source
This commit is contained in:
Zhong202501
2025-08-21 16:36:54 +08:00
parent 8f8c2ff2e9
commit 3e9353f07b
4 changed files with 307 additions and 385 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
app/src/main/java/com/aiosman/ravenow/ui/index/tabs/moment/Moment.kt
View File

@@ -79,7 +79,7 @@ fun MomentsList() {
// center the tabs
horizontalArrangement = Arrangement.Start,
verticalAlignment = Alignment.CenterVertically
) {
) {//探索tab
Column(
modifier = Modifier
.noRippleClickable {
@@ -108,38 +108,8 @@ fun MomentsList() {
.width(34.dp)
.height(4.dp)
)
}
Spacer(modifier = Modifier.width(16.dp))
Column(
modifier = Modifier
.noRippleClickable {
scope.launch {
pagerState.animateScrollToPage(1)
}
},
verticalArrangement = Arrangement.Center,
horizontalAlignment = Alignment.CenterHorizontally
) {
Text(
text = stringResource(R.string.index_dynamic),
fontSize = 16.sp,
color = if (pagerState.currentPage == 1) AppColors.text else AppColors.nonActiveText,
fontWeight = FontWeight.W600)
Spacer(modifier = Modifier.height(4.dp))
Image(
painter = painterResource(
if (pagerState.currentPage == 1) R.mipmap.tab_indicator_selected
else R.drawable.tab_indicator_unselected
),
contentDescription = "tab indicator",
modifier = Modifier
.width(34.dp)
.height(4.dp)
)
}
//“关注”tab
Spacer(modifier = Modifier.width(16.dp))
Column(
modifier = Modifier

635
app/src/main/java/com/aiosman/ravenow/ui/index/tabs/moment/tabs/expolre/Explore.kt
View File

@@ -48,7 +48,6 @@ import androidx.compose.ui.unit.sp
import androidx.compose.ui.draw.clip
import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.draw.blur
import androidx.compose.ui.graphics.graphicsLayer
import com.aiosman.ravenow.ui.composables.CustomAsyncImage
import androidx.lifecycle.viewmodel.compose.viewModel
import com.aiosman.ravenow.AppStore
@@ -147,95 +146,95 @@ fun Explore() {
fun AgentCard2(agentItem: AgentItem) {
val AppColors = LocalAppTheme.current
Row(
Row(
modifier = Modifier
.fillMaxWidth()
.padding(vertical = 12.dp),
verticalAlignment = Alignment.CenterVertically
) {
// 左侧头像
Box(
modifier = Modifier
.fillMaxWidth()
.padding(vertical = 12.dp),
verticalAlignment = Alignment.CenterVertically
.size(48.dp)
.background(Color(0xFFF5F5F5), RoundedCornerShape(24.dp)),
contentAlignment = Alignment.Center
) {
// 左侧头像
Box(
modifier = Modifier
.size(48.dp)
.background(Color(0xFFF5F5F5), RoundedCornerShape(24.dp)),
contentAlignment = Alignment.Center
) {
if (agentItem.avatar.isNotEmpty()) {
CustomAsyncImage(
imageUrl = agentItem.avatar,
contentDescription = "Agent头像",
modifier = Modifier
.size(48.dp)
.clip(RoundedCornerShape(24.dp)),
contentScale = androidx.compose.ui.layout.ContentScale.Crop
)
} else {
Image(
painter = painterResource(R.mipmap.rider_pro_agent),
contentDescription = "默认头像",
modifier = Modifier.size(24.dp),
colorFilter = ColorFilter.tint(AppColors.secondaryText)
)
}
}
Spacer(modifier = Modifier.width(12.dp))
// 中间文字内容
Column(
modifier = Modifier
.weight(1f)
.padding(end = 8.dp)
) {
// 标题
Text(
text = agentItem.title,
fontSize = 14.sp,
fontWeight = androidx.compose.ui.text.font.FontWeight.W600,
color = AppColors.text,
maxLines = 1,
overflow = androidx.compose.ui.text.style.TextOverflow.Ellipsis
if (agentItem.avatar.isNotEmpty()) {
CustomAsyncImage(
imageUrl = agentItem.avatar,
contentDescription = "Agent头像",
modifier = Modifier
.size(48.dp)
.clip(RoundedCornerShape(24.dp)),
contentScale = androidx.compose.ui.layout.ContentScale.Crop
)
Spacer(modifier = Modifier.height(8.dp))
// 描述
Text(
text = agentItem.desc,
fontSize = 12.sp,
color = AppColors.secondaryText,
maxLines = 1,
overflow = androidx.compose.ui.text.style.TextOverflow.Ellipsis
)
}
// 右侧聊天按钮
Box(
modifier = Modifier
.size(width = 60.dp, height = 32.dp)
.background(
color = Color(0X147c7480),
shape = RoundedCornerShape(8.dp)
)
.clickable {
// 聊天逻辑
},
contentAlignment = Alignment.Center
) {
Text(
text = "聊天",
fontSize = 12.sp,
color = AppColors.text,
fontWeight = androidx.compose.ui.text.font.FontWeight.W500
} else {
Image(
painter = painterResource(R.mipmap.rider_pro_agent),
contentDescription = "默认头像",
modifier = Modifier.size(24.dp),
colorFilter = ColorFilter.tint(AppColors.secondaryText)
)
}
}
Spacer(modifier = Modifier.width(12.dp))
// 中间文字内容
Column(
modifier = Modifier
.weight(1f)
.padding(end = 8.dp)
) {
// 标题
Text(
text = agentItem.title,
fontSize = 14.sp,
fontWeight = androidx.compose.ui.text.font.FontWeight.W600,
color = AppColors.text,
maxLines = 1,
overflow = androidx.compose.ui.text.style.TextOverflow.Ellipsis
)
Spacer(modifier = Modifier.height(8.dp))
// 描述
Text(
text = agentItem.desc,
fontSize = 12.sp,
color = AppColors.secondaryText,
maxLines = 1,
overflow = androidx.compose.ui.text.style.TextOverflow.Ellipsis
)
}
// 右侧聊天按钮
Box(
modifier = Modifier
.size(width = 60.dp, height = 32.dp)
.background(
color = Color(0X147c7480),
shape = RoundedCornerShape(8.dp)
)
.clickable {
// 聊天逻辑
},
contentAlignment = Alignment.Center
) {
Text(
text = "聊天",
fontSize = 12.sp,
color = AppColors.text,
fontWeight = androidx.compose.ui.text.font.FontWeight.W500
)
}
}
}
@Composable
fun AgentPage(agentItems: List<AgentItem>, page: Int, modifier: Modifier = Modifier) {
fun AgentPage(agentItems: List<AgentItem>, page: Int) {
Column(
modifier = modifier
modifier = Modifier
.fillMaxSize()
.padding(horizontal = 0.dp)
) {
@@ -269,27 +268,11 @@ fun Explore() {
) {
HorizontalPager(
state = pagerState,
modifier = Modifier.fillMaxSize(),
contentPadding = androidx.compose.foundation.layout.PaddingValues(horizontal = 4.dp),
pageSpacing = 0.dp
modifier = Modifier.fillMaxSize()
) { page ->
// 计算当前页面的偏移量
val pageOffset = (
(pagerState.currentPage - page) + pagerState
.currentPageOffsetFraction
).coerceIn(-1f, 1f)
// 根据偏移量计算缩放比例
val scale = 1f - (0.1f * kotlin.math.abs(pageOffset))
AgentPage(
agentItems = agentItems.drop(page * itemsPerPage).take(itemsPerPage),
page = page,
modifier = Modifier
.graphicsLayer {
scaleX = scale
scaleY = scale
}
page = page
)
}
}
@@ -427,12 +410,12 @@ fun Explore() {
@Composable
fun BannerCard(bannerItem: BannerItem, modifier: Modifier = Modifier) {
fun BannerCard(bannerItem: BannerItem) {
val AppColors = LocalAppTheme.current
val context = LocalContext.current
Card(
modifier = modifier
modifier = Modifier
.fillMaxSize()
.padding(horizontal = 0.dp),
shape = RoundedCornerShape(20.dp),
@@ -473,22 +456,22 @@ fun Explore() {
verticalArrangement = androidx.compose.foundation.layout.Arrangement.SpaceBetween
) {
// 顶部：用户数量
Row(
Row(
verticalAlignment = Alignment.CenterVertically
) {
/* Image(
painter = painterResource(R.drawable.rider_pro_nav_profile),
contentDescription = "chat",
modifier = Modifier.size(16.dp),
colorFilter = ColorFilter.tint(Color.White)
)
Spacer(modifier = Modifier.width(4.dp))
Text(
text = "${bannerItem.userCount}人在聊",
fontSize = 12.sp,
color = Color.White,
fontWeight = androidx.compose.ui.text.font.FontWeight.W500
)*/
/* Image(
painter = painterResource(R.drawable.rider_pro_nav_profile),
contentDescription = "chat",
modifier = Modifier.size(16.dp),
colorFilter = ColorFilter.tint(Color.White)
)
Spacer(modifier = Modifier.width(4.dp))
Text(
text = "${bannerItem.userCount}人在聊",
fontSize = 12.sp,
color = Color.White,
fontWeight = androidx.compose.ui.text.font.FontWeight.W500
)*/
}
// 底部：标题和描述
@@ -500,7 +483,7 @@ fun Explore() {
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)
modifier = Modifier.padding(start = 16.dp)
)
Spacer(modifier = Modifier.height(8.dp))
Text(
@@ -516,81 +499,81 @@ fun Explore() {
Row(
modifier = Modifier.fillMaxWidth()
.background(brush = androidx.compose.ui.graphics.Brush.verticalGradient(
colors = listOf(
Color(0x00000000), // 底部颜色（透明）
Color(0x33000000), // 顶部颜色
colors = listOf(
Color(0x00000000), // 底部颜色（透明）
Color(0x33000000), // 顶部颜色
)
)),
)
)),
horizontalArrangement = androidx.compose.foundation.layout.Arrangement.SpaceBetween,
verticalAlignment = Alignment.CenterVertically
) {
Row( modifier = Modifier
.fillMaxWidth()
.padding(16.dp),
verticalAlignment = Alignment.CenterVertically){
// 左侧头像
Box(
modifier = Modifier
.size(24.dp)
.background(
Color.White.copy(alpha = 0.2f),
RoundedCornerShape(16.dp)
verticalAlignment = Alignment.CenterVertically){
// 左侧头像
Box(
modifier = Modifier
.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
)
) {
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)
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)
)
.clickable {
// 进入房间逻辑
},
contentAlignment = Alignment.Center
) {
Text(
text = "进入",
fontSize = 14.sp,
color = Color.White,
fontWeight = androidx.compose.ui.text.font.FontWeight.W600
)
}
}
// 右侧进入按钮
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
)
}
}
@@ -612,15 +595,15 @@ fun Explore() {
) {
// 第一块区域
// 可以添加更多不同高度的内容项
item {
Row(
modifier = Modifier
.fillMaxWidth()
.padding(vertical = 6.dp),
horizontalArrangement = androidx.compose.foundation.layout.Arrangement.SpaceBetween
horizontalArrangement = androidx.compose.foundation.layout.Arrangement.SpaceEvenly
) {
// 第一个 - 靠左显示
// 第一个
Column(
modifier = Modifier
.clickable {
@@ -650,75 +633,69 @@ fun Explore() {
)
}
// 中间两个 - 平均分布
Row(
modifier = Modifier.weight(1f),
horizontalArrangement = androidx.compose.foundation.layout.Arrangement.SpaceEvenly
// 第二个
Column(
modifier = Modifier
.clickable {
navController.navigate(
NavigationRoute.AddAgent.route)
},
horizontalAlignment = Alignment.CenterHorizontally
) {
// 第二个
Column(
Box(
modifier = Modifier
.clickable {
navController.navigate(
NavigationRoute.AddAgent.route)
},
horizontalAlignment = Alignment.CenterHorizontally
.size(64.dp)
.background(Color(0xFF94f9f2), RoundedCornerShape(24.dp)),
contentAlignment = Alignment.Center
) {
Box(
modifier = Modifier
.size(64.dp)
.background(Color(0xFF94f9f2), RoundedCornerShape(24.dp)),
contentAlignment = Alignment.Center
) {
Image(
painter = painterResource(R.mipmap.rider_pro_agent),
contentDescription = "创建智能体",
modifier = Modifier.size(24.dp),
)
}
Spacer(modifier = Modifier.size(8.dp))
Text(
text = "创建Agent",
fontSize = 12.sp,
color = AppColors.text,
fontWeight = androidx.compose.ui.text.font.FontWeight.W500
)
}
// 第三个
Column(
modifier = Modifier
.clickable {
NewPostViewModel.asNewPost()
navController.navigate("NewPost")
},
horizontalAlignment = Alignment.CenterHorizontally
) {
Box(
modifier = Modifier
.size(64.dp)
.background(Color(0xFFfafd5d), RoundedCornerShape(24.dp)),
contentAlignment = Alignment.Center
) {
Image(
painter = painterResource(R.mipmap.rider_pro_release),
contentDescription = "发布动态",
modifier = Modifier.size(24.dp),
Image(
painter = painterResource(R.mipmap.rider_pro_agent),
contentDescription = "创建智能体",
modifier = Modifier.size(24.dp),
)
}
Spacer(modifier = Modifier.size(8.dp))
Text(
text = "发布动态",
fontSize = 12.sp,
color = AppColors.text,
fontWeight = androidx.compose.ui.text.font.FontWeight.W500
)
}
Spacer(modifier = Modifier.size(8.dp))
Text(
text = "创建Agent",
fontSize = 12.sp,
color = AppColors.text,
fontWeight = androidx.compose.ui.text.font.FontWeight.W500
)
}
// 第四个 - 靠右显示
// 第三个
Column(
modifier = Modifier
.clickable {
NewPostViewModel.asNewPost()
navController.navigate("NewPost")
},
horizontalAlignment = Alignment.CenterHorizontally
) {
Box(
modifier = Modifier
.size(64.dp)
.background(Color(0xFFfafd5d), RoundedCornerShape(24.dp)),
contentAlignment = Alignment.Center
) {
Image(
painter = painterResource(R.mipmap.rider_pro_release),
contentDescription = "发布动态",
modifier = Modifier.size(24.dp),
)
}
Spacer(modifier = Modifier.size(8.dp))
Text(
text = "发布动态",
fontSize = 12.sp,
color = AppColors.text,
fontWeight = androidx.compose.ui.text.font.FontWeight.W500
)
}
// 第四个
Column(
horizontalAlignment = Alignment.CenterHorizontally
) {
@@ -733,7 +710,7 @@ fun Explore() {
contentDescription = "热门智能体",
modifier = Modifier.size(24.dp),
)
)
}
Spacer(modifier = Modifier.size(8.dp))
Text(
@@ -746,96 +723,78 @@ fun Explore() {
}
}
@OptIn(ExperimentalFoundationApi::class)
@Composable
fun BannerSection(bannerItems: List<BannerItem>) {
val AppColors = LocalAppTheme.current
val context = LocalContext.current
val scope = rememberCoroutineScope()
@OptIn(ExperimentalFoundationApi::class)
@Composable
fun BannerSection(bannerItems: List<BannerItem>) {
val AppColors = LocalAppTheme.current
val context = LocalContext.current
val scope = rememberCoroutineScope()
val pagerState = rememberPagerState(pageCount = { bannerItems.size })
// 预加载banner图片
LaunchedEffect(bannerItems) {
bannerItems.forEach { bannerItem ->
if (bannerItem.backgroundImageUrl.isNotEmpty()) {
// 预加载背景图片
com.aiosman.ravenow.utils.Utils.getImageLoader(context).enqueue(
coil.request.ImageRequest.Builder(context)
.data(bannerItem.backgroundImageUrl)
.memoryCachePolicy(coil.request.CachePolicy.ENABLED)
.diskCachePolicy(coil.request.CachePolicy.ENABLED)
.build()
)
}
if (bannerItem.imageUrl.isNotEmpty()) {
// 预加载头像图片
com.aiosman.ravenow.utils.Utils.getImageLoader(context).enqueue(
coil.request.ImageRequest.Builder(context)
.data(bannerItem.imageUrl)
.memoryCachePolicy(coil.request.CachePolicy.ENABLED)
.diskCachePolicy(coil.request.CachePolicy.ENABLED)
.build()
)
}
}
}
val pagerState = rememberPagerState(pageCount = { bannerItems.size })
Column {
// Banner内容
Box(
modifier = Modifier
.fillMaxWidth()
.height(362.dp)
) {
HorizontalPager(
state = pagerState,
modifier = Modifier.fillMaxSize(),
contentPadding = androidx.compose.foundation.layout.PaddingValues(horizontal = 4.dp),
) { page ->
val bannerItem = bannerItems[page]
// 计算当前页面的偏移量
val pageOffset = (
(pagerState.currentPage - page) + pagerState
.currentPageOffsetFraction
).coerceIn(-1f, 1f)
// 根据偏移量计算缩放比例
val scale = 1f - (0.1f * kotlin.math.abs(pageOffset))
BannerCard(
bannerItem = bannerItem,
modifier = Modifier
.graphicsLayer {
scaleX = scale
scaleY = scale
// 预加载banner图片
LaunchedEffect(bannerItems) {
bannerItems.forEach { bannerItem ->
if (bannerItem.backgroundImageUrl.isNotEmpty()) {
// 预加载背景图片
com.aiosman.ravenow.utils.Utils.getImageLoader(context).enqueue(
coil.request.ImageRequest.Builder(context)
.data(bannerItem.backgroundImageUrl)
.memoryCachePolicy(coil.request.CachePolicy.ENABLED)
.diskCachePolicy(coil.request.CachePolicy.ENABLED)
.build()
)
}
)
}
}
if (bannerItem.imageUrl.isNotEmpty()) {
// 预加载头像图片
com.aiosman.ravenow.utils.Utils.getImageLoader(context).enqueue(
coil.request.ImageRequest.Builder(context)
.data(bannerItem.imageUrl)
.memoryCachePolicy(coil.request.CachePolicy.ENABLED)
.diskCachePolicy(coil.request.CachePolicy.ENABLED)
.build()
)
}
}
}
// 指示器
Row(
modifier = Modifier
.fillMaxWidth()
.padding(top = 12.dp),
horizontalArrangement = androidx.compose.foundation.layout.Arrangement.Center
) {
bannerItems.forEachIndexed { index, _ ->
Box(
modifier = Modifier
.padding(horizontal = 4.dp)
.size(3.dp)
.background(
color = if (pagerState.currentPage == index) AppColors.main else AppColors.secondaryText.copy(alpha = 0.3f),
shape = androidx.compose.foundation.shape.CircleShape
)
)
Column {
// Banner内容
Box(
modifier = Modifier
.fillMaxWidth()
.height(362.dp)
) {
HorizontalPager(
state = pagerState,
modifier = Modifier.fillMaxSize()
) { page ->
val bannerItem = bannerItems[page]
BannerCard(bannerItem = bannerItem)
}
}
// 指示器
Row(
modifier = Modifier
.fillMaxWidth()
.padding(top = 12.dp),
horizontalArrangement = androidx.compose.foundation.layout.Arrangement.Center
) {
bannerItems.forEachIndexed { index, _ ->
Box(
modifier = Modifier
.padding(horizontal = 4.dp)
.size(3.dp)
.background(
color = if (pagerState.currentPage == index) AppColors.main else AppColors.secondaryText.copy(alpha = 0.3f),
shape = androidx.compose.foundation.shape.CircleShape
)
)
}
}
}
}
}
}
}
// 第二块区域：Banner
@@ -848,7 +807,7 @@ fun BannerSection(bannerItems: List<BannerItem>) {
// 标题
Row(
verticalAlignment = Alignment.CenterVertically,
modifier = Modifier.padding(bottom = 12.dp)
modifier = Modifier.padding(bottom = 30.dp)
) {
Image(
painter = painterResource(R.mipmap.rider_pro_fire2),
@@ -886,12 +845,12 @@ fun BannerSection(bannerItems: List<BannerItem>) {
contentDescription = "agent",
modifier = Modifier.size(28.dp),
)
)
Spacer(modifier = Modifier.width(4.dp))
Text(
text = "推荐给你的智能体",
fontSize = 16.sp,
fontWeight = androidx.compose.ui.text.font.FontWeight.W600,
text = "推荐给你的Agent",
fontSize = 20.sp,
fontWeight = androidx.compose.ui.text.font.FontWeight.W900,
color = AppColors.text
)
}
@@ -916,7 +875,7 @@ fun BannerSection(bannerItems: List<BannerItem>) {
Image(
painter = painterResource(R.mipmap.rider_pro_hot_room),
contentDescription = "chat room",
modifier = Modifier.size(24.dp),
modifier = Modifier.size(28.dp),
)
Spacer(modifier = Modifier.width(4.dp))
Text(
@@ -928,7 +887,7 @@ fun BannerSection(bannerItems: List<BannerItem>) {
}
// 热门聊天室列表
HotChatRoomGridSection(roomItems = viewModel.bannerItems)
HotChatRoomGridSection(roomItems = viewModel.bannerItems)
}
}
}

21
app/src/main/java/com/aiosman/ravenow/ui/login/login.kt
View File

@@ -249,22 +249,15 @@ fun LoginPage() {
googleLogin()
}
}
//登录tab
Spacer(modifier = Modifier.height(24.dp))
Box(
contentAlignment = Alignment.Center,
modifier = Modifier.fillMaxWidth()
ActionButton(
modifier = Modifier.fillMaxWidth(),
text = stringResource(R.string.login_upper),
color = AppColors.text,
) {
Text(
stringResource(R.string.login_upper),
fontSize = 17.sp,
fontWeight = FontWeight.W900,
color = AppColors.text,
modifier = Modifier.noRippleClickable {
navController.navigate(
NavigationRoute.UserAuth.route,
)
}
navController.navigate(
NavigationRoute.UserAuth.route,
)
}
Spacer(modifier = Modifier.height(70.dp))