You can't use the font-family XML file from `res/font` directory. You have to introduce each font file using Kotlin, then you can use it. All other solutions are given in Material2. So, here is the M3 solution for setting default font-family.
----
For Material3 (Material Design 3):
> Note: Unlike the M2 Typography class, the M3 Typography class doesn’t
> currently include a `defaultFontFamily` parameter. You’ll need to use
> the `fontFamily` parameter in each of the individual TextStyles instead.
> ([Source][1])
So, here is an example of setting the default font-family in M3:
```kotlin
// Type.kt
import androidx.compose.material3.Typography
import androidx.compose.ui.text.font.Font
import androidx.compose.ui.text.font.FontFamily
import androidx.compose.ui.text.font.FontStyle
import androidx.compose.ui.text.font.FontWeight
import com.example.exampleapp.R
// Declare the font families
object AppFont {
val TitilliumWeb = FontFamily(
Font(R.font.titillium_web_regular),
Font(R.font.titillium_web_italic, style = FontStyle.Italic),
Font(R.font.titillium_web_medium, FontWeight.Medium),
Font(R.font.titillium_web_medium_italic, FontWeight.Medium, style = FontStyle.Italic),
Font(R.font.titillium_web_bold, FontWeight.Bold),
Font(R.font.titillium_web_bold_italic, FontWeight.Bold, style = FontStyle.Italic)
)
}
private val defaultTypography = Typography()
val Typography = Typography(
displayLarge = defaultTypography.displayLarge.copy(fontFamily = AppFont.TitilliumWeb),
displayMedium = defaultTypography.displayMedium.copy(fontFamily = AppFont.TitilliumWeb),
displaySmall = defaultTypography.displaySmall.copy(fontFamily = AppFont.TitilliumWeb),
headlineLarge = defaultTypography.headlineLarge.copy(fontFamily = AppFont.TitilliumWeb),
headlineMedium = defaultTypography.headlineMedium.copy(fontFamily = AppFont.TitilliumWeb),
headlineSmall = defaultTypography.headlineSmall.copy(fontFamily = AppFont.TitilliumWeb),
titleLarge = defaultTypography.titleLarge.copy(fontFamily = AppFont.TitilliumWeb),
titleMedium = defaultTypography.titleMedium.copy(fontFamily = AppFont.TitilliumWeb),
titleSmall = defaultTypography.titleSmall.copy(fontFamily = AppFont.TitilliumWeb),
bodyLarge = defaultTypography.bodyLarge.copy(fontFamily = AppFont.TitilliumWeb),
bodyMedium = defaultTypography.bodyMedium.copy(fontFamily = AppFont.TitilliumWeb),
bodySmall = defaultTypography.bodySmall.copy(fontFamily = AppFont.TitilliumWeb),
labelLarge = defaultTypography.labelLarge.copy(fontFamily = AppFont.TitilliumWeb),
labelMedium = defaultTypography.labelMedium.copy(fontFamily = AppFont.TitilliumWeb),
labelSmall = defaultTypography.labelSmall.copy(fontFamily = AppFont.TitilliumWeb)
)
```
```kotlin
// Theme.kt
import androidx.compose.material3.MaterialTheme
import androidx.compose.runtime.Composable
@Composable
fun AppTheme(
content: @Composable () -> Unit
) {
MaterialTheme(
typography = Typography,
content = content
)
}
```
Example for an individual component:
```kotlin
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import com.example.exampleapp.theme.AppFont
@Composable
fun ExampleScreen() {
Text(
text = "Hello World!",
fontFamily = AppFont.TitilliumWeb
)
}
```
[1]: https://developer.android.com/jetpack/compose/designsystems/material3#typography
For Material3 (Material Design 3):
> Note: Unlike the M2 Typography class, the M3 Typography class doesn’t
> currently include a `defaultFontFamily` parameter. You’ll need to use
> the `fontFamily` parameter in each of the individual TextStyles instead.
> ([Source][1])
So, here is an example of setting the default font-family in M3:
```kotlin
// Type.kt
import androidx.compose.material3.Typography
import androidx.compose.ui.text.font.Font
import androidx.compose.ui.text.font.FontFamily
import androidx.compose.ui.text.font.FontStyle
import androidx.compose.ui.text.font.FontWeight
import com.example.exampleapp.R
// Declare the font families
object AppFont {
val TitilliumWeb = FontFamily(
Font(R.font.titillium_web_regular),
Font(R.font.titillium_web_italic, style = FontStyle.Italic),
Font(R.font.titillium_web_medium, FontWeight.Medium),
Font(R.font.titillium_web_medium_italic, FontWeight.Medium, style = FontStyle.Italic),
Font(R.font.titillium_web_bold, FontWeight.Bold),
Font(R.font.titillium_web_bold_italic, FontWeight.Bold, style = FontStyle.Italic)
)
}
private val defaultTypography = Typography()
val Typography = Typography(
displayLarge = defaultTypography.displayLarge.copy(fontFamily = AppFont.TitilliumWeb),
displayMedium = defaultTypography.displayMedium.copy(fontFamily = AppFont.TitilliumWeb),
displaySmall = defaultTypography.displaySmall.copy(fontFamily = AppFont.TitilliumWeb),
headlineLarge = defaultTypography.headlineLarge.copy(fontFamily = AppFont.TitilliumWeb),
headlineMedium = defaultTypography.headlineMedium.copy(fontFamily = AppFont.TitilliumWeb),
headlineSmall = defaultTypography.headlineSmall.copy(fontFamily = AppFont.TitilliumWeb),
titleLarge = defaultTypography.titleLarge.copy(fontFamily = AppFont.TitilliumWeb),
titleMedium = defaultTypography.titleMedium.copy(fontFamily = AppFont.TitilliumWeb),
titleSmall = defaultTypography.titleSmall.copy(fontFamily = AppFont.TitilliumWeb),
bodyLarge = defaultTypography.bodyLarge.copy(fontFamily = AppFont.TitilliumWeb),
bodyMedium = defaultTypography.bodyMedium.copy(fontFamily = AppFont.TitilliumWeb),
bodySmall = defaultTypography.bodySmall.copy(fontFamily = AppFont.TitilliumWeb),
labelLarge = defaultTypography.labelLarge.copy(fontFamily = AppFont.TitilliumWeb),
labelMedium = defaultTypography.labelMedium.copy(fontFamily = AppFont.TitilliumWeb),
labelSmall = defaultTypography.labelSmall.copy(fontFamily = AppFont.TitilliumWeb)
)
```
```kotlin
// Theme.kt
import androidx.compose.material3.MaterialTheme
import androidx.compose.runtime.Composable
@Composable
fun AppTheme(
content: @Composable () -> Unit
) {
MaterialTheme(
typography = Typography,
content = content
)
}
```
Example for an individual component:
```kotlin
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import com.example.exampleapp.theme.AppFont
@Composable
fun ExampleScreen() {
Text(
text = "Hello World!",
fontFamily = AppFont.TitilliumWeb
)
}
```
[1]: https://developer.android.com/jetpack/compose/designsystems/material3#typography