[Refactor/#225] 디자인 시스템 타이포그래피 구조 개선

app/src/main/java/com/threegap/bitnagil/MainActivity.kt

@@ -15,6 +15,7 @@ import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.unit.dp
+import com.threegap.bitnagil.designsystem.BitnagilTheme
 import com.threegap.bitnagil.designsystem.component.atom.BitnagilToastContainer
 import com.threegap.bitnagil.designsystem.component.atom.rememberBitnagilToast
 import com.threegap.bitnagil.presentation.util.toast.GlobalBitnagilToast
@@ -45,16 +46,18 @@ class MainActivity : ComponentActivity() {
                 GlobalBitnagilToast.initialize(globalToast)
             }
 
-            Box(modifier = Modifier.fillMaxSize()) {
-                MainScreen(navigator = mainNavigator)
+            BitnagilTheme {
+                Box(modifier = Modifier.fillMaxSize()) {
+                    MainScreen(navigator = mainNavigator)
 
-                BitnagilToastContainer(
-                    state = globalToast,
-                    modifier = Modifier
-                        .align(Alignment.BottomCenter)
-                        .navigationBarsPadding()
-                        .padding(bottom = if (mainNavigator.hasBottomNavigationBarRoute()) 80.dp else 16.dp),
-                )
+                    BitnagilToastContainer(
+                        state = globalToast,
+                        modifier = Modifier
+                            .align(Alignment.BottomCenter)
+                            .navigationBarsPadding()
+                            .padding(bottom = if (mainNavigator.hasBottomNavigationBarRoute()) 80.dp else 16.dp),
+                    )
+                }
             }
         }
     }

core/designsystem/src/main/java/com/threegap/bitnagil/designsystem/Theme.kt

@@ -4,6 +4,8 @@ import androidx.compose.foundation.isSystemInDarkTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.CompositionLocalProvider
 import androidx.compose.runtime.ReadOnlyComposable
+import androidx.compose.runtime.remember
+import androidx.compose.ui.platform.LocalDensity
 import com.threegap.bitnagil.designsystem.color.BitnagilColors
 import com.threegap.bitnagil.designsystem.color.LocalBitnagilColors
 import com.threegap.bitnagil.designsystem.color.bitnagilColorsDark
@@ -32,9 +34,11 @@ fun BitnagilTheme(
         darkTheme -> bitnagilColorsDark()
         else -> bitnagilColorsLight()
     }
+    val density = LocalDensity.current
+    val typography = remember(density) { BitnagilTypography(density) }
 
     CompositionLocalProvider(
-        LocalBitnagilTypography provides LocalBitnagilTypography.current,
+        LocalBitnagilTypography provides typography,
         LocalBitnagilColors provides colors,
         content = content,
     )

core/designsystem/src/main/java/com/threegap/bitnagil/designsystem/typography/Type.kt

@@ -1,176 +1,89 @@
 package com.threegap.bitnagil.designsystem.typography
 
-import androidx.compose.runtime.Composable
 import androidx.compose.runtime.Immutable
 import androidx.compose.runtime.staticCompositionLocalOf
 import androidx.compose.ui.text.TextStyle
+import androidx.compose.ui.text.font.FontFamily
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.style.TextDecoration
-import com.threegap.bitnagil.designsystem.font.cafe24SsurroundAir
+import androidx.compose.ui.unit.Density
+import androidx.compose.ui.unit.dp
+import com.threegap.bitnagil.designsystem.font.cafe24SsurroundAir as cafe24SsurroundAirFamily
 import com.threegap.bitnagil.designsystem.font.pretendard
 
 @Immutable
-class BitnagilTypography internal constructor(
-    private val _headline1: BitnagilTextStyle = BitnagilTextStyle(
-        fontFamily = pretendard,
-        fontWeight = FontWeight.Normal,
-        fontSize = 26,
-        lineHeight = 38,
-        letterSpacing = (-0.5f),
-    ),
-    private val _headline2: BitnagilTextStyle = BitnagilTextStyle(
-        fontFamily = pretendard,
-        fontWeight = FontWeight.Normal,
-        fontSize = 24,
-        lineHeight = 34,
-        letterSpacing = (-0.5f),
-    ),
-    private val _title1: BitnagilTextStyle = BitnagilTextStyle(
-        fontFamily = pretendard,
-        fontWeight = FontWeight.Normal,
-        fontSize = 22,
-        lineHeight = 32,
-        letterSpacing = (-0.5f),
-    ),
-    private val _title2: BitnagilTextStyle = BitnagilTextStyle(
-        fontFamily = pretendard,
-        fontWeight = FontWeight.Normal,
-        fontSize = 20,
-        lineHeight = 30,
-    ),
-    private val _title3: BitnagilTextStyle = BitnagilTextStyle(
-        fontFamily = pretendard,
-        fontWeight = FontWeight.Normal,
-        fontSize = 18,
-        lineHeight = 24,
-    ),
-    private val _subtitle1: BitnagilTextStyle = BitnagilTextStyle(
-        fontFamily = pretendard,
-        fontWeight = FontWeight.Normal,
-        fontSize = 16,
-        lineHeight = 28,
-    ),
-    private val _body1: BitnagilTextStyle = BitnagilTextStyle(
-        fontFamily = pretendard,
-        fontWeight = FontWeight.Normal,
-        fontSize = 16,
-        lineHeight = 24,
-    ),
-    private val _body2: BitnagilTextStyle = BitnagilTextStyle(
-        fontFamily = pretendard,
-        fontWeight = FontWeight.Normal,
-        fontSize = 14,
-        lineHeight = 20,
-        letterSpacing = (-0.5f),
-    ),
-    private val _caption1: BitnagilTextStyle = BitnagilTextStyle(
-        fontFamily = pretendard,
-        fontWeight = FontWeight.Normal,
-        fontSize = 12,
-        lineHeight = 18,
-    ),
-    private val _caption1Underline: BitnagilTextStyle = BitnagilTextStyle(
-        fontFamily = pretendard,
-        fontWeight = FontWeight.Normal,
-        fontSize = 12,
-        lineHeight = 18,
-        decoration = TextDecoration.Underline,
-    ),
-    private val _caption2: BitnagilTextStyle = BitnagilTextStyle(
-        fontFamily = pretendard,
-        fontWeight = FontWeight.Normal,
-        fontSize = 10,
-        lineHeight = 16,
-    ),
-    private val _button1: BitnagilTextStyle = BitnagilTextStyle(
-        fontFamily = pretendard,
-        fontWeight = FontWeight.SemiBold,
-        fontSize = 16,
-        lineHeight = 24,
-    ),
-    private val _button2: BitnagilTextStyle = BitnagilTextStyle(
-        fontFamily = pretendard,
-        fontWeight = FontWeight.SemiBold,
-        fontSize = 14,
-        lineHeight = 20,
-    ),
-    private val _cafe24SsurroundAir: BitnagilTextStyle = BitnagilTextStyle(
-        fontFamily = cafe24SsurroundAir,
-        fontWeight = FontWeight.Light,
-        fontSize = 20,
-        lineHeight = 30,
-        letterSpacing = (-0.5f),
-    ),
-    private val _cafe24SsurroundAir2: BitnagilTextStyle = BitnagilTextStyle(
-        fontFamily = cafe24SsurroundAir,
-        fontWeight = FontWeight.Light,
-        fontSize = 16,
-        lineHeight = 24,
-        letterSpacing = (-0.5f),
-    ),
-) {
-    private val _headline1Bold = _headline1.copy(fontWeight = FontWeight.Bold)
-    private val _headline1Medium = _headline1.copy(fontWeight = FontWeight.Medium)
-    private val _headline2Bold = _headline2.copy(fontWeight = FontWeight.Bold)
-    private val _headline2Medium = _headline2.copy(fontWeight = FontWeight.Medium)
-    private val _title1Bold = _title1.copy(fontWeight = FontWeight.Bold)
-    private val _title1SemiBold = _title1.copy(fontWeight = FontWeight.SemiBold)
-    private val _title1Medium = _title1.copy(fontWeight = FontWeight.Medium)
-    private val _title2Bold = _title2.copy(fontWeight = FontWeight.Bold)
-    private val _title2Medium = _title2.copy(fontWeight = FontWeight.Medium)
-    private val _title3SemiBold = _title3.copy(fontWeight = FontWeight.SemiBold)
-    private val _title3Medium = _title3.copy(fontWeight = FontWeight.Medium)
-    private val _subtitle1SemiBold = _subtitle1.copy(fontWeight = FontWeight.SemiBold)
-    private val _subtitle1Medium = _subtitle1.copy(fontWeight = FontWeight.Medium)
-    private val _body1SemiBold = _body1.copy(fontWeight = FontWeight.SemiBold)
-    private val _body1Medium = _body1.copy(fontWeight = FontWeight.Medium)
-    private val _body2SemiBold = _body2.copy(fontWeight = FontWeight.SemiBold)
-    private val _body2Medium = _body2.copy(fontWeight = FontWeight.Medium)
-    private val _caption1SemiBold = _caption1.copy(fontWeight = FontWeight.SemiBold)
-    private val _caption1Medium = _caption1.copy(fontWeight = FontWeight.Medium)
-    private val _caption1UnderlineSemiBold = _caption1Underline.copy(fontWeight = FontWeight.SemiBold)
-    private val _caption1UnderlineMedium = _caption1Underline.copy(fontWeight = FontWeight.Medium)
-    private val _caption2SemiBold = _caption2.copy(fontWeight = FontWeight.SemiBold)
-    private val _caption2Medium = _caption2.copy(fontWeight = FontWeight.Medium)
-
-    val headline1Bold: TextStyle @Composable get() = _headline1Bold.toDpTextStyle
-    val headline1Medium: TextStyle @Composable get() = _headline1Medium.toDpTextStyle
-    val headline1Regular: TextStyle @Composable get() = _headline1.toDpTextStyle
-    val headline2Bold: TextStyle @Composable get() = _headline2Bold.toDpTextStyle
-    val headline2Medium: TextStyle @Composable get() = _headline2Medium.toDpTextStyle
-    val headline2Regular: TextStyle @Composable get() = _headline2.toDpTextStyle
-    val title1Bold: TextStyle @Composable get() = _title1Bold.toDpTextStyle
-    val title1SemiBold: TextStyle @Composable get() = _title1SemiBold.toDpTextStyle
-    val title1Medium: TextStyle @Composable get() = _title1Medium.toDpTextStyle
-    val title1Regular: TextStyle @Composable get() = _title1.toDpTextStyle
-    val title2Bold: TextStyle @Composable get() = _title2Bold.toDpTextStyle
-    val title2Medium: TextStyle @Composable get() = _title2Medium.toDpTextStyle
-    val title2Regular: TextStyle @Composable get() = _title2.toDpTextStyle
-    val title3SemiBold: TextStyle @Composable get() = _title3SemiBold.toDpTextStyle
-    val title3Medium: TextStyle @Composable get() = _title3Medium.toDpTextStyle
-    val title3Regular: TextStyle @Composable get() = _title3.toDpTextStyle
-    val subtitle1SemiBold: TextStyle @Composable get() = _subtitle1SemiBold.toDpTextStyle
-    val subtitle1Medium: TextStyle @Composable get() = _subtitle1Medium.toDpTextStyle
-    val subtitle1Regular: TextStyle @Composable get() = _subtitle1.toDpTextStyle
-    val body1SemiBold: TextStyle @Composable get() = _body1SemiBold.toDpTextStyle
-    val body1Medium: TextStyle @Composable get() = _body1Medium.toDpTextStyle
-    val body1Regular: TextStyle @Composable get() = _body1.toDpTextStyle
-    val body2SemiBold: TextStyle @Composable get() = _body2SemiBold.toDpTextStyle
-    val body2Medium: TextStyle @Composable get() = _body2Medium.toDpTextStyle
-    val body2Regular: TextStyle @Composable get() = _body2.toDpTextStyle
-    val caption1SemiBold: TextStyle @Composable get() = _caption1SemiBold.toDpTextStyle
-    val caption1Medium: TextStyle @Composable get() = _caption1Medium.toDpTextStyle
-    val caption1Regular: TextStyle @Composable get() = _caption1.toDpTextStyle
-    val caption1UnderlineSemiBold: TextStyle @Composable get() = _caption1UnderlineSemiBold.toDpTextStyle
-    val caption1UnderlineMedium: TextStyle @Composable get() = _caption1UnderlineMedium.toDpTextStyle
-    val caption1UnderlineRegular: TextStyle @Composable get() = _caption1Underline.toDpTextStyle
-    val caption2SemiBold: TextStyle @Composable get() = _caption2SemiBold.toDpTextStyle
-    val caption2Medium: TextStyle @Composable get() = _caption2Medium.toDpTextStyle
-    val caption2Regular: TextStyle @Composable get() = _caption2.toDpTextStyle
-    val button1: TextStyle @Composable get() = _button1.toDpTextStyle
-    val button2: TextStyle @Composable get() = _button2.toDpTextStyle
-    val cafe24SsurroundAir: TextStyle @Composable get() = _cafe24SsurroundAir.toDpTextStyle
-    val cafe24SsurroundAir2: TextStyle @Composable get() = _cafe24SsurroundAir2.toDpTextStyle
+class BitnagilTypography internal constructor(private val density: Density) {
+
+    private fun textStyle(
+        fontWeight: FontWeight,
+        fontSize: Int,
+        lineHeight: Int,
+        letterSpacing: Float = 0f,
+        fontFamily: FontFamily = pretendard,
+        decoration: TextDecoration? = null,
+    ): TextStyle = with(density) {
+        TextStyle(
+            fontWeight = fontWeight,
+            fontFamily = fontFamily,
+            fontSize = fontSize.dp.toSp(),
+            lineHeight = lineHeight.dp.toSp(),
+            letterSpacing = letterSpacing.dp.toSp(),
+            textDecoration = decoration,
+        )
+    }
+
+    val headline1Regular = textStyle(FontWeight.Normal, fontSize = 26, lineHeight = 38, letterSpacing = -0.5f)
+    val headline1Medium = headline1Regular.copy(fontWeight = FontWeight.Medium)
+    val headline1Bold = headline1Regular.copy(fontWeight = FontWeight.Bold)
+
+    val headline2Regular = textStyle(FontWeight.Normal, fontSize = 24, lineHeight = 34, letterSpacing = -0.5f)
+    val headline2Medium = headline2Regular.copy(fontWeight = FontWeight.Medium)
+    val headline2Bold = headline2Regular.copy(fontWeight = FontWeight.Bold)
+
+    val title1Regular = textStyle(FontWeight.Normal, fontSize = 22, lineHeight = 32, letterSpacing = -0.5f)
+    val title1Medium = title1Regular.copy(fontWeight = FontWeight.Medium)
+    val title1SemiBold = title1Regular.copy(fontWeight = FontWeight.SemiBold)
+    val title1Bold = title1Regular.copy(fontWeight = FontWeight.Bold)
+
+    val title2Regular = textStyle(FontWeight.Normal, fontSize = 20, lineHeight = 30)
+    val title2Medium = title2Regular.copy(fontWeight = FontWeight.Medium)
+    val title2Bold = title2Regular.copy(fontWeight = FontWeight.Bold)
+
+    val title3Regular = textStyle(FontWeight.Normal, fontSize = 18, lineHeight = 24)
+    val title3Medium = title3Regular.copy(fontWeight = FontWeight.Medium)
+    val title3SemiBold = title3Regular.copy(fontWeight = FontWeight.SemiBold)
+
+    val subtitle1Regular = textStyle(FontWeight.Normal, fontSize = 16, lineHeight = 28)
+    val subtitle1Medium = subtitle1Regular.copy(fontWeight = FontWeight.Medium)
+    val subtitle1SemiBold = subtitle1Regular.copy(fontWeight = FontWeight.SemiBold)
+
+    val body1Regular = textStyle(FontWeight.Normal, fontSize = 16, lineHeight = 24)
+    val body1Medium = body1Regular.copy(fontWeight = FontWeight.Medium)
+    val body1SemiBold = body1Regular.copy(fontWeight = FontWeight.SemiBold)
+
+    val body2Regular = textStyle(FontWeight.Normal, fontSize = 14, lineHeight = 20, letterSpacing = -0.5f)
+    val body2Medium = body2Regular.copy(fontWeight = FontWeight.Medium)
+    val body2SemiBold = body2Regular.copy(fontWeight = FontWeight.SemiBold)
+
+    val caption1Regular = textStyle(FontWeight.Normal, fontSize = 12, lineHeight = 18)
+    val caption1Medium = caption1Regular.copy(fontWeight = FontWeight.Medium)
+    val caption1SemiBold = caption1Regular.copy(fontWeight = FontWeight.SemiBold)
+
+    val caption1UnderlineRegular = textStyle(FontWeight.Normal, fontSize = 12, lineHeight = 18, decoration = TextDecoration.Underline)
+    val caption1UnderlineMedium = caption1UnderlineRegular.copy(fontWeight = FontWeight.Medium)
+    val caption1UnderlineSemiBold = caption1UnderlineRegular.copy(fontWeight = FontWeight.SemiBold)
+
+    val caption2Regular = textStyle(FontWeight.Normal, fontSize = 10, lineHeight = 16)
+    val caption2Medium = caption2Regular.copy(fontWeight = FontWeight.Medium)
+    val caption2SemiBold = caption2Regular.copy(fontWeight = FontWeight.SemiBold)
+
+    val button1 = textStyle(FontWeight.SemiBold, fontSize = 16, lineHeight = 24)
+    val button2 = textStyle(FontWeight.SemiBold, fontSize = 14, lineHeight = 20)
+
+    val cafe24SsurroundAir = textStyle(FontWeight.Light, fontSize = 20, lineHeight = 30, letterSpacing = -0.5f, fontFamily = cafe24SsurroundAirFamily)
+    val cafe24SsurroundAir2 = textStyle(FontWeight.Light, fontSize = 16, lineHeight = 24, letterSpacing = -0.5f, fontFamily = cafe24SsurroundAirFamily)
 }
 
-internal val LocalBitnagilTypography = staticCompositionLocalOf { BitnagilTypography() }
+internal val LocalBitnagilTypography = staticCompositionLocalOf {
+    BitnagilTypography(Density(density = 1f))
+}