Merge pull request #90 from apeun-gidaechi/feature/88_join_ui_change

Feature/Create Join Screen
apeun-gidaechi · May 7, 2024 · ea9d8bd · ea9d8bd
2 parents 016a9b7 + 9fcc0ca
commit ea9d8bd
Show file tree

Hide file tree

Showing 4 changed files with 36 additions and 78 deletions.
diff --git a/feature-onboarding/join/src/main/java/com/apeun/gidaechi/EmailSignUp.kt b/feature-onboarding/join/src/main/java/com/apeun/gidaechi/EmailSignUp.kt
@@ -1,11 +1,9 @@
 package com.apeun.gidaechi
 
 import android.util.Log
-import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.Spacer
-import androidx.compose.foundation.layout.fillMaxHeight
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
@@ -18,18 +16,14 @@ 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.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
-import com.apeun.gidaechi.designsystem.animation.bounceClick
 import com.apeun.gidaechi.designsystem.component.ButtonType
 import com.apeun.gidaechi.designsystem.component.SeugiFullWidthButton
 import com.apeun.gidaechi.designsystem.component.SeugiTopBar
 import com.apeun.gidaechi.designsystem.component.textfield.SeugiPasswordTextField
 import com.apeun.gidaechi.designsystem.component.textfield.SeugiTextField
-import com.apeun.gidaechi.designsystem.theme.Primary500
 import com.apeun.gidaechi.designsystem.theme.Red500
 import com.apeun.gidaechi.designsystem.theme.SeugiTheme
 
@@ -158,25 +152,15 @@ internal fun EmailSignUpScreen() {
                 }
             }
 
-            Column(
-                horizontalAlignment = Alignment.CenterHorizontally,
-                verticalArrangement = Arrangement.Bottom,
-                modifier = Modifier.fillMaxHeight(),
-            ) {
-                Text(
-                    text = "이미 계정이 있으신가요?",
-                    style = MaterialTheme.typography.bodySmall,
-                    color = Primary500,
-                    modifier = Modifier.bounceClick({}),
-                )
-                SeugiFullWidthButton(
-                    onClick = { error = !error },
-                    type = ButtonType.Primary,
-                    text = "계속하기",
-                    modifier = Modifier
-                        .padding(vertical = 16.dp),
-                )
-            }
+            Spacer(modifier = Modifier.weight(1f))
+
+            SeugiFullWidthButton(
+                onClick = { Log.d("TAG", "EmailSignUpScreen: ") },
+                type = ButtonType.Primary,
+                text = "계속하기",
+                modifier = Modifier
+                    .padding(vertical = 16.dp),
+            )
         }
     }
 }

diff --git a/feature-onboarding/join/src/main/java/com/apeun/gidaechi/EmailVerification.kt b/feature-onboarding/join/src/main/java/com/apeun/gidaechi/EmailVerification.kt
@@ -41,7 +41,6 @@ import kotlinx.coroutines.delay
 @OptIn(ExperimentalMaterial3Api::class)
 @Composable
 fun EmailVerificationScreen() {
-
     var timeLeft by remember { mutableStateOf(0) }
 
     val minutes = timeLeft / 60
@@ -56,8 +55,6 @@ fun EmailVerificationScreen() {
         mutableStateOf(false)
     }
 
-
-
     LaunchedEffect(key1 = timeLeft) {
         while (timeLeft > 0) {
             delay(1000L)
@@ -90,7 +87,7 @@ fun EmailVerificationScreen() {
                     content = "이메일 함을 확인해 보세요",
                     onDismissRequest = {
                         dialogState = false
-                    }
+                    },
                 )
             }
             Column(
@@ -101,17 +98,16 @@ fun EmailVerificationScreen() {
             ) {
                 Spacer(modifier = Modifier.height(6.dp))
                 Column(
-                    modifier = Modifier.fillMaxWidth()
+                    modifier = Modifier.fillMaxWidth(),
                 ) {
-
                     Row(
                         modifier = Modifier.padding(start = 4.dp),
                     ) {
                         Text(text = "인증코드", style = MaterialTheme.typography.titleMedium)
                         Text(
                             text = " *",
                             style = MaterialTheme.typography.titleMedium,
-                            color = Red500
+                            color = Red500,
                         )
                     }
                     SeugiCodeTextField(
@@ -140,24 +136,23 @@ fun EmailVerificationScreen() {
                         modifier = Modifier
                             .fillMaxWidth()
                             .padding(top = 4.dp),
-                        horizontalArrangement = Arrangement.End
+                        horizontalArrangement = Arrangement.End,
                     ) {
                         if (!verificationClick) {
-
                             SeugiButton(
                                 onClick = {
                                     verificationClick = true
                                     timeLeft = 300
                                     dialogState = true
                                 },
                                 type = ButtonType.Primary,
-                                text = "인증 코드 전송"
+                                text = "인증 코드 전송",
                             )
                         } else {
                             Text(
                                 text = "$formattedTime",
                                 style = MaterialTheme.typography.bodyMedium,
-                                color = Gray600
+                                color = Gray600,
                             )
                         }
                     }
@@ -166,7 +161,7 @@ fun EmailVerificationScreen() {
 
                 SeugiFullWidthButton(
                     enabled = verificationClick,
-                    onClick = {  },
+                    onClick = { },
                     type = ButtonType.Primary,
                     text = "확인",
                     modifier = Modifier.padding(vertical = 16.dp),
@@ -176,9 +171,8 @@ fun EmailVerificationScreen() {
     }
 }
 
-
 @Preview
 @Composable
 private fun PreviewEmailVerification() {
     EmailVerificationScreen()
-}
+}
diff --git a/feature-onboarding/join/src/main/java/com/apeun/gidaechi/SelectingJob.kt b/feature-onboarding/join/src/main/java/com/apeun/gidaechi/SelectingJob.kt
@@ -5,18 +5,14 @@ import androidx.compose.foundation.BorderStroke
 import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
 import androidx.compose.foundation.border
-import androidx.compose.foundation.clickable
-import androidx.compose.foundation.interaction.MutableInteractionSource
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.Spacer
-import androidx.compose.foundation.layout.aspectRatio
 import androidx.compose.foundation.layout.fillMaxHeight
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
-import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.offset
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
@@ -33,12 +29,10 @@ 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.layout.ContentScale
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
-import com.apeun.gidaechi.designsystem.animation.ButtonState
 import com.apeun.gidaechi.designsystem.animation.bounceClick
 import com.apeun.gidaechi.designsystem.component.ButtonType
 import com.apeun.gidaechi.designsystem.component.SeugiFullWidthButton
@@ -90,39 +84,38 @@ internal fun SelectingJobScreen() {
                 Row {
                     Box(
                         modifier = Modifier
-                            .bounceClick({studentOnOff = true})
+                            .bounceClick({ studentOnOff = true })
                             .fillMaxHeight()
                             .weight(1f)
                             .background(shape = RoundedCornerShape(12.dp), color = Gray100)
                             .border(
                                 border = BorderStroke(
                                     1.dp,
-                                    color = if (studentOnOff) Primary500 else Gray100
+                                    color = if (studentOnOff) Primary500 else Gray100,
                                 ),
                                 shape = RoundedCornerShape(12.dp),
-                            )
+                            ),
 
                     ) {
                         Column(
                             modifier = Modifier
                                 .fillMaxWidth()
-                                .fillMaxHeight()
-                                ,
+                                .fillMaxHeight(),
                             horizontalAlignment = Alignment.CenterHorizontally,
                             verticalArrangement = Arrangement.Center,
                         ) {
                             Spacer(modifier = Modifier.weight(1f))
 
                             Row(
                                 modifier = Modifier.fillMaxWidth(),
-                                horizontalArrangement = Arrangement.Center
+                                horizontalArrangement = Arrangement.Center,
                             ) {
                                 Text(text = "학생", style = MaterialTheme.typography.titleMedium, color = if (studentOnOff) Black else Gray500)
                                 if (studentOnOff) {
                                     Spacer(modifier = Modifier.width(4.dp))
                                     Image(
                                         painter = painterResource(id = R.drawable.img_check),
-                                        contentDescription = ""
+                                        contentDescription = "",
                                     )
                                 }
                             }
@@ -132,8 +125,7 @@ internal fun SelectingJobScreen() {
                                 contentDescription = "",
                                 modifier = Modifier
                                     .size(152.dp)
-                                    .offset(y=(4).dp)
-                                    .aspectRatio(studentPainter.intrinsicSize.width / studentPainter.intrinsicSize.height), // 이미지의 가로 세로 비율 유지
+                                    .offset(y = 4.dp),
                                 contentScale = ContentScale.Fit,
                             )
                         }
@@ -147,31 +139,30 @@ internal fun SelectingJobScreen() {
                             .background(shape = RoundedCornerShape(12.dp), color = Gray100)
                             .border(
                                 border = BorderStroke(
-                                    1.dp,
-                                    color = if (!studentOnOff) Primary500 else Gray100
+                                    width = 1.dp,
+                                    color = if (!studentOnOff) Primary500 else Gray100,
                                 ),
                                 shape = RoundedCornerShape(12.dp),
-                            )
+                            ),
                     ) {
                         Column(
                             modifier = Modifier
                                 .fillMaxWidth()
-                                .fillMaxHeight()
-                                ,
+                                .fillMaxHeight(),
                             horizontalAlignment = Alignment.CenterHorizontally,
                             verticalArrangement = Arrangement.Center,
                         ) {
                             Spacer(modifier = Modifier.weight(1f))
                             Row(
                                 modifier = Modifier.fillMaxWidth(),
-                                horizontalArrangement = Arrangement.Center
+                                horizontalArrangement = Arrangement.Center,
                             ) {
                                 Text(text = "선생님", style = MaterialTheme.typography.titleMedium, color = if (!studentOnOff) Black else Gray500)
                                 if (!studentOnOff) {
                                     Spacer(modifier = Modifier.width(4.dp))
                                     Image(
                                         painter = painterResource(id = R.drawable.img_check),
-                                        contentDescription = ""
+                                        contentDescription = "",
                                     )
                                 }
                             }
@@ -181,9 +172,8 @@ internal fun SelectingJobScreen() {
                                 contentDescription = "",
                                 modifier = Modifier
                                     .size(152.dp)
-                                    .offset(y=(4).dp)
-                                    .aspectRatio(teacherPainter.intrinsicSize.width / studentPainter.intrinsicSize.height),
-                                contentScale = ContentScale.Fit
+                                    .offset(y = 4.dp),
+                                contentScale = ContentScale.Fit,
                             )
                         }
                     }
@@ -193,7 +183,6 @@ internal fun SelectingJobScreen() {
             Column(
                 horizontalAlignment = Alignment.CenterHorizontally,
             ) {
-
                 SeugiFullWidthButton(
                     onClick = { /*TODO*/ },
                     type = ButtonType.Primary,

diff --git a/feature-onboarding/join/src/main/java/com/apeun/gidaechi/WaitingJoin.kt b/feature-onboarding/join/src/main/java/com/apeun/gidaechi/WaitingJoin.kt
@@ -6,11 +6,9 @@ import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.Spacer
-import androidx.compose.foundation.layout.aspectRatio
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
-import androidx.compose.foundation.layout.offset
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.material3.ExperimentalMaterial3Api
@@ -24,13 +22,11 @@ import androidx.compose.ui.layout.ContentScale
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
-import com.apeun.gidaechi.designsystem.animation.bounceClick
 import com.apeun.gidaechi.designsystem.component.ButtonType
 import com.apeun.gidaechi.designsystem.component.SeugiFullWidthButton
 import com.apeun.gidaechi.designsystem.component.SeugiToolTip
 import com.apeun.gidaechi.designsystem.component.SeugiTopBar
 import com.apeun.gidaechi.designsystem.component.ToolTipType
-import com.apeun.gidaechi.designsystem.theme.Primary500
 import com.apeun.gidaechi.designsystem.theme.SeugiTheme
 import com.apeun.gidaechi.join.R
 
@@ -61,27 +57,24 @@ fun WaitingJoinScreen() {
                         .fillMaxWidth()
                         .padding(horizontal = 50.dp),
                     verticalArrangement = Arrangement.Center,
-                    horizontalAlignment = Alignment.CenterHorizontally
+                    horizontalAlignment = Alignment.CenterHorizontally,
                 ) {
                     Image(
                         painter = painter,
                         contentDescription = "",
                         modifier = Modifier
-                            .size(145.dp)
-                            .aspectRatio(painter.intrinsicSize.width / painter.intrinsicSize.height), // 이미지의 가로 세로 비율 유지
+                            .size(145.dp),
                         contentScale = ContentScale.Fit,
                     )
                     Spacer(modifier = Modifier.height(10.dp))
                     Text(text = "대구소프트웨어마이스터고등학교", style = MaterialTheme.typography.titleLarge)
                     Spacer(modifier = Modifier.height(15.dp))
                     Row(
                         modifier = Modifier.fillMaxWidth(),
-                        horizontalArrangement = Arrangement.End
+                        horizontalArrangement = Arrangement.End,
                     ) {
-
                         SeugiToolTip(text = "가입 수락을 대기중이에요", type = ToolTipType.Side)
                     }
-
                 }
                 Spacer(modifier = Modifier.weight(1f))
                 Column(
@@ -99,10 +92,8 @@ fun WaitingJoinScreen() {
     }
 }
 
-
-
 @Preview
 @Composable
 private fun WaitingJoin() {
     WaitingJoinScreen()
-}
+}