Осваиваем верстку. Виджеты регистрации + лого.

app/src/main/java/com/example/shawarma/MainActivity.kt

@@ -3,14 +3,24 @@ package com.example.shawarma
 import android.os.Bundle
 import androidx.activity.ComponentActivity
 import androidx.activity.compose.setContent
-import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.Image
-import androidx.compose.material.MaterialTheme
+import androidx.compose.foundation.layout.*
-import androidx.compose.material.Surface
+import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.material.Text
+import androidx.compose.material.*
 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.draw.rotate
 import androidx.compose.ui.graphics.Color
-import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.text.TextStyle
+import androidx.compose.ui.text.input.TextFieldValue
+import androidx.compose.ui.text.style.TextDecoration
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+import androidx.compose.ui.zIndex
 import com.example.shawarma.ui.theme.ShawarmaTheme
 
 class MainActivity : ComponentActivity() {
@@ -20,8 +30,176 @@ class MainActivity : ComponentActivity() {
             ShawarmaTheme {
                 // A surface container using the 'background' color from the theme
                 Surface(
+                    color = Color(255,225,120,255),
                     modifier = Modifier.fillMaxSize()
+                )
+                {
+                    RegistrationCard()
+                    ShawarmaLogo()
+                }
+            }
+        }
+    }
+}
+@Composable
+fun ShawarmaLogo(){
+    Column(modifier = Modifier.zIndex(1f)) {
+        Image(
+            painterResource(
+                id = R.drawable.shawarma1
+            ),
+            contentDescription = "Logo",
+            modifier = Modifier
+                .size(256.dp, 256.dp)
+                .rotate(degrees = 19.25f)
+                .offset((-70).dp, (-5).dp),
+        )
+        Image(
+            painterResource(
+                id = R.drawable.shawarma1
+            ),
+            contentDescription = "Logo",
+            modifier = Modifier
+                .size(256.dp, 256.dp)
+                .offset((200).dp, (100).dp)
+                .rotate(degrees = -136f)
+
+        )
+    }
+}
+
+@Composable
+fun RegistrationCard(){
+    val login = remember { mutableStateOf(TextFieldValue("")) }
+    val password = remember { mutableStateOf(TextFieldValue("")) }
+    val passwordRepeat = remember { mutableStateOf(TextFieldValue("")) }
+
+    Column(
+        horizontalAlignment = Alignment.CenterHorizontally,
+        modifier = Modifier
+            .padding(top = 72.dp)
+            .zIndex(2f)
     ) {
+        Card(
+            shape = RoundedCornerShape(20.dp),
+            modifier = Modifier.size(275.dp, 380.dp)
+        ) {
+            Column(
+                horizontalAlignment = Alignment.CenterHorizontally
+            ) {
+                Text(
+                    text = "Регистрация",
+                    fontSize = 20.sp,
+                    modifier = Modifier.padding(
+                        top = 20.dp
+                    )
+                )
+                TextField(
+                    value = login.value,
+                    onValueChange = {login.value = it},
+                    placeholder = {
+                        Text(
+                            text = "Логин",
+                            fontSize = 14.sp
+                        )
+                    },
+                    singleLine = true,
+                    shape = RoundedCornerShape(20.dp),
+                    textStyle = TextStyle(
+                        fontSize = 14.sp,
+                    ),
+                    colors = TextFieldDefaults.textFieldColors(
+                        textColor = Color.Black,
+                        disabledTextColor = Color.Transparent,
+                        backgroundColor = Color(232,232,232,255),
+                        focusedIndicatorColor = Color.Transparent,
+                        unfocusedIndicatorColor = Color.Transparent,
+                        disabledIndicatorColor = Color.Transparent
+                    ),
+                    modifier = Modifier
+                        .padding(
+                            top = (20).dp
+                        )
+                        .size(208.dp, (50).dp)
+                    ,
+                )
+                TextField(
+                    value = password.value,
+                    onValueChange = {password.value = it},
+                    placeholder = {
+                        Text(
+                            text = "Пароль",
+                            fontSize = 14.sp,
+                        )
+                    },
+                    singleLine = true,
+                    shape = RoundedCornerShape(20.dp),
+                    textStyle = TextStyle(
+                        fontSize = 14.sp,
+                    ),
+                    colors = TextFieldDefaults.textFieldColors(
+                        textColor = Color.Black,
+                        disabledTextColor = Color.Transparent,
+                        backgroundColor = Color(232,232,232,255),
+                        focusedIndicatorColor = Color.Transparent,
+                        unfocusedIndicatorColor = Color.Transparent,
+                        disabledIndicatorColor = Color.Transparent
+                    ),
+                    modifier = Modifier
+                        .padding(
+                            top = (20).dp
+                        )
+                        .size(208.dp, (50).dp)
+                )
+                TextField(
+                    value = passwordRepeat.value,
+                    onValueChange = {passwordRepeat.value = it},
+                    placeholder = {
+                        Text(
+                            text = "Повторите пароль",
+                            fontSize = 14.sp,
+                        )
+                    },
+                    singleLine = true,
+                    shape = RoundedCornerShape(20.dp),
+                    textStyle = TextStyle(
+                        fontSize = 14.sp,
+                    ),
+                    colors = TextFieldDefaults.textFieldColors(
+                        textColor = Color.Black,
+                        disabledTextColor = Color.Transparent,
+                        backgroundColor = Color(232,232,232,255),
+                        focusedIndicatorColor = Color.Transparent,
+                        unfocusedIndicatorColor = Color.Transparent,
+                        disabledIndicatorColor = Color.Transparent
+                    ),
+                    modifier = Modifier
+                        .padding(
+                            top = (20).dp
+                        )
+                        .size(208.dp, (50).dp)
+                )
+                Button(
+                    onClick = { /*TODO*/ },
+                    colors = ButtonDefaults.buttonColors(Color(255,100,100,255), Color.White),
+                    shape = RoundedCornerShape(20.dp),
+                    modifier = Modifier
+                        .padding(
+                            top = (20).dp
+                        )
+                        .size(208.dp, (50).dp)
+                ) {
+                    Text(text = "Зарегистрироваться")
+                }
+                Button(
+                    onClick = { /*TODO*/ },
+                    colors = ButtonDefaults.buttonColors(Color.White),
+                    elevation = ButtonDefaults.elevation(0.dp)
+                ) {
+                    Text(
+                        text = "У меня уже есть аккаунт!",
+                        textDecoration = TextDecoration.Underline
+                    )
                 }
             }
         }