[UI/#53] TerningBasicDialog

core/src/main/java/com/terning/core/designsystem/component/button/SortingButton.kt

@@ -39,7 +39,7 @@ fun SortingButton(
                 )
         )
         Image(
-            painter = painterResource(id = R.drawable.ic_down),
+            painter = painterResource(id = R.drawable.ic_down_18),
             contentDescription = stringResource(id = R.string.sort_button_description),
             modifier = modifier
                 .padding(vertical = 5.dp)

core/src/main/java/com/terning/core/designsystem/component/dialog/ScrapDialogContent.kt

@@ -0,0 +1,240 @@
+package com.terning.core.designsystem.component.dialog
+
+import androidx.compose.foundation.Image
+import androidx.compose.foundation.background
+import androidx.compose.foundation.border
+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.fillMaxWidth
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.width
+import androidx.compose.foundation.layout.wrapContentHeight
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material3.HorizontalDivider
+import androidx.compose.material3.Icon
+import androidx.compose.material3.IconButton
+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.layout.ContentScale
+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.terning.core.R
+import com.terning.core.designsystem.component.button.RoundButton
+import com.terning.core.designsystem.theme.CalGreen2
+import com.terning.core.designsystem.theme.Grey200
+import com.terning.core.designsystem.theme.Grey300
+import com.terning.core.designsystem.theme.Grey350
+import com.terning.core.designsystem.theme.Grey500
+import com.terning.core.designsystem.theme.TerningMain
+import com.terning.core.designsystem.theme.TerningTheme
+import com.terning.core.designsystem.theme.White
+import com.terning.core.extension.noRippleClickable
+
+
+@Composable
+fun ScrapDialogContent(
+    onDismissRequest: () -> Unit,
+    isScrapped: Boolean,
+) {
+    var isColorChange by remember { mutableStateOf(false) }
+
+    Box(
+        modifier = Modifier
+            .fillMaxWidth()
+            .wrapContentHeight()
+            .padding(30.dp)
+            .background(
+                color = White,
+                shape = RoundedCornerShape(20.dp)
+            ),
+    ) {
+        Row(
+            modifier = Modifier.fillMaxWidth(),
+            horizontalArrangement = Arrangement.End
+        ) {
+            IconButton(onClick = { onDismissRequest() }, modifier = Modifier.padding(6.dp)) {
+                Icon(
+                    painter = painterResource(id = R.drawable.ic_dialog_x_32),
+                    contentDescription = null,
+                    tint = Grey300
+                )
+            }
+        }
+        Box(
+            modifier = Modifier
+                .fillMaxWidth()
+                .padding(top = 32.dp),
+            contentAlignment = Alignment.TopCenter
+        ) {
+            Column(
+                modifier = Modifier
+                    .fillMaxWidth()
+                    .padding(horizontal = 11.dp),
+                horizontalAlignment = Alignment.CenterHorizontally
+            ) {
+                Row(
+                    modifier = Modifier
+                        .width(60.dp)
+                        .height(60.dp)
+                        .border(
+                            width = 1.dp,
+                            color = TerningMain,
+                            shape = RoundedCornerShape(size = 15.dp)
+                        )
+                ) {
+                    Image(
+                        painter = painterResource(
+                            id = R.drawable.ic_character1
+                        ),
+                        modifier = Modifier
+                            .fillMaxWidth()
+                            .background(
+                                Grey200,
+                                shape = RoundedCornerShape(size = 15.dp)
+                            ),
+                        contentDescription = null,
+                        contentScale = ContentScale.Fit,
+                        alignment = Alignment.Center
+                    )
+                }
+                Text(
+                    text = "[한양대학교 컬렉티브임팩트센터] /코이카 영프로페셔널(YP) 모집합니다",
+                    textAlign = TextAlign.Center,
+                    style = TerningTheme.typography.title4,
+                    color = Grey500,
+                    modifier = Modifier.padding(top = 20.dp)
+                )
+                Text(
+                    text = stringResource(id = R.string.dialog_content_scrap_sub_title),
+                    style = TerningTheme.typography.body5,
+                    color = Grey350,
+                    modifier = Modifier.padding(
+                        top = 4.dp,
+                        bottom = 13.dp
+                    )
+                )
+                Column(
+                    horizontalAlignment = Alignment.Start,
+                    verticalArrangement = Arrangement.Top,
+                    modifier = Modifier
+                        .fillMaxWidth()
+                        .padding(horizontal = 13.dp)
+                ) {
+                    Row(
+                        modifier = Modifier
+                            .background(
+                                color = CalGreen2,
+                                shape = RoundedCornerShape(14.dp)
+                            )
+                            .noRippleClickable {
+                                isColorChange = !isColorChange
+                            },
+                        verticalAlignment = Alignment.CenterVertically,
+                        horizontalArrangement = Arrangement.Start
+                    ) {
+                        Icon(
+                            painter = painterResource(
+                                id = if (isColorChange) R.drawable.ic_up_22
+                                else R.drawable.ic_down_22
+                            ),
+                            contentDescription = stringResource(
+                                id = R.string.dialog_content_color_button
+                            ),
+                            tint = White,
+                            modifier = Modifier.padding(
+                                start = 7.dp,
+                                top = 2.dp,
+                                bottom = 2.dp
+                            )
+                        )
+                        Text(
+                            text = stringResource(id = R.string.dialog_content_color_button),
+                            style = TerningTheme.typography.body5,
+                            color = White,
+                            modifier = Modifier.padding(end = 13.dp)
+                        )
+                    }
+                    HorizontalDivider(
+                        thickness = 1.dp,
+                        color = Grey200,
+                        modifier = Modifier.padding(
+                            top = 11.dp,
+                            bottom = 8.dp
+                        )
+                    )
+                    if (isColorChange) {
+                        Text(text = "컬러 팔레트")
+                    } else {
+                        Text(
+                            text = stringResource(id = R.string.intern_item_d_day),
+                            style = TerningTheme.typography.body5,
+                            color = TerningMain,
+                            modifier = Modifier.padding(bottom = 9.dp)
+                        )
+                        Column(
+                            modifier = Modifier.padding(bottom = 29.dp),
+                            verticalArrangement = Arrangement.spacedBy(
+                                5.dp,
+                                Alignment.CenterVertically
+                            ),
+                            horizontalAlignment = Alignment.Start,
+                        ) {
+                            listOf(
+                                stringResource(id = R.string.intern_info_d_day) to "2024년 7월 23일",
+                                stringResource(id = R.string.intern_info_working) to "2개월",
+                                stringResource(id = R.string.intern_info_start_date) to "2024년 8월"
+                            ).forEach { (title, value) ->
+                                InternInfoRow(title, value)
+                            }
+                        }
+                    }
+                }
+                RoundButton(
+                    style = TerningTheme.typography.button3,
+                    paddingVertical = 12.dp,
+                    cornerRadius = 8.dp,
+                    text = if (isScrapped) {
+                        if (isColorChange)
+                            R.string.dialog_content_color_button
+                        else R.string.dialog_scrap_button
+                    } else {
+                        R.string.dialog_scrap_button
+                    },
+                    onButtonClick = { /*TODO*/ },
+                    modifier = Modifier.padding(bottom = 8.dp)
+                )
+            }
+        }
+    }
+}
+
+// TODO 삭제
+@Composable
+fun InternInfoRow(title: String, value: String) {
+    Row(
+        horizontalArrangement = Arrangement.spacedBy(12.dp, Alignment.Start),
+        verticalAlignment = Alignment.Top,
+    ) {
+        Text(
+            text = title,
+            style = TerningTheme.typography.body2,
+            color = Grey350,
+        )
+        Text(
+            text = value,
+            style = TerningTheme.typography.body3,
+            color = Grey500,
+        )
+    }
+}

core/src/main/java/com/terning/core/designsystem/component/dialog/TerningBasicDialog.kt

@@ -0,0 +1,39 @@
+package com.terning.core.designsystem.component.dialog
+
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.window.Dialog
+import androidx.compose.ui.window.DialogProperties
+
+@Composable
+fun TerningBasicDialog(
+    onDismissRequest: () -> Unit,
+    properties: DialogProperties = DialogProperties(
+        usePlatformDefaultWidth = false,
+        decorFitsSystemWindows = true,
+        dismissOnBackPress = true,
+        dismissOnClickOutside = true,
+    ),
+    content: @Composable () -> Unit,
+) {
+    Dialog(
+        onDismissRequest = { onDismissRequest() },
+        properties = properties,
+    ) {
+        content()
+    }
+}
+
+@Preview(showBackground = true, showSystemUi = true)
+@Composable
+fun TerningBasicDialogPreview() {
+    TerningBasicDialog(
+        onDismissRequest = {},
+        content = {
+            ScrapDialogContent(
+                onDismissRequest = {},
+                isScrapped = false
+            )
+        }
+    )
+}

core/src/main/java/com/terning/core/designsystem/theme/Color.kt

@@ -27,6 +27,7 @@ val TerningSub5 = Color(0XFFF8FFFB)
 // Background
 val Back = Color(0xFFF8F8F8)
 val ToastGrey = Color(0XFF666666)
+val BackgroundColor = Color(0x4C000000)
 
 // Calendar Color
 val CalRed = Color(0xFFED4E54)

core/src/main/res/drawable/ic_dialog_x_32.xml

@@ -0,0 +1,13 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="32dp"
+    android:height="32dp"
+    android:viewportWidth="32"
+    android:viewportHeight="32">
+  <group>
+    <clip-path
+        android:pathData="M0,0h32v32h-32z"/>
+    <path
+        android:pathData="M9.511,22.247C9.079,21.815 9.089,21.081 9.511,20.66L14.403,15.758L9.511,10.866C9.089,10.444 9.079,9.711 9.511,9.279C9.943,8.847 10.676,8.857 11.098,9.269L16,14.171L20.892,9.279C21.314,8.857 22.047,8.847 22.479,9.279C22.911,9.711 22.901,10.444 22.479,10.866L17.587,15.758L22.479,20.66C22.901,21.081 22.911,21.815 22.479,22.247C22.047,22.679 21.314,22.669 20.892,22.247L16,17.355L11.098,22.247C10.676,22.669 9.943,22.679 9.511,22.247Z"
+        android:fillColor="#BCBCBC"/>
+  </group>
+</vector>

core/src/main/res/drawable/ic_down_22.xml

@@ -0,0 +1,10 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="22dp"
+    android:height="22dp"
+    android:viewportWidth="22"
+    android:viewportHeight="22">
+  <path
+      android:pathData="M11.492,14.707C11.102,15.098 10.47,15.098 10.08,14.707L4.865,9.48C4.475,9.089 4.475,8.455 4.865,8.064C5.255,7.673 5.887,7.673 6.278,8.064L10.786,12.583L15.294,8.064C15.684,7.673 16.317,7.673 16.707,8.064C17.097,8.455 17.097,9.089 16.707,9.48L11.492,14.707Z"
+      android:fillColor="#ffffff"
+      android:fillType="evenOdd"/>
+</vector>

core/src/main/res/drawable/ic_up_22.xml

@@ -0,0 +1,10 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="22dp"
+    android:height="22dp"
+    android:viewportWidth="22"
+    android:viewportHeight="22">
+  <path
+      android:pathData="M10.508,7.293C10.898,6.902 11.53,6.902 11.92,7.293L17.135,12.52C17.525,12.911 17.525,13.545 17.135,13.936C16.745,14.327 16.113,14.327 15.722,13.936L11.214,9.417L6.706,13.936C6.316,14.327 5.683,14.327 5.293,13.936C4.903,13.545 4.903,12.911 5.293,12.52L10.508,7.293Z"
+      android:fillColor="#ffffff"
+      android:fillType="evenOdd"/>
+</vector>

core/src/main/res/values/strings.xml

@@ -36,4 +36,13 @@
     <string name="sign_up_bottom_sheet_description">회원가입 바텀시트</string>
     <string name="sign_up_dialog_start">저장하기</string>
 
+    <!--Dialog-->
+    <string name="dialog_content_scrap_sub_title">공고를 캘린더에 스크랩하시겠어요?</string>
+    <string name="dialog_content_color_button">색상</string>
+    <string name="dialog_scrap_button">내 캘린더에 스크랩하기</string>
+
+    <!--Intern-->
+    <string name="intern_info_d_day">서류 마감</string>
+    <string name="intern_info_working">근무 기간</string>
+    <string name="intern_info_start_date">근무 시작</string>
 </resources>

feature/src/main/AndroidManifest.xml

@@ -18,7 +18,8 @@
 
         <activity
             android:name="com.kakao.sdk.auth.AuthCodeHandlerActivity"
-            android:exported="true">
+            android:exported="true"
+            android:windowSoftInputMode = "adjustResize" >
             <intent-filter>
                 <action android:name="android.intent.action.VIEW" />