[FEAT/#15] TerningTopAppBar 구현

teamterning · Jul 6, 2024 · 2f58463 · 2f58463
1 parent 2c463df
commit 2f58463
Show file tree

Hide file tree

Showing 5 changed files with 62 additions and 38 deletions.
diff --git a/core/src/main/java/com/terning/core/component/topappbar/TerningTopAppBar.kt b/core/src/main/java/com/terning/core/component/topappbar/TerningTopAppBar.kt
diff --git a/feature/src/main/java/com/terning/feature/component/topappbar/TerningTopAppBar.kt b/feature/src/main/java/com/terning/feature/component/topappbar/TerningTopAppBar.kt
@@ -0,0 +1,46 @@
+package com.terning.feature.component.topappbar
+
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.material3.ExperimentalMaterial3Api
+import androidx.compose.material3.Icon
+import androidx.compose.material3.IconButton
+import androidx.compose.material3.Text
+import androidx.compose.material3.TopAppBar
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.text.style.TextAlign
+import com.terning.feature.R
+
+@OptIn(ExperimentalMaterial3Api::class)
+@Composable
+fun TerningTopAppBar(
+    title: String,
+    showBackButton: Boolean = false,
+    customActions: List<@Composable (() -> Unit)>? = null,
+    onBackButtonClick: (() -> Unit)? = null,
+) {
+    TopAppBar(
+        title = {
+            Text(text = title, modifier = Modifier.fillMaxWidth(), textAlign = TextAlign.Center)
+        },
+        navigationIcon = {
+            if (showBackButton) {
+                IconButton(onClick = {
+                    onBackButtonClick?.invoke()
+                }) {
+                    Icon(
+                        painter = painterResource(id = R.drawable.ic_btn_back),
+                        contentDescription = stringResource(id = R.string.ic_btn_back)
+                    )
+                }
+            }
+        },
+        actions = {
+            customActions?.forEach { customAction ->
+                customAction()
+            }
+        },
+    )
+}
diff --git a/feature/src/main/java/com/terning/feature/main/MainScreen.kt b/feature/src/main/java/com/terning/feature/main/MainScreen.kt
@@ -18,7 +18,7 @@ import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
 import androidx.navigation.compose.NavHost
-import com.terning.core.component.topappbar.TerningTopAppBar
+import com.terning.feature.component.topappbar.TerningTopAppBar
 import com.terning.core.designsystem.theme.Grey300
 import com.terning.core.designsystem.theme.TerningMain
 import com.terning.core.designsystem.theme.White

diff --git a/feature/src/main/res/drawable/ic_btn_back.xml b/feature/src/main/res/drawable/ic_btn_back.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="M10.561,16.748C10.571,16.406 10.692,16.115 10.963,15.854L18.798,8.19C19.009,7.969 19.29,7.858 19.612,7.858C20.264,7.858 20.777,8.36 20.777,9.013C20.777,9.335 20.646,9.626 20.425,9.857L13.364,16.748L20.425,23.638C20.646,23.859 20.777,24.151 20.777,24.472C20.777,25.135 20.264,25.637 19.612,25.637C19.29,25.637 19.009,25.527 18.798,25.306L10.963,17.642C10.692,17.381 10.561,17.089 10.561,16.748Z"
+        android:fillColor="#373737"/>
+  </group>
+</vector>
diff --git a/feature/src/main/res/values/strings.xml b/feature/src/main/res/values/strings.xml
@@ -10,4 +10,6 @@
     <string name="bottom_nav_search">탐색</string>
     <string name="bottom_nav_my_page">마이페이지</string>
 
+    <!--    ContentDescription-->
+    <string name="ic_btn_back">뒤로가기 버튼</string>
 </resources>