diff --git a/apps/android/app/src/main/java/chat/simplex/app/views/WelcomeView.kt b/apps/android/app/src/main/java/chat/simplex/app/views/WelcomeView.kt index 9aedf65a68..fcfafb82d0 100644 --- a/apps/android/app/src/main/java/chat/simplex/app/views/WelcomeView.kt +++ b/apps/android/app/src/main/java/chat/simplex/app/views/WelcomeView.kt @@ -12,53 +12,61 @@ import androidx.compose.ui.draw.clip import androidx.compose.ui.res.painterResource import androidx.compose.ui.text.input.KeyboardCapitalization import androidx.compose.ui.unit.dp +import androidx.compose.ui.unit.sp import chat.simplex.app.R import chat.simplex.app.model.ChatModel import chat.simplex.app.model.Profile import chat.simplex.app.views.helpers.withApi +import com.google.accompanist.insets.ProvideWindowInsets +import com.google.accompanist.insets.navigationBarsWithImePadding import kotlinx.coroutines.DelicateCoroutinesApi @DelicateCoroutinesApi @Composable fun WelcomeView(chatModel: ChatModel, routeHome: () -> Unit) { - Box( - modifier = Modifier - .fillMaxSize() - .background(color = MaterialTheme.colors.background) - ){ - Column( - verticalArrangement = Arrangement.SpaceBetween, + ProvideWindowInsets(windowInsetsAnimationsEnabled = true) { + Box( modifier = Modifier - .verticalScroll(rememberScrollState()) .fillMaxSize() .background(color = MaterialTheme.colors.background) - .padding(12.dp) ) { - Image( - painter = painterResource(R.drawable.logo), contentDescription = "Simplex Logo", - ) - Text( - "You control your chat!", - style = MaterialTheme.typography.h4, - color = MaterialTheme.colors.onBackground - ) - Text( - "The messaging and application platform protecting your privacy and security.", - style = MaterialTheme.typography.body1, - color = MaterialTheme.colors.onBackground - ) - Spacer(Modifier.height(8.dp)) - Text( - "We don't store any of your contacts or messages (once delivered) on the servers.", - style = MaterialTheme.typography.body1, - color = MaterialTheme.colors.onBackground - ) - Spacer(Modifier.height(24.dp)) - CreateProfilePanel(chatModel, routeHome) + Column( + verticalArrangement = Arrangement.SpaceBetween, + modifier = Modifier + .verticalScroll(rememberScrollState()) + .fillMaxSize() + .background(color = MaterialTheme.colors.background) + .padding(12.dp) + ) { + Image( + painter = painterResource(R.drawable.logo), + contentDescription = "Simplex Logo", + modifier = Modifier.padding(vertical = 15.dp) + ) + Text( + "You control your chat!", + style = MaterialTheme.typography.h4, + color = MaterialTheme.colors.onBackground + ) + Text( + "The messaging and application platform protecting your privacy and security.", + style = MaterialTheme.typography.body1, + color = MaterialTheme.colors.onBackground + ) + Spacer(Modifier.height(8.dp)) + Text( + "We don't store any of your contacts or messages (once delivered) on the servers.", + style = MaterialTheme.typography.body1, + color = MaterialTheme.colors.onBackground + ) + Spacer(Modifier.height(24.dp)) + CreateProfilePanel(chatModel, routeHome) + } } } } + fun isValidDisplayName(name: String) : Boolean { return (name.firstOrNull { it.isWhitespace() }) == null } @@ -87,7 +95,8 @@ fun CreateProfilePanel(chatModel: ChatModel, routeHome: () -> Unit) { Text( "Display Name", style = MaterialTheme.typography.h6, - color = MaterialTheme.colors.onBackground + color = MaterialTheme.colors.onBackground, + modifier = Modifier.padding(bottom = 3.dp) ) BasicTextField( value = displayName, @@ -96,7 +105,9 @@ fun CreateProfilePanel(chatModel: ChatModel, routeHome: () -> Unit) { .fillMaxWidth() .background(MaterialTheme.colors.secondary) .height(40.dp) - .clip(RoundedCornerShape(3.dp)), + .clip(RoundedCornerShape(5.dp)) + .padding(8.dp) + .navigationBarsWithImePadding(), textStyle = MaterialTheme.typography.body1.copy(color = MaterialTheme.colors.onBackground), keyboardOptions = KeyboardOptions( capitalization = KeyboardCapitalization.None, @@ -104,18 +115,20 @@ fun CreateProfilePanel(chatModel: ChatModel, routeHome: () -> Unit) { ), singleLine = true ) - if(!isValidDisplayName(displayName)) { - Text( - "Display name cannot contain whitespace.", - style = MaterialTheme.typography.body1, - color = MaterialTheme.colors.error - ) - } - Spacer(Modifier.height(10.dp)) + val errorText = if(!isValidDisplayName(displayName)) "Display name cannot contain whitespace." else "" + + Text( + errorText, + fontSize = 15.sp, + color = MaterialTheme.colors.error + ) + + Spacer(Modifier.height(3.dp)) Text( "Full Name (Optional)", style = MaterialTheme.typography.h6, - color = MaterialTheme.colors.onBackground + color = MaterialTheme.colors.onBackground, + modifier = Modifier.padding(bottom = 5.dp) ) BasicTextField( value = fullName, @@ -124,7 +137,9 @@ fun CreateProfilePanel(chatModel: ChatModel, routeHome: () -> Unit) { .fillMaxWidth() .background(MaterialTheme.colors.secondary) .height(40.dp) - .clip(RoundedCornerShape(3.dp)), + .clip(RoundedCornerShape(3.dp)) + .padding(8.dp) + .navigationBarsWithImePadding(), textStyle = MaterialTheme.typography.body1.copy(color = MaterialTheme.colors.onBackground), keyboardOptions = KeyboardOptions( capitalization = KeyboardCapitalization.None, @@ -132,6 +147,7 @@ fun CreateProfilePanel(chatModel: ChatModel, routeHome: () -> Unit) { ), singleLine = true ) + Spacer(Modifier.height(20.dp)) Button(onClick = { withApi { val user = chatModel.controller.apiCreateActiveUser(