diff --git a/app/src/main/java/com/example/shoesapptest/MainActivity.kt b/app/src/main/java/com/example/shoesapptest/MainActivity.kt
index ab2fa0a..53c2e0f 100644
--- a/app/src/main/java/com/example/shoesapptest/MainActivity.kt
+++ b/app/src/main/java/com/example/shoesapptest/MainActivity.kt
@@ -15,6 +15,7 @@ import com.example.shoesapp.ui.screen.SignInContent
import com.example.shoesapp.ui.screen.SigninScreen
import com.example.shoesapp.ui.theme.MatuleTheme
import com.example.shoesapptest.screen.ForgotPasswordScreen
+import com.example.shoesapptest.screen.RegistrtionScreen
class MainActivity : ComponentActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
@@ -22,7 +23,7 @@ class MainActivity : ComponentActivity() {
enableEdgeToEdge()
setContent {
MatuleTheme {
- ForgotPasswordScreen()
+ RegistrtionScreen()
}
}
}
diff --git a/app/src/main/java/com/example/shoesapptest/screen/RegistrationScreen.kt b/app/src/main/java/com/example/shoesapptest/screen/RegistrationScreen.kt
new file mode 100644
index 0000000..7bed55f
--- /dev/null
+++ b/app/src/main/java/com/example/shoesapptest/screen/RegistrationScreen.kt
@@ -0,0 +1,350 @@
+package com.example.shoesapptest.screen
+
+import androidx.compose.foundation.background
+import androidx.compose.foundation.interaction.MutableInteractionSource
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.safeGesturesPadding
+import androidx.compose.foundation.layout.width
+import androidx.compose.foundation.layout.wrapContentSize
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.foundation.text.BasicTextField
+import androidx.compose.foundation.text.ClickableText
+import androidx.compose.foundation.text.KeyboardOptions
+import androidx.compose.material3.Button
+import androidx.compose.material3.ButtonColors
+import androidx.compose.material3.CenterAlignedTopAppBar
+import androidx.compose.material3.Checkbox
+import androidx.compose.material3.CheckboxColors
+import androidx.compose.material3.CheckboxDefaults
+import androidx.compose.material3.ExperimentalMaterial3Api
+import androidx.compose.material3.IconButton
+import androidx.compose.material3.Scaffold
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.unit.dp
+import com.example.shoesapptest.R
+import androidx.compose.material3.Icon
+import androidx.compose.material3.Text
+import androidx.compose.material3.TextFieldColors
+import androidx.compose.material3.TextFieldDefaults
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.draw.clip
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.text.AnnotatedString
+import androidx.compose.ui.text.input.KeyboardType
+import androidx.compose.ui.text.input.PasswordVisualTransformation
+import androidx.compose.ui.text.input.VisualTransformation
+import androidx.compose.ui.text.style.TextAlign
+import com.example.shoesapp.ui.theme.MatuleTheme
+import com.example.shoesapp.ui.theme.matuleFontFamily
+import kotlin.math.sin
+
+@Composable
+fun RegistrtionScreen(){
+ Scaffold(
+ topBar = {
+ Row(
+ modifier = Modifier
+ .padding(top = 35.dp)
+ .fillMaxWidth()
+ .height(40.dp)
+ ){
+ IconButton(onClick={}) {
+ Icon(painter = painterResource(R.drawable.back_arrow),
+ contentDescription = null)
+ }
+ }
+ },
+ bottomBar = {
+ Row(
+ horizontalArrangement = Arrangement.Center,
+ verticalAlignment = Alignment.CenterVertically,
+ modifier = Modifier
+ .padding(bottom = 50.dp)
+ .fillMaxWidth()
+ .height(40.dp)
+ ) {
+ Text(
+ text= stringResource(R.string.sign_in_on_reg),
+ style=MatuleTheme.typography.bodyRegular16.copy(MatuleTheme.colors.text),
+ textAlign = TextAlign.Center
+ )
+ }
+ }
+ ) { paddingValues ->
+ RegistrationScreen(paddingValues)
+ }
+}
+
+@Composable
+fun RegistrationScreen(paddingValues: PaddingValues){
+ Column(
+ modifier = Modifier.padding(paddingValues=paddingValues)
+ ) {
+ val title= stringResource(R.string.sign_up_on_reg)
+ val subtitle= stringResource(R.string.sign_in_subtitle)
+ TitleWithSubtitleText(title, subtitle)
+ val name = remember { mutableStateOf("") }
+ val email = remember { mutableStateOf("") }
+ val password = remember { mutableStateOf("") }
+ RegistrationTextFields(
+ labelNameText = stringResource(R.string.name),
+ labelEmailText = stringResource(R.string.email),
+ labelPasswordText = stringResource(R.string.password),
+ nameValue = name.value,
+ emailValue = email.value,
+ passwordValue = password.value,
+ onNameChange = {name.value=it},
+ onEmailChange = {email.value=it},
+ onPasswordChange = {password.value=it},
+ placeholderTextName = stringResource(R.string.template_name),
+ placeholderTextEmail = stringResource(R.string.template_email),
+ placeholderTextPassword = stringResource(R.string.template_password)
+ )
+ RegButton(modifier = Modifier.padding(top = 50.dp),
+ buttonLabel = stringResource(R.string.sign_up_btn)
+ ) { }
+ }
+}
+
+@Composable
+fun RegButton(modifier: Modifier, buttonLabel: String, onClick: () -> Unit){
+ Button(
+ modifier = modifier
+ .padding(horizontal = 20.dp)
+ .fillMaxWidth()
+ .height(50.dp)
+ .clip(RoundedCornerShape(14.dp))
+ .background(MatuleTheme.colors.background)
+ ,
+ colors=ButtonColors(
+ containerColor = MatuleTheme.colors.accent,
+ disabledContainerColor = MatuleTheme.colors.accent,
+ contentColor = Color.Transparent,
+ disabledContentColor = Color.Transparent
+ ),
+ onClick=onClick
+ ){
+ Text(
+ text=buttonLabel,
+ style = MatuleTheme.typography.bodyRegular14.copy(color=MatuleTheme.colors.background),
+ textAlign = TextAlign.Center
+ )
+ }
+}
+
+
+@OptIn(ExperimentalMaterial3Api::class)
+@Composable
+fun RegistrationTextFields(nameValue: String,
+ onNameChange: (String) -> Unit,
+ placeholderTextName: String,
+ labelNameText: String,
+ emailValue: String,
+ onEmailChange: (String) -> Unit,
+ placeholderTextEmail: String,
+ labelEmailText: String,
+ passwordValue: String,
+ onPasswordChange: (String) -> Unit,
+ placeholderTextPassword: String,
+ labelPasswordText: String){
+ Column(
+ modifier = Modifier
+ .padding(horizontal = 20.dp)
+ .wrapContentSize(),
+ verticalArrangement = Arrangement.spacedBy(8.dp)
+ ){
+ if (labelNameText!=null){
+ Text(
+ text=labelNameText,
+ style=MatuleTheme.typography.bodyRegular16.copy(MatuleTheme.colors.text),
+ textAlign = TextAlign.Right
+ )
+ }
+ val name = remember { MutableInteractionSource() }
+ BasicTextField(
+ value = nameValue,
+ onValueChange = { onNameChange(it) },
+ modifier = Modifier
+ .padding(horizontal = 20.dp)
+ .fillMaxWidth()
+ .clip(RoundedCornerShape(14.dp))
+ .background(MatuleTheme.colors.background)
+ ){
+ innerTextField ->
+ TextFieldDefaults.DecorationBox(
+ value=nameValue,
+ singleLine = true,
+ innerTextField = innerTextField,
+ enabled = true,
+ colors= TextFieldDefaults.colors(
+ focusedContainerColor = MatuleTheme.colors.background,
+ disabledContainerColor = MatuleTheme.colors.background,
+ unfocusedContainerColor = MatuleTheme.colors.background,
+ errorContainerColor = MatuleTheme.colors.background,
+ unfocusedIndicatorColor = Color.Transparent,
+ focusedIndicatorColor = Color.Transparent,
+ disabledIndicatorColor = Color.Transparent,
+ errorIndicatorColor = Color.Transparent
+ ),
+ visualTransformation = VisualTransformation.None,
+ interactionSource = name,
+ placeholder = {
+ if (placeholderTextName!=null)
+ Text(
+ text=placeholderTextName,
+ style = MatuleTheme.typography.bodyRegular14.copy(MatuleTheme.colors.hint)
+ )
+ }
+ )
+ }
+ if(labelEmailText!=null){
+ Text(
+ text = labelEmailText,
+ style = MatuleTheme.typography.bodyRegular16.copy(MatuleTheme.colors.text),
+ textAlign = TextAlign.Right
+ )
+ }
+ val email = remember { MutableInteractionSource() }
+ BasicTextField(
+ value=emailValue,
+ onValueChange = {onEmailChange(it)},
+ modifier = Modifier
+ .padding(horizontal = 20.dp)
+ .fillMaxWidth()
+ .clip(RoundedCornerShape(14.dp))
+ .background(MatuleTheme.colors.background)
+ ){
+ innerTextField ->
+ TextFieldDefaults.DecorationBox(
+ value = emailValue,
+ singleLine = true,
+ innerTextField = innerTextField,
+ enabled = true,
+ colors = TextFieldDefaults.colors(
+ focusedContainerColor = MatuleTheme.colors.background,
+ disabledContainerColor = MatuleTheme.colors.background,
+ unfocusedContainerColor = MatuleTheme.colors.background,
+ errorContainerColor = MatuleTheme.colors.background,
+ unfocusedIndicatorColor = Color.Transparent,
+ disabledIndicatorColor = Color.Transparent,
+ focusedIndicatorColor = Color.Transparent,
+ errorIndicatorColor = Color.Transparent
+ ),
+ visualTransformation = VisualTransformation.None,
+ interactionSource = email,
+ placeholder = {
+ if(placeholderTextEmail!=null)
+ Text(
+ text = placeholderTextEmail,
+ style = MatuleTheme.typography.bodyRegular14.copy(MatuleTheme.colors.hint)
+ )
+ }
+ )
+ }
+ if (labelPasswordText!=null){
+ Text(
+ text = labelPasswordText,
+ style = MatuleTheme.typography.bodyRegular16.copy(MatuleTheme.colors.text),
+ textAlign = TextAlign.Center
+ )
+ }
+ val password = remember { MutableInteractionSource() }
+ var passwordVisible by remember { mutableStateOf(false) }
+ Row(
+ modifier = Modifier
+ .padding(horizontal = 20.dp)
+ .fillMaxWidth(),
+ verticalAlignment = Alignment.CenterVertically
+ ){
+ BasicTextField(
+ value=passwordValue,
+ onValueChange = { onPasswordChange(it) },
+ visualTransformation = if(passwordVisible) VisualTransformation.None else PasswordVisualTransformation(),
+ keyboardOptions = KeyboardOptions(keyboardType = KeyboardType.Password),
+ modifier = Modifier
+ .weight(1f)
+ .clip(RoundedCornerShape(14.dp))
+ .background(MatuleTheme.colors.background)
+ ){ innerTextField ->
+ TextFieldDefaults.DecorationBox(
+ value = passwordValue,
+ singleLine = true,
+ innerTextField = innerTextField,
+ enabled = true,
+ colors = TextFieldDefaults.colors(
+ focusedContainerColor = MatuleTheme.colors.background,
+ disabledContainerColor = MatuleTheme.colors.background,
+ unfocusedContainerColor = MatuleTheme.colors.background,
+ errorContainerColor = MatuleTheme.colors.background,
+ unfocusedIndicatorColor = Color.Transparent,
+ disabledIndicatorColor = Color.Transparent,
+ focusedIndicatorColor = Color.Transparent,
+ errorIndicatorColor = Color.Transparent
+ ),
+ visualTransformation = if(passwordVisible) VisualTransformation.None else PasswordVisualTransformation(),
+ interactionSource = password,
+ placeholder = {
+ if (placeholderTextPassword!=null){
+ Text(
+ text = placeholderTextPassword,
+ style = MatuleTheme.typography.bodyRegular14.copy(MatuleTheme.colors.hint)
+ )
+ }
+ }
+ )
+
+ }
+ IconButton(
+ onClick = {passwordVisible = !passwordVisible}
+ ){
+ Icon(
+ painter = painterResource(if(passwordVisible) R.drawable.eye_close else R.drawable.eye_open),
+ contentDescription = null
+ )
+ }
+ }
+ val checkedState = remember { mutableStateOf(false) }
+ Row {
+ Checkbox(
+ checked = checkedState.value,
+ onCheckedChange = { checkedState.value = it }
+ )
+
+ ClickableText(
+ text = AnnotatedString(stringResource(R.string.personal_data)),
+ style = MatuleTheme.typography.bodyRegular16.copy(MatuleTheme.colors.text),
+ modifier = Modifier
+ .padding(top=8.dp),
+ onClick = {})
+ }
+
+ }
+}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/app/src/main/res/values/strings.xml b/app/src/main/res/values/strings.xml
index 38ce91c..0365c77 100644
--- a/app/src/main/res/values/strings.xml
+++ b/app/src/main/res/values/strings.xml
@@ -12,4 +12,10 @@
Введите Свою Учётную Запись Для Сброса
xyz@gmail.com
Отправить
+ Есть аккаунт? Войти
+ Регистрация
+ XXXXXXXX
+ Зарегистрироваться
+ Имя
+ Даю согласие на обработку персональных данных
\ No newline at end of file
diff --git a/gradle/libs.versions.toml b/gradle/libs.versions.toml
index c2a3878..b45f38f 100644
--- a/gradle/libs.versions.toml
+++ b/gradle/libs.versions.toml
@@ -27,6 +27,6 @@ androidx-material3 = { group = "androidx.compose.material3", name = "material3"
[plugins]
android-application = { id = "com.android.application", version.ref = "agp" }
-kotlin-android = { id = "org.jetbrains.kotlin.android", version.ref = "kotlin" }
+kotlin-android = { id = "org.jetbrains.kotlin.android", version = "1.9.24" }
kotlin-compose = { id = "org.jetbrains.kotlin.plugin.compose", version.ref = "kotlin" }