[D83T-14] SplashActivity UI 구현

간단한 애니메이션을 추가했고, 로그인 버튼은 미리 구현해두었습니다.
추후 로직 구성하고나서 분기처리하여 보여주면 되겠습니다.^^d

presentation/src/main/AndroidManifest.xml

@@ -13,17 +13,19 @@
         android:supportsRtl="true"
         android:theme="@style/Theme.Bpm"
         tools:targetApi="31">
-
         <activity
-            android:name=".ui.main.MainActivity"
+            android:name=".ui.splash.SplashActivity"
             android:exported="true"
             android:theme="@style/Theme.Bpm.NoActionBar">
             <intent-filter>
                 <action android:name="android.intent.action.MAIN" />
-
                 <category android:name="android.intent.category.LAUNCHER" />
             </intent-filter>
         </activity>
+        <activity
+            android:name=".ui.main.MainActivity"
+            android:exported="true"
+            android:theme="@style/Theme.Bpm.NoActionBar" />
     </application>
 
 </manifest>

presentation/src/main/java/com/d83t/bpm/presentation/compose/theme/Shape.kt

@@ -4,7 +4,7 @@ import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material.Shapes
 import androidx.compose.ui.unit.dp
 
-val Shapes = Shapes(
+val BPMShapes = Shapes(
     small = RoundedCornerShape(6.dp),
     medium = RoundedCornerShape(8.dp),
     large = RoundedCornerShape(12.dp)

presentation/src/main/java/com/d83t/bpm/presentation/compose/theme/Theme.kt

@@ -27,7 +27,7 @@ fun BPMTheme(
         MaterialTheme(
             colors = colors,
             typography = BPMTypography,
-            shapes = Shapes,
+            shapes = BPMShapes,
             content = content
         )
     }

presentation/src/main/java/com/d83t/bpm/presentation/compose/theme/Type.kt

@@ -18,6 +18,18 @@ val BPMTypography = Typography(
         fontSize = 16.sp,
         letterSpacing = 0.sp
     ),
+    h5 = TextStyle(
+        fontFamily = pyeongchangPeace,
+        fontWeight = FontWeight.Normal,
+        fontSize = 20.sp,
+        letterSpacing = 0.8.sp
+    ),
+    body1 = TextStyle(
+        fontFamily = pretendard,
+        fontWeight = FontWeight.Medium,
+        fontSize = 14.sp,
+        letterSpacing = 0.sp
+    ),
     // body
     button = TextStyle(
         fontFamily = pretendard,

presentation/src/main/java/com/d83t/bpm/presentation/ui/splash/SplashActivity.kt

@@ -0,0 +1,132 @@
+package com.d83t.bpm.presentation.ui.splash
+
+import android.annotation.SuppressLint
+import android.os.Bundle
+import androidx.compose.animation.core.animateFloatAsState
+import androidx.compose.animation.core.tween
+import androidx.compose.foundation.Image
+import androidx.compose.foundation.background
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.*
+import androidx.compose.material.Icon
+import androidx.compose.material.Text
+import androidx.compose.runtime.*
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Alignment.Companion.Center
+import androidx.compose.ui.Alignment.Companion.CenterStart
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.alpha
+import androidx.compose.ui.draw.clip
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.layout.ContentScale
+import androidx.compose.ui.platform.LocalConfiguration
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+import com.d83t.bpm.presentation.R
+import com.d83t.bpm.presentation.base.BaseComponentActivity
+import com.d83t.bpm.presentation.compose.theme.BPMShapes
+import com.d83t.bpm.presentation.compose.theme.BPMTypography
+import kotlinx.coroutines.delay
+
+@SuppressLint("CustomSplashScreen")
+class SplashActivity : BaseComponentActivity() {
+    override fun onCreate(savedInstanceState: Bundle?) {
+        super.onCreate(savedInstanceState)
+
+        initUi {
+            SplashActivityContent()
+        }
+    }
+
+}
+
+@Composable
+private fun SplashActivityContent() {
+    val subtitleVisibilityState = remember { mutableStateOf(false) }
+    val subtitleAlphaState = animateFloatAsState(
+        targetValue = if (subtitleVisibilityState.value) 1f else 0f,
+        animationSpec = tween(1000)
+    )
+
+    val logoVisibilityState = remember { mutableStateOf(false) }
+    val logoAlphaState = animateFloatAsState(
+        targetValue = if (logoVisibilityState.value) 1f else 0f,
+        animationSpec = tween(1000)
+    )
+
+    LaunchedEffect(key1 = Unit) {
+        delay(200L)
+        subtitleVisibilityState.value = true
+        delay(400L)
+        logoVisibilityState.value = true
+    }
+
+    Box(modifier = Modifier.fillMaxSize()) {
+        Image(
+            modifier = Modifier.fillMaxSize(),
+            painter = painterResource(id = R.drawable.bg_splash),
+            contentDescription = "splashBackground",
+            contentScale = ContentScale.Crop
+        )
+
+        Column(
+            modifier = Modifier
+                .padding(start = 30.dp)
+                .height((LocalConfiguration.current.screenHeightDp / 2).dp),
+            verticalArrangement = Arrangement.Bottom
+        ) {
+            Text(
+                modifier = Modifier
+                    .padding(bottom = 8.dp)
+                    .alpha(subtitleAlphaState.value),
+                text = "당신을 위한\n바디프로필 매니저",
+                style = BPMTypography.h5,
+                color = Color.White
+            )
+
+            Image(
+                modifier = Modifier.alpha(logoAlphaState.value),
+                painter = painterResource(id = R.drawable.logo_splash),
+                contentDescription = "splashLogo"
+            )
+        }
+
+        Box(
+            modifier = Modifier
+                .padding(bottom = 30.dp)
+                .padding(horizontal = 16.dp)
+                .clip(shape = BPMShapes.small)
+                .fillMaxWidth()
+                .height(48.dp)
+                .background(Color(0xFFFEE500))
+                .align(Alignment.BottomCenter)
+                .clickable {
+                    // todo : onClickKakaoLogin
+                }
+        ) {
+            Icon(
+                modifier = Modifier
+                    .padding(start = 18.dp)
+                    .size(24.dp)
+                    .align(CenterStart),
+                painter = painterResource(id = R.drawable.ic_kakao),
+                contentDescription = "kakaoIcon"
+            )
+
+            Text(
+                modifier = Modifier
+                    .align(Center),
+                text = "카카오톡으로 시작하기",
+                style = BPMTypography.body1,
+                color = Color.Black
+            )
+        }
+    }
+}
+
+@Preview(showBackground = true)
+@Composable
+private fun Preview() {
+    SplashActivityContent()
+}

presentation/src/main/res/drawable/ic_kakao.xml

@@ -0,0 +1,9 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="24"
+    android:viewportHeight="24">
+  <path
+      android:pathData="M11.799,3C6.388,3 2,6.371 2,10.531C2,13.204 3.817,15.55 6.547,16.889L5.623,20.243C5.588,20.346 5.617,20.455 5.694,20.529C5.747,20.581 5.817,20.609 5.894,20.609C5.953,20.609 6.011,20.587 6.064,20.546L10.035,17.937C10.611,18.017 11.199,18.063 11.799,18.063C17.21,18.063 21.598,14.692 21.598,10.531C21.598,6.371 17.21,3 11.799,3Z"
+      android:fillColor="#3C1E1E"/>
+</vector>

presentation/src/main/res/drawable/logo_splash.xml

@@ -0,0 +1,18 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="168dp"
+    android:height="64dp"
+    android:viewportWidth="168"
+    android:viewportHeight="64">
+  <path
+      android:pathData="M50.74,40.01C50.1,35.14 47.34,31.5 44.36,27.81C43.91,27.26 43.56,26.67 43.3,26.05C42.23,23.53 42.88,21.23 43.91,18.86C46.04,13.96 45.4,8.15 40.88,4.85C39.14,3.58 37,2.81 34.67,2.81H3.84C3.28,2.82 2.83,3.27 2.83,3.84V60.86C2.83,61.54 3.37,62.09 4.05,62.09L32.22,62.12C35.62,62.12 38.12,61.25 40.9,59.7C42.44,58.85 43.87,57.79 45.13,56.54C46.32,55.37 47.35,54.05 48.2,52.6C48.4,52.26 48.6,51.91 48.78,51.55C50.58,48.01 51.27,43.94 50.76,40L50.74,40.01ZM29.03,22.39H20.16V18.93H29.03V22.39ZM29.03,44.2H20.16V40.73H29.03V44.2Z"
+      android:fillColor="#ffffff"/>
+  <path
+      android:pathData="M98.88,13.9C97.02,9.81 93.63,6.38 89.47,4.72C86.95,3.72 84.27,3.31 81.55,3.17C78.67,3.02 75.75,3.16 72.94,3.16C68.31,3.16 67.71,3.25 63.07,3.27C61.55,3.27 60.04,3.29 58.51,3.3C57.72,3.3 57.08,3.96 57.08,4.75V61.83H84.53C83.9,56.18 83.27,50.54 82.64,44.89C82.42,42.89 83.74,41.06 85.7,40.59C90.63,39.42 95.1,36.27 97.76,31.94C101.04,26.6 101.47,19.61 98.87,13.9H98.88ZM78.81,27.3L77.41,18.58L80.86,18L82.26,26.72L78.81,27.3Z"
+      android:fillColor="#ffffff"/>
+  <path
+      android:pathData="M161.87,20.14C161.04,18.67 160,17.33 158.79,16.14C157.65,15.02 156.35,14.03 154.95,13.23C154.61,13.04 154.27,12.86 153.92,12.68C150.47,10.97 146.5,10.32 142.66,10.8C137.91,11.41 134.36,14.03 130.76,16.84C130.22,17.26 129.65,17.59 129.05,17.84C126.59,18.86 124.35,18.24 122.03,17.26C117.25,15.25 111.58,15.85 108.36,20.13C107.12,21.78 106.38,23.81 106.38,26V61.13C106.38,61.66 106.82,62.09 107.37,62.09H118.54V40.73H122.15V62.09H142.91V40.73H146.48V62.09H162.99C163.65,62.09 164.18,61.58 164.18,60.93L164.21,28.35C164.21,25.13 163.37,22.77 161.86,20.14H161.87Z"
+      android:fillColor="#ffffff"/>
+  <path
+      android:pathData="M125.8,13.49C128.74,13.49 131.12,11.1 131.12,8.16C131.12,5.21 128.74,2.82 125.8,2.82C122.86,2.82 120.48,5.21 120.48,8.16C120.48,11.1 122.86,13.49 125.8,13.49Z"
+      android:fillColor="#ffffff"/>
+</vector>