From 1a0679954f59c5fdc7bbe5e91f2f5ca3069a6c1e Mon Sep 17 00:00:00 2001 From: k1ngsterr1 Date: Fri, 9 Jan 2026 01:59:01 +0500 Subject: [PATCH] feat: Enhance ChatsListScreen with animated title and search field transitions --- .../messenger/ui/chats/ChatsListScreen.kt | 141 +++++++++--------- 1 file changed, 70 insertions(+), 71 deletions(-) diff --git a/app/src/main/java/com/rosetta/messenger/ui/chats/ChatsListScreen.kt b/app/src/main/java/com/rosetta/messenger/ui/chats/ChatsListScreen.kt index 8e46b0c..bc22d96 100644 --- a/app/src/main/java/com/rosetta/messenger/ui/chats/ChatsListScreen.kt +++ b/app/src/main/java/com/rosetta/messenger/ui/chats/ChatsListScreen.kt @@ -567,16 +567,74 @@ fun ChatsListScreen( } }, title = { - // Search field or Stories / Title area - AnimatedContent( - targetState = isSearchExpanded, - transitionSpec = { - fadeIn(tween(200)) togetherWith fadeOut(tween(200)) - }, - label = "searchAnimation" - ) { expanded -> - if (expanded) { - // Search TextField + Box(modifier = Modifier.fillMaxWidth()) { + // Title - Triple click to open dev console + AnimatedVisibility( + visible = !isSearchExpanded, + enter = fadeIn(tween(300)) + slideInHorizontally( + initialOffsetX = { -it / 3 }, + animationSpec = tween(300, easing = FastOutSlowInEasing) + ), + exit = fadeOut(tween(200)) + slideOutHorizontally( + targetOffsetX = { -it / 3 }, + animationSpec = tween(200) + ) + ) { + Column( + modifier = Modifier.clickable { + val currentTime = System.currentTimeMillis() + if (currentTime - lastClickTime < 500) { + titleClickCount++ + if (titleClickCount >= 3) { + showDevConsole = true + titleClickCount = 0 + } + } else { + titleClickCount = 1 + } + lastClickTime = currentTime + } + ) { + Text( + "Rosetta", + fontWeight = FontWeight.Bold, + fontSize = 20.sp, + color = textColor + ) + if (protocolState != ProtocolState.AUTHENTICATED) { + Text( + text = when (protocolState) { + ProtocolState.DISCONNECTED -> "Connecting..." + ProtocolState.CONNECTING -> "Connecting..." + ProtocolState.CONNECTED -> "Authenticating..." + ProtocolState.HANDSHAKING -> "Authenticating..." + ProtocolState.AUTHENTICATED -> "" + }, + fontSize = 12.sp, + color = secondaryTextColor + ) + } + } + } + + // Search TextField with beautiful animation + AnimatedVisibility( + visible = isSearchExpanded, + enter = fadeIn(tween(300)) + slideInHorizontally( + initialOffsetX = { it }, + animationSpec = tween(300, easing = FastOutSlowInEasing) + ) + expandHorizontally( + expandFrom = Alignment.End, + animationSpec = tween(300, easing = FastOutSlowInEasing) + ), + exit = fadeOut(tween(200)) + slideOutHorizontally( + targetOffsetX = { it }, + animationSpec = tween(200) + ) + shrinkHorizontally( + shrinkTowards = Alignment.End, + animationSpec = tween(200) + ) + ) { Row( verticalAlignment = Alignment.CenterVertically, modifier = Modifier.fillMaxWidth() @@ -598,7 +656,7 @@ fun ChatsListScreen( onValueChange = { searchQuery = it }, placeholder = { Text( - "Search...", + "Search chats...", color = secondaryTextColor ) }, @@ -607,7 +665,7 @@ fun ChatsListScreen( unfocusedContainerColor = Color.Transparent, focusedTextColor = textColor, unfocusedTextColor = textColor, - cursorColor = textColor, + cursorColor = PrimaryBlue, focusedIndicatorColor = Color.Transparent, unfocusedIndicatorColor = Color.Transparent ), @@ -615,65 +673,6 @@ fun ChatsListScreen( modifier = Modifier.weight(1f) ) } - } else { - // Triple click to open dev console - Row( - verticalAlignment = Alignment.CenterVertically, - modifier = Modifier.clickable { - val currentTime = System.currentTimeMillis() - if (currentTime - lastClickTime < 500) { - titleClickCount++ - if (titleClickCount >= 3) { - showDevConsole = true - titleClickCount = 0 - } - } else { - titleClickCount = 1 - } - lastClickTime = currentTime - } - ) { - // User avatar - val avatarColors = getAvatarColor(accountName, isDarkTheme) - Box( - modifier = Modifier - .size(36.dp) - .clip(CircleShape) - .background(avatarColors.backgroundColor), - contentAlignment = Alignment.Center - ) { - Text( - text = getAvatarText(accountPublicKey), - fontSize = 14.sp, - fontWeight = FontWeight.Bold, - color = avatarColors.textColor - ) - } - - Spacer(modifier = Modifier.width(12.dp)) - - // Title with connection status - Column { - Text( - "Rosetta", - fontWeight = FontWeight.Bold, - fontSize = 20.sp - ) - if (protocolState != ProtocolState.AUTHENTICATED) { - Text( - text = when (protocolState) { - ProtocolState.DISCONNECTED -> "Connecting..." - ProtocolState.CONNECTING -> "Connecting..." - ProtocolState.CONNECTED -> "Authenticating..." - ProtocolState.HANDSHAKING -> "Authenticating..." - ProtocolState.AUTHENTICATED -> "" - }, - fontSize = 12.sp, - color = secondaryTextColor - ) - } - } - } } } },