1
0
Fork 0
mirror of https://github.com/anyproto/anytype-kotlin.git synced 2025-06-08 05:47:05 +09:00

DROID-1417 Onboarding | Enhancement | Implemented log in screen ui

DROID-1417 Onboarding | Enhancement | Implemented log in screen ui
This commit is contained in:
Allan Quatermain 2023-06-22 16:29:01 +03:00 committed by GitHub
parent 3e4d9bbf56
commit 6c9df6edaf
Signed by: github
GPG key ID: 4AEE18F83AFDEB23
9 changed files with 221 additions and 20 deletions

View file

@ -86,8 +86,8 @@ class OnboardingAuthViewModel @Inject constructor(
}
interface JoinFlowState {
object Active: JoinFlowState
object Loading: JoinFlowState
object Active : JoinFlowState
object Loading : JoinFlowState
}
class Factory @Inject constructor(

View file

@ -51,6 +51,7 @@ import com.anytypeio.anytype.ext.daggerViewModel
import com.anytypeio.anytype.ui.onboarding.screens.AuthScreenWrapper
import com.anytypeio.anytype.ui.onboarding.screens.CreateSoulAnimWrapper
import com.anytypeio.anytype.ui.onboarding.screens.CreateSoulWrapper
import com.anytypeio.anytype.ui.onboarding.screens.EnteringTheVoidScreen
import com.anytypeio.anytype.ui.onboarding.screens.MnemonicPhraseScreenWrapper
import com.anytypeio.anytype.ui.onboarding.screens.RecoveryScreenWrapper
import com.anytypeio.anytype.ui.onboarding.screens.VoidScreenWrapper
@ -121,20 +122,24 @@ class OnboardingFragment : BaseComposeFragment() {
composable(
route = OnboardingNavigation.recovery,
enterTransition = {
when (initialState.destination.route) {
OnboardingNavigation.inviteCode -> {
slideIntoContainer(Left, tween(ANIMATION_LENGTH_SLIDE))
}
else -> {
slideIntoContainer(Right, tween(ANIMATION_LENGTH_SLIDE))
}
}
fadeIn(tween(ANIMATION_LENGTH_FADE))
},
exitTransition = {
slideOutOfContainer(Left, tween(ANIMATION_LENGTH_SLIDE))
fadeOut(tween(ANIMATION_LENGTH_FADE))
}
) {
RecoveryScreenWrapper()
currentPage.value = Page.RECOVERY
RecoveryScreenWrapper(
backClick = {
navController.popBackStack()
},
nextClick = {
navController.navigate(OnboardingNavigation.enterTheVoid)
},
scanQrClick = {
}
)
}
composable(
route = OnboardingNavigation.void,
@ -219,14 +224,27 @@ class OnboardingFragment : BaseComposeFragment() {
// do nothing
}
}
composable(
route = OnboardingNavigation.enterTheVoid,
enterTransition = {
fadeIn(tween(ANIMATION_LENGTH_FADE))
},
exitTransition = {
fadeOut(tween(ANIMATION_LENGTH_FADE))
}
) {
currentPage.value = Page.ENTER_THE_VOID
EnteringTheVoidScreen(
openApp = {},
contentPaddingTop = ContentPaddingTop()
)
}
}
}
@Composable
private fun ContentPaddingTop(): Int {
return LocalConfiguration.current.screenHeightDp * 2 / 6
}
private fun ContentPaddingTop() = LocalConfiguration.current.screenHeightDp * 2 / 6
@Composable
private fun CreateSoulAnimation(contentPaddingTop: Int) {

View file

@ -8,4 +8,5 @@ object OnboardingNavigation {
const val mnemonic = "mnemonic"
const val createSoul = "createSoul"
const val createSoulAnim = "createSoulAnim"
const val enterTheVoid = "enterTheVoid"
}

View file

@ -12,5 +12,7 @@ enum class Page(val num: Int, val visible: Boolean) {
VOID(1, true),
MNEMONIC(2, true),
SOUL_CREATION(3, true),
SOUL_CREATION_ANIM(4, false)
SOUL_CREATION_ANIM(4, false),
RECOVERY(5, false),
ENTER_THE_VOID(6, false)
}

View file

@ -192,7 +192,10 @@ fun MnemonicPhraseWidgetPreview() {
@Composable
fun OnboardingInput(
modifier: Modifier = Modifier, text: MutableState<String>, placeholder: String? = null
modifier: Modifier = Modifier,
text: MutableState<String>,
placeholder: String? = null,
singleLine: Boolean = true
) {
TextField(
modifier = modifier.then(
@ -219,7 +222,7 @@ fun OnboardingInput(
Text(text = it, style = UXBody.copy(color = ColorPlaceholderText))
}
},
singleLine = true,
singleLine = singleLine,
)
}

View file

@ -0,0 +1,40 @@
package com.anytypeio.anytype.ui.onboarding.screens
import androidx.activity.compose.BackHandler
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.unit.dp
import com.anytypeio.anytype.R
import com.anytypeio.anytype.core_ui.OnBoardingTextPrimaryColor
import com.anytypeio.anytype.core_ui.views.Title1
@Composable
fun EnteringTheVoidScreen(
openApp: () -> Unit,
contentPaddingTop: Int
) {
Column(
modifier = Modifier
.fillMaxSize()
.padding(top = contentPaddingTop.dp),
verticalArrangement = Arrangement.Top
) {
Text(
modifier = Modifier.fillMaxWidth(),
textAlign = TextAlign.Center,
text = stringResource(id = R.string.onboarding_entering_void_title),
style = Title1.copy(color = OnBoardingTextPrimaryColor)
)
}
BackHandler {
// nothing
}
}

View file

@ -1,9 +1,127 @@
package com.anytypeio.anytype.ui.onboarding.screens
import androidx.compose.foundation.Image
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.unit.dp
import com.anytypeio.anytype.R
import com.anytypeio.anytype.core_ui.OnBoardingTextPrimaryColor
import com.anytypeio.anytype.core_ui.foundation.noRippleClickable
import com.anytypeio.anytype.core_ui.views.ButtonSize
import com.anytypeio.anytype.core_ui.views.ConditionLogin
import com.anytypeio.anytype.core_ui.views.OnBoardingButtonPrimary
import com.anytypeio.anytype.core_ui.views.OnBoardingButtonSecondary
import com.anytypeio.anytype.core_ui.views.TitleLogin
import com.anytypeio.anytype.ui.onboarding.OnboardingInput
@Composable
fun RecoveryScreenWrapper() {
Text("RECOVERY PHRASE LOGIN SCREEN HERE")
fun RecoveryScreenWrapper(
backClick: () -> Unit,
nextClick: (String) -> Unit,
scanQrClick: () -> Unit
) {
RecoveryScreen(
backClick,
nextClick,
scanQrClick
)
}
@Composable
fun RecoveryScreen(
backClick: () -> Unit,
nextClick: (String) -> Unit,
scanQrClick: () -> Unit
) {
Box(
modifier = Modifier
.fillMaxSize()
.padding(top = 24.dp)
) {
Image(
modifier = Modifier
.align(Alignment.TopStart)
.padding(top = 8.dp, start = 24.dp)
.noRippleClickable {
backClick.invoke()
},
painter = painterResource(id = R.drawable.icon_back_onboarding),
contentDescription = "back"
)
Text(
modifier = Modifier.align(Alignment.TopCenter),
text = stringResource(id = R.string.login),
style = TitleLogin.copy(
color = OnBoardingTextPrimaryColor
)
)
val text = remember {
mutableStateOf("")
}
LazyColumn(
content = {
item {
OnboardingInput(
modifier = Modifier
.fillMaxWidth()
.height(164.dp)
.padding(start = 18.dp, end = 18.dp, top = 48.dp, bottom = 18.dp),
text = text,
singleLine = false,
placeholder = stringResource(id = R.string.onboarding_type_recovery_phrase)
)
}
item {
OnBoardingButtonPrimary(
text = stringResource(id = R.string.next),
onClick = {
nextClick.invoke(text.value)
},
enabled = text.value.isNotEmpty(),
size = ButtonSize.Large,
modifier = Modifier
.fillMaxWidth()
.padding(horizontal = 18.dp)
)
}
item {
Text(
modifier = Modifier.fillMaxSize().padding(vertical = 12.dp),
textAlign = TextAlign.Center,
text = stringResource(id = R.string.onboarding_login_or),
style = ConditionLogin.copy(
color = OnBoardingTextPrimaryColor
)
)
}
item {
OnBoardingButtonSecondary(
text = stringResource(id = R.string.or_scan_qr_code),
onClick = {
scanQrClick.invoke()
},
enabled = true,
size = ButtonSize.Large,
modifier = Modifier
.fillMaxWidth()
.padding(horizontal = 18.dp)
)
}
}
)
}
}

View file

@ -381,6 +381,9 @@ Do the computation of an expensive paragraph of text on a background thread:
<string name="onboarding_soul_creation">Creating your Soul</string>
<string name="onboarding_soul_space_creation">Setting up your Personal Space</string>
<string name="onboarding_soul_creation_personal_space">Personal Space</string>
<string name="onboarding_type_recovery_phrase">Type your recovery phrase</string>
<string name="onboarding_login_or">OR</string>
<string name="onboarding_entering_void_title">Entering the Void</string>
<string name="sync_status_incompatible">Incompatible version</string>
<string name="base_add_options_empty_title">No tags found</string>
<string name="base_add_options_empty_subtitle">Start typing to create a new one</string>

View file

@ -38,3 +38,19 @@ val TextOnBoardingDescription =
lineHeight = 18.sp,
letterSpacing = (-0.017).em
)
val TitleLogin = TextStyle(
fontFamily = fontInterRegular,
fontWeight = FontWeight.W600,
fontSize = 17.sp,
lineHeight = 22.sp,
letterSpacing = (-0.024).em
)
val ConditionLogin = TextStyle(
fontFamily = fontInterRegular,
fontWeight = FontWeight.W700,
fontSize = 11.sp,
lineHeight = 24.sp,
letterSpacing = (-0.006).em
)