From 6340000c1daed6938e77bddec3cd970a55316616 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=D0=92=D0=B0=D1=88=D0=B5=20=D0=98=D0=BC=D1=8F?= Date: Mon, 26 May 2025 16:27:07 +0300 Subject: [PATCH] StoryBook --- .../java/com/example/ui_kit/MainActivity.kt | 14 +- .../main/java/com/example/ui_kit/StoryBook.kt | 406 ++++++++++++++++++ app/src/main/res/drawable/user_icon.png | Bin 0 -> 1604 bytes .../java/com/example/libary/BottomSheet.kt | 2 +- .../main/java/com/example/libary/Buttons.kt | 3 +- .../src/main/java/com/example/libary/Cards.kt | 3 +- .../src/main/java/com/example/libary/Input.kt | 5 +- .../main/java/com/example/libary/Select.kt | 6 +- 8 files changed, 427 insertions(+), 12 deletions(-) create mode 100644 app/src/main/java/com/example/ui_kit/StoryBook.kt create mode 100644 app/src/main/res/drawable/user_icon.png diff --git a/app/src/main/java/com/example/ui_kit/MainActivity.kt b/app/src/main/java/com/example/ui_kit/MainActivity.kt index f0f12e4..331a030 100644 --- a/app/src/main/java/com/example/ui_kit/MainActivity.kt +++ b/app/src/main/java/com/example/ui_kit/MainActivity.kt @@ -4,12 +4,14 @@ import android.os.Bundle import androidx.activity.ComponentActivity import androidx.activity.compose.setContent import androidx.activity.enableEdgeToEdge +import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.padding import androidx.compose.material3.Scaffold import androidx.compose.material3.Text import androidx.compose.runtime.Composable import androidx.compose.ui.Modifier +import androidx.compose.ui.graphics.Color import androidx.compose.ui.tooling.preview.Preview import com.example.libary.theme.UikitTheme @@ -19,11 +21,15 @@ class MainActivity : ComponentActivity() { enableEdgeToEdge() setContent { UikitTheme { - Scaffold(modifier = Modifier.fillMaxSize()) { innerPadding -> - Greeting( - name = "Android", + Scaffold( + modifier = Modifier.fillMaxSize(), + containerColor = Color.White + ) { innerPadding -> + Column( modifier = Modifier.padding(innerPadding) - ) + ) { + StoryBook() + } } } } diff --git a/app/src/main/java/com/example/ui_kit/StoryBook.kt b/app/src/main/java/com/example/ui_kit/StoryBook.kt new file mode 100644 index 0000000..54d463d --- /dev/null +++ b/app/src/main/java/com/example/ui_kit/StoryBook.kt @@ -0,0 +1,406 @@ +package com.example.ui_kit + +import androidx.compose.foundation.Image +import androidx.compose.foundation.background +import androidx.compose.foundation.layout.Box +import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.Spacer +import androidx.compose.foundation.layout.fillMaxWidth +import androidx.compose.foundation.layout.height +import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.layout.size +import androidx.compose.foundation.layout.width +import androidx.compose.foundation.lazy.LazyColumn +import androidx.compose.foundation.shape.AbsoluteRoundedCornerShape +import androidx.compose.material3.Text +import androidx.compose.runtime.Composable +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.Modifier +import androidx.compose.ui.draw.clip +import androidx.compose.ui.res.painterResource +import androidx.compose.ui.text.font.FontWeight +import androidx.compose.ui.unit.dp +import androidx.compose.ui.unit.sp +import com.example.libary.BaseCard +import com.example.libary.BigButton +import com.example.libary.BigButtonState +import com.example.libary.BottomSheet +import com.example.libary.CartButton +import com.example.libary.CartCard +import com.example.libary.ChipButton +import com.example.libary.ChipButtonState +import com.example.libary.Header +import com.example.libary.HeaderState +import com.example.libary.Input +import com.example.libary.LoginButton +import com.example.libary.LoginState +import com.example.libary.PrimaryCard +import com.example.libary.ProjectCard +import com.example.libary.SearchInput +import com.example.libary.Select +import com.example.libary.SmallButton +import com.example.libary.SmallButtonState +import com.example.libary.TabBar +import com.example.libary.defaultTabBarData +import com.example.libary.theme.BlackColor +import com.example.libary.theme.IconsColor + +@Composable +fun StoryBook( + +) { + var modal by remember { mutableStateOf(false) } + + var inVal by remember { mutableStateOf("") } + var passinVal by remember { mutableStateOf("123456789") } + + val searchInput = remember { mutableStateOf("") } + val valSelect = remember { mutableStateOf("") } + val valSelect1 = remember { mutableStateOf("Гарвард Троцкий") } + + val valueTabBar1 = remember { mutableStateOf(defaultTabBarData[0]) } + val valueTabBar2 = remember { mutableStateOf(defaultTabBarData[1]) } + val valueTabBar3 = remember { mutableStateOf(defaultTabBarData[2]) } + val valueTabBar4 = remember { mutableStateOf(defaultTabBarData[3]) } + + if (modal) { + BottomSheet { + Row { + Text( + text = "Рубашка Воскресенье для машинного вязания", + color = BlackColor, + fontSize = 20.sp, + fontWeight = FontWeight.W800, + modifier = Modifier.weight(1f) + ) + + Box( + contentAlignment = Alignment.Center, + modifier = Modifier.size(24.dp) + .background(IconsColor.copy(0.3f), AbsoluteRoundedCornerShape(90.dp)) + .clip(AbsoluteRoundedCornerShape(90.dp)) + ) { + Image( + painter = painterResource(com.example.libary.R.drawable.delete), + contentDescription = null + ) + } + } + + Spacer(Modifier.height(84.dp)) + } + } + + LazyColumn( + modifier = Modifier.fillMaxWidth(), + horizontalAlignment = Alignment.CenterHorizontally + ) { + item { + Spacer(Modifier.height(20.dp)) + + Header( + state = HeaderState.Big, + title = "Корзина" + ) + + Spacer(Modifier.height(39.dp)) + + Header( + state = HeaderState.Small, + title = "Корзина" + ) + + Spacer(Modifier.height(40.dp)) + + + BigButton( + state = BigButtonState.Property, + text = "Открытить модальное окно", + onClick = { + modal = !modal + } + ) + + Spacer(Modifier.height(40.dp)) + + BaseCard( + modifier = Modifier.height(138.dp).width(335.dp) + ) {} + + Spacer(Modifier.height(18.dp)) + + PrimaryCard( + name = "Рубашка Воскресенье для машинного вязания", + category = "Мужская одежда", + price = "300", + isAdd = true, + modifier = Modifier.fillMaxWidth().padding(horizontal = 16.dp) + ) + + Spacer(Modifier.height(18.dp)) + + PrimaryCard( + name = "Рубашка Воскресенье для машинного вязания", + category = "Мужская одежда", + price = "300", + isAdd = false, + modifier = Modifier.fillMaxWidth().padding(horizontal = 16.dp) + ) + + Spacer(Modifier.height(18.dp)) + + CartCard( + name = "Рубашка воскресенье для машинного вязания", + modifier = Modifier.fillMaxWidth().padding(horizontal = 16.dp), + price = "300", + count = "1" + ) + + Spacer(Modifier.height(18.dp)) + + ProjectCard( + name = "Мой первый проект", + date = "Прошло 2 дня", + modifier = Modifier.fillMaxWidth().padding(horizontal = 16.dp) + ) + + Spacer(Modifier.height(40.dp)) + + Input( + value = inVal, + modifier = Modifier.fillMaxWidth().padding(start = 16.dp, end = 26.dp), + placeholder = "Введите имя", + onValueChange = { + inVal = it + } + ) + + Spacer(Modifier.height(18.dp)) + + Input( + value = "Иван", + modifier = Modifier.fillMaxWidth().padding(start = 16.dp, end = 26.dp), + placeholder = "Иван", + onValueChange = { + inVal = it + } + ) + + Spacer(Modifier.height(18.dp)) + + Input( + value = inVal, + modifier = Modifier.fillMaxWidth(), + modifierColumn = Modifier.fillMaxWidth().padding(start = 16.dp, end = 26.dp), + topText = "Имя", + placeholder = "Введите имя", + onValueChange = { + inVal = it + } + ) + + Spacer(Modifier.height(18.dp)) + + Input( + value = inVal, + modifier = Modifier.fillMaxWidth(), + modifierColumn = Modifier.fillMaxWidth().padding(start = 16.dp, end = 26.dp), + placeholder = "Иван", + errorText = "Введите ваше имя", + onValueChange = { + inVal = it + } + ) + + Spacer(Modifier.height(18.dp)) + + Input( + value = inVal, + modifier = Modifier.fillMaxWidth(), + modifierColumn = Modifier.fillMaxWidth().padding(start = 16.dp, end = 26.dp), + topText = "Имя", + placeholder = "Введите имя", + onValueChange = { + inVal = it + } + ) + + Spacer(Modifier.height(18.dp)) + + Input( + value = "Введите имя", + modifier = Modifier.fillMaxWidth(), + modifierColumn = Modifier.fillMaxWidth().padding(start = 16.dp, end = 26.dp), + topText = "Имя", + placeholder = "Введите имя", + onValueChange = { + inVal = it + } + ) + + Spacer(Modifier.height(18.dp)) + + Input( + value = passinVal, + modifier = Modifier.fillMaxWidth(), + modifierColumn = Modifier.fillMaxWidth().padding(start = 16.dp, end = 26.dp), + topText = "Имя", + placeholder = "Введите имя", + pasMode = true, + onValueChange = { + passinVal = it + } + ) + + Spacer(Modifier.height(18.dp)) + + Input( + value = inVal, + modifier = Modifier.fillMaxWidth(), + modifierColumn = Modifier.fillMaxWidth().padding(start = 16.dp, end = 26.dp), + placeholder = "--.--.----", + onValueChange = { + inVal = it + } + ) + + Spacer(Modifier.height(40.dp)) + + Select( + value = valSelect, + modifier = Modifier.fillMaxWidth() + .padding(start = 16.dp, end = 26.dp), + placeholder = "Пол", + data = listOf( + "Мужской", + "Женский" + ) + ) + + Spacer(Modifier.height(18.dp)) + + Select( + value = valSelect1, + modifier = Modifier.fillMaxWidth() + .padding(start = 16.dp, end = 26.dp), + leadingIcon = { + Image( + painter = painterResource(R.drawable.user_icon), + contentDescription = null, + modifier = Modifier.size(24.dp) + ) + }, + data = listOf( + "Гарвард Троцкий", + "Гарвард Троцкий" + ) + ) + + Spacer(Modifier.height(40.dp)) + + SearchInput( + value = searchInput.value, + onValueChange = { + searchInput.value = it + } + ) + + Spacer(Modifier.height(40.dp)) + + BigButtonState.entries.forEach { + BigButton( + state = it, + text = "Подтвердить", + modifier = Modifier.fillMaxWidth() + .padding(horizontal = 16.dp, vertical = 16.dp) + ) + } + + Spacer(Modifier.height(40.dp)) + + SmallButton( + state = SmallButtonState.Property, + text = "Добавить" + ) + + Spacer(Modifier.height(5.dp)) + + SmallButton( + state = SmallButtonState.Secondary, + text = "Убрать" + ) + + Spacer(Modifier.height(5.dp)) + + SmallButton( + state = SmallButtonState.Inactive, + text = "Добавить" + ) + + Spacer(Modifier.height(5.dp)) + + SmallButton( + state = SmallButtonState.Tetriary, + text = "Подтвердить" + ) + + Spacer(Modifier.height(40.dp)) + + ChipButton( + state = ChipButtonState.On, + text = "Популярные" + ) + + Spacer(Modifier.height(5.dp)) + + ChipButton( + state = ChipButtonState.Off, + text = "Популярные" + ) + + Spacer(Modifier.height(40.dp)) + + CartButton( + price = "500" + ) + + Spacer(Modifier.height(40.dp)) + + LoginState.entries.forEach { + LoginButton( + state = it + ) + + Spacer(Modifier.height(5.dp)) + } + + Spacer(Modifier.height(40.dp)) + + TabBar( + value = valueTabBar1 + ) + + Spacer(Modifier.height(15.dp)) + + TabBar( + value = valueTabBar2 + ) + + Spacer(Modifier.height(15.dp)) + + TabBar( + value = valueTabBar3 + ) + + Spacer(Modifier.height(15.dp)) + + TabBar( + value = valueTabBar4 + ) + } + } +} \ No newline at end of file diff --git a/app/src/main/res/drawable/user_icon.png b/app/src/main/res/drawable/user_icon.png new file mode 100644 index 0000000000000000000000000000000000000000..1d3ff15b4448f6b7dce5a45d9a1e38f2efde96be GIT binary patch literal 1604 zcmV-K2D|x*P)S9-!~`_{@`v!p7(~!$OeEU)NDyPd z1P~1(0fAK1A`dAL5D;ujDZ8}vvF&!d^Vqo$&rG`wlqPyMcV~9)z31HTJKs683=^A1 zL)FwEu=xIh2XCK$&2v>%RkgOrk7-&!1lUmDsZ*_ojvPI+dH)yoo=t!l-6Qco%<#Ti zw^w|l< zb9R(gtgJt`;Zb9H{UQoUh|M8d>Yd*9osO9o2wnh2&IPiT1y|6ArJ73?oUfY*0aK}G zB@&i8+H{QV|NSCn&5ok>o)YAjO{QQ|=$I5RYZ8fsN?Ei+8v#yqxt2qLvWS%FsD7d~ z+}a8!M~iQtzfp4Y+-t=WHPpv0bf$3UT~Wk49sIDd7uz?*(SGbK%z-5BDn>?|j$u)T zp|pnX&VHOe-i!Us1GtzlF}2X}oNn8B(20*J#st;(vcT6P#iO076CJ6M!_gAwyj-HPWE3Gz~xF8mWwl|EmYrF zKnh{dLNp!8M}*Q9DVCU4O`LNV>#M|o`j9k@-W!sAl_fvO6n1qJtu}tnu9UsQ|GIP?#;A|S#x8MQsTX3 zZD5mvsGU0rr%&3*j|SSutH`f`p-sig4TcaaDTEdSe*Q^fV2I=SCnHc=kPwIwg=(~1 zlUTFn0;*?M;l4X5cNrb&-XRQM%%bv@-dt7l90HNpTYb3Yr0olxXS#48z8HJsGx5Tz zcI;@mmtZGH&%?mneti1lO%UY^QMdRYI^8!ZK(~+b_&*um(_C{1qt!e{(QsEbVVTPC z638M|C@HJPiq+dtTW+AHrWR5wz*vnLg{YZRhb7C_;h~ufvBCL;kl#-mI*^lX{ zX{1O^x6aE$Q;W6niU6m&MblGtAtd{}9+L-_Y)5&7`|Uz?oF(;;Ji^mQK-+ClZR;^( z8s)^3?0`nn4N$$9C@j`+?2NT{lutEA(aN>S^P!j?H!UHkZ;f&hBnJU7N_^+3Zd%<> z3QwZBD|BzH*;$bx~};+3U^`XG0>l++@n*P0n! zZ3kh}_`9z*W7Xo{$dRPRYWuq-N!gQXmiA1UlGhiS-&u)~wtqQAWL}eCyIaiF_s!Fn z2SYBnLmk^rL7SY9l3S+Yt#u_Mz#Rp%%Yy7r5xNKhhN4<=ap0)kIC^Mzd>!P>e^v7B zCDPWzVmK}IT{{O+QKsR^4{SIV_jiP-%C|0!pd-PtaA6S&3Uv_`w$2)QSdRON5P0Uj zQ?(7d?S{wi#*Tu*h+Onixki*B^)zt)9H-N2xT>7NqIc2VL|fM4(oI|XmVm~Ig*Oe+p9d1{1=GlgKhBuF==Dz~u=KMg7uT5II z@aEvlLdOh4XG*!~XgX%C{c>OCqm~w*5;c)?&;A80yW_cJne^@e0000 Unit + onClick: () -> Unit = {} ) { BaseCard( modifier = modifier diff --git a/libary/src/main/java/com/example/libary/Input.kt b/libary/src/main/java/com/example/libary/Input.kt index 92f1961..382079b 100644 --- a/libary/src/main/java/com/example/libary/Input.kt +++ b/libary/src/main/java/com/example/libary/Input.kt @@ -33,6 +33,7 @@ import com.example.libary.theme.InputStroke @Composable fun Input( modifier: Modifier = Modifier, + modifierColumn: Modifier = Modifier, value: String = "", placeholder: String = "", topText: String = "", @@ -42,7 +43,7 @@ fun Input( ) { var vis by remember { mutableStateOf(false) } - Column { + Column(modifierColumn) { if (topText.isNotEmpty()) { Text( text = topText, @@ -96,7 +97,7 @@ fun Input( focusedTextColor = BlackColor, unfocusedTextColor = BlackColor, - focusedIndicatorColor = if (errorText.isNotEmpty()) Error1Color else InputStroke, + focusedIndicatorColor = if (errorText.isNotEmpty()) Error1Color else AccentColor, unfocusedIndicatorColor = if (errorText.isNotEmpty()) Error1Color else InputStroke, focusedContainerColor = if (errorText.isNotEmpty()) Error1Color.copy(0.1f) else InputBGColor, diff --git a/libary/src/main/java/com/example/libary/Select.kt b/libary/src/main/java/com/example/libary/Select.kt index 08e332b..ecb1582 100644 --- a/libary/src/main/java/com/example/libary/Select.kt +++ b/libary/src/main/java/com/example/libary/Select.kt @@ -32,8 +32,9 @@ fun Select( modifier: Modifier = Modifier, value: MutableState, data: List, - placeholder: String = "" -) { + placeholder: String = "", + leadingIcon: @Composable (() -> Unit)? = null, + ) { var modal by remember { mutableStateOf(false) } OutlinedTextField( @@ -41,6 +42,7 @@ fun Select( onValueChange = {}, modifier = modifier, shape = AbsoluteRoundedCornerShape(10.dp), + leadingIcon = leadingIcon, placeholder = { Text( text = placeholder,