From e8c20028af7a824f62787c5a4a82b57f7461d639 Mon Sep 17 00:00:00 2001 From: AllenTom Date: Mon, 7 Oct 2024 11:10:10 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=AD=A3=E4=B8=AA=E4=BA=BA=E4=BF=A1?= =?UTF-8?q?=E6=81=AF=E4=B8=BB=E9=A1=B5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ui/index/tabs/profile/ProfileV3.kt | 449 ++++++++++-------- 1 file changed, 263 insertions(+), 186 deletions(-) diff --git a/app/src/main/java/com/aiosman/riderpro/ui/index/tabs/profile/ProfileV3.kt b/app/src/main/java/com/aiosman/riderpro/ui/index/tabs/profile/ProfileV3.kt index aba9e3b..6f59efa 100644 --- a/app/src/main/java/com/aiosman/riderpro/ui/index/tabs/profile/ProfileV3.kt +++ b/app/src/main/java/com/aiosman/riderpro/ui/index/tabs/profile/ProfileV3.kt @@ -1,11 +1,8 @@ package com.aiosman.riderpro.ui.index.tabs.profile -import android.app.Activity import android.content.Context import android.content.Intent import android.net.Uri -import androidx.activity.compose.rememberLauncherForActivityResult -import androidx.activity.result.contract.ActivityResultContracts import androidx.compose.foundation.ExperimentalFoundationApi import androidx.compose.foundation.Image import androidx.compose.foundation.background @@ -53,7 +50,9 @@ import androidx.compose.ui.draw.shadow import androidx.compose.ui.graphics.Color import androidx.compose.ui.graphics.graphicsLayer import androidx.compose.ui.layout.ContentScale +import androidx.compose.ui.layout.onGloballyPositioned import androidx.compose.ui.platform.LocalContext +import androidx.compose.ui.platform.LocalDensity import androidx.compose.ui.res.painterResource import androidx.compose.ui.res.stringResource import androidx.compose.ui.text.font.FontWeight @@ -110,6 +109,7 @@ fun ProfileV3( var enabled by remember { mutableStateOf(true) } val statusBarPaddingValues = WindowInsets.systemBars.asPaddingValues() var expanded by remember { mutableStateOf(false) } + var minibarExpanded by remember { mutableStateOf(false) } val context = LocalContext.current val scope = rememberCoroutineScope() val navController = LocalNavController.current @@ -126,6 +126,8 @@ fun ProfileV3( val refreshState = rememberPullRefreshState(model.refreshing, onRefresh = { model.loadProfile(pullRefresh = true) }) + var miniToolbarHeight by remember { mutableStateOf(0) } + val density = LocalDensity.current Box( modifier = Modifier.pullRefresh(refreshState) ) { @@ -141,15 +143,222 @@ fun ProfileV3( Column( modifier = Modifier .fillMaxWidth() + .height(miniToolbarHeight.dp) // 保持在最低高度和当前高度之间 .background(Color(0xfff8f8f8)) - .padding(horizontal = 16.dp) ) { - StatusBarSpacer() + } + // header + Box( + modifier = Modifier + .parallax(0.5f) + .fillMaxWidth() + .height(600.dp) + .verticalScroll(toolbarScrollState) + ) { + Box( + modifier = Modifier.fillMaxSize() + ) { + Column( + modifier = Modifier + .fillMaxWidth() + .graphicsLayer { + alpha = state.toolbarState.progress + } + ) { + // banner + Box( + modifier = Modifier + .fillMaxWidth() + .height(bannerHeight.dp) + ) { + Box( + modifier = Modifier + .fillMaxWidth() + .let { + if (isSelf && state.toolbarState.progress == 0f) { + it.noRippleClickable { + Intent(Intent.ACTION_PICK).apply { + type = "image/*" + pickBannerImageLauncher.launch(this) + } + } + } else { + it + } + } + .shadow( + elevation = 6.dp, + shape = RoundedCornerShape( + bottomStart = 32.dp, + bottomEnd = 32.dp + ) + ) + ) { + val banner = profile?.banner + if (banner != null) { + CustomAsyncImage( + LocalContext.current, + banner, + modifier = Modifier + .fillMaxSize(), + contentDescription = "", + contentScale = ContentScale.Crop + ) + } else { + Image( + painter = painterResource(id = R.drawable.rider_pro_moment_demo_2), + modifier = Modifier + .fillMaxSize(), + contentDescription = "", + contentScale = ContentScale.Crop + ) + } + } + if (isSelf) { + Box( + modifier = Modifier + .align(Alignment.TopEnd) + .padding( + top = statusBarPaddingValues.calculateTopPadding(), + start = 8.dp, + end = 8.dp + ) + ) { + Box( + modifier = Modifier + .padding(16.dp) + .clip(RoundedCornerShape(8.dp)) + .shadow( + elevation = 20.dp + ) + .background(Color.White.copy(alpha = 0.7f)) + ) { + Icon( + painter = painterResource(id = R.drawable.rider_pro_more_horizon), + contentDescription = "", + modifier = Modifier.noRippleClickable { + expanded = true + }, + tint = Color.Black + ) + } + DropdownMenu( + expanded = expanded, + onDismissRequest = { expanded = false }, + width = 250, + menuItems = listOf( + MenuItem( + stringResource(R.string.logout), + R.mipmap.rider_pro_logout + ) { + expanded = false + scope.launch { + onLogout() + navController.navigate(NavigationRoute.Login.route) { + popUpTo(NavigationRoute.Index.route) { + inclusive = true + } + } + } + }, + MenuItem( + stringResource(R.string.change_password), + R.mipmap.rider_pro_change_password + ) { + expanded = false + scope.launch { + navController.navigate(NavigationRoute.ChangePasswordScreen.route) + } + }, + MenuItem( + stringResource(R.string.favourites), + R.drawable.rider_pro_favourite + ) { + expanded = false + scope.launch { + navController.navigate(NavigationRoute.FavouriteList.route) + } + } + ) + ) + } + } + + } + Box( + modifier = Modifier.fillMaxWidth() + ) { + // user info + Column( + modifier = Modifier + .fillMaxWidth() + ) { + Spacer(modifier = Modifier.height(16.dp)) + // 个人信息 + Box( + modifier = Modifier.padding(horizontal = 16.dp) + ) { + profile?.let { + UserItem(it) + } + } + Spacer(modifier = Modifier.height(16.dp)) + profile?.let { + Box( + modifier = Modifier.padding(horizontal = 16.dp) + ) { + if (isSelf) { + SelfProfileAction { + navController.navigate(NavigationRoute.AccountEdit.route) + } + } else { + if (it.id != AppState.UserId) { + OtherProfileAction( + it, + onFollow = { + onFollowClick() + }, + onChat = { + onChatClick() + } + ) + } + + } + + } + } + + // collapsed bar + + + } + + } + + } + } + + + } + Column( + modifier = Modifier + .fillMaxWidth() + .graphicsLayer { + alpha = 1 - state.toolbarState.progress + } + .onGloballyPositioned { + miniToolbarHeight = with(density) { + it.size.height.toDp().value.toInt() + } + } + ) { + StatusBarSpacer() Row( - modifier = Modifier, + modifier = Modifier.padding(horizontal = 16.dp, vertical = 8.dp), verticalAlignment = Alignment.CenterVertically ) { CustomAsyncImage( @@ -168,197 +377,65 @@ fun ProfileV3( fontWeight = FontWeight.W600, color = Color.Black ) - } - Spacer(modifier = Modifier.height(8.dp)) - } - Box( - modifier = Modifier - .parallax(0.5f) - .fillMaxWidth() - .height(600.dp) - .graphicsLayer { - // change alpha of Image as the toolbar expands - alpha = state.toolbarState.progress - }.verticalScroll(toolbarScrollState) - ) { - Column( - modifier = Modifier - .fillMaxWidth() - ) { - // banner + Spacer(modifier = Modifier.weight(1f)) Box( modifier = Modifier - .fillMaxWidth() - .height(bannerHeight.dp) ) { Box( modifier = Modifier - .fillMaxWidth() - .let { - if (isSelf) { - it.noRippleClickable { - Intent(Intent.ACTION_PICK).apply { - type = "image/*" - pickBannerImageLauncher.launch(this) + .padding(16.dp) + ) { + Icon( + painter = painterResource(id = R.drawable.rider_pro_more_horizon), + contentDescription = "", + modifier = Modifier.noRippleClickable { + minibarExpanded = true + }, + tint = Color.Black + ) + } + DropdownMenu( + expanded = minibarExpanded, + onDismissRequest = { minibarExpanded = false }, + width = 250, + menuItems = listOf( + MenuItem( + stringResource(R.string.logout), + R.mipmap.rider_pro_logout + ) { + minibarExpanded = false + scope.launch { + onLogout() + navController.navigate(NavigationRoute.Login.route) { + popUpTo(NavigationRoute.Index.route) { + inclusive = true } } - } else { - it + } + }, + MenuItem( + stringResource(R.string.change_password), + R.mipmap.rider_pro_change_password + ) { + minibarExpanded = false + scope.launch { + navController.navigate(NavigationRoute.ChangePasswordScreen.route) + } + }, + MenuItem( + stringResource(R.string.favourites), + R.drawable.rider_pro_favourite + ) { + minibarExpanded = false + scope.launch { + navController.navigate(NavigationRoute.FavouriteList.route) } } - .shadow( - elevation = 6.dp, - shape = RoundedCornerShape( - bottomStart = 32.dp, - bottomEnd = 32.dp - ) - ) - ) { - val banner = profile?.banner - - if (banner != null) { - CustomAsyncImage( - LocalContext.current, - banner, - modifier = Modifier - .fillMaxSize(), - contentDescription = "", - contentScale = ContentScale.Crop - ) - } else { - Image( - painter = painterResource(id = R.drawable.rider_pro_moment_demo_2), - modifier = Modifier - .fillMaxSize(), - contentDescription = "", - contentScale = ContentScale.Crop - ) - } - } - if (isSelf) { - Box( - modifier = Modifier - .align(Alignment.TopEnd) - .padding( - top = statusBarPaddingValues.calculateTopPadding(), - start = 8.dp, - end = 8.dp - ) - ) { - Box( - modifier = Modifier - .padding(16.dp) - .clip(RoundedCornerShape(8.dp)) - .shadow( - elevation = 20.dp - ) - .background(Color.White.copy(alpha = 0.7f)) - ) { - Icon( - painter = painterResource(id = R.drawable.rider_pro_more_horizon), - contentDescription = "", - modifier = Modifier.noRippleClickable { - expanded = true - }, - tint = Color.Black - ) - } - - DropdownMenu( - expanded = expanded, - onDismissRequest = { expanded = false }, - width = 250, - menuItems = listOf( - MenuItem( - stringResource(R.string.logout), - R.mipmap.rider_pro_logout - ) { - expanded = false - scope.launch { - onLogout() - navController.navigate(NavigationRoute.Login.route) { - popUpTo(NavigationRoute.Index.route) { - inclusive = true - } - } - } - }, - MenuItem( - stringResource(R.string.change_password), - R.mipmap.rider_pro_change_password - ) { - expanded = false - scope.launch { - navController.navigate(NavigationRoute.ChangePasswordScreen.route) - } - }, - MenuItem( - stringResource(R.string.favourites), - R.drawable.rider_pro_favourite - ) { - expanded = false - scope.launch { - navController.navigate(NavigationRoute.FavouriteList.route) - } - } - ) - ) - } - } - + ) + ) } - Box( - modifier = Modifier.fillMaxWidth() - ) { - // user info - Column( - modifier = Modifier - .fillMaxWidth() - ) { - Spacer(modifier = Modifier.height(16.dp)) - // 个人信息 - Box( - modifier = Modifier.padding(horizontal = 16.dp) - ) { - profile?.let { - UserItem(it) - } - } - Spacer(modifier = Modifier.height(16.dp)) - profile?.let { - Box( - modifier = Modifier.padding(horizontal = 16.dp) - ) { - if (isSelf) { - SelfProfileAction { - navController.navigate(NavigationRoute.AccountEdit.route) - } - } else { - if (it.id != AppState.UserId) { - OtherProfileAction( - it, - onFollow = { - onFollowClick() - }, - onChat = { - onChatClick() - } - ) - } - - } - - } - } - - // collapsed bar - - - } - - } - } + Spacer(modifier = Modifier.height(8.dp)) } } ) {