Jetpack Compose может получать доступ к ресурсам, определенным в вашем проекте для Android. В этом документе описаны некоторые API, которые Compose предлагает для этой цели.
Ресурсы – это дополнительные файлы и статический контент, которые используются в коде, например растровые изображения, определения макетов, строки интерфейса, инструкции по анимации и т. д. Если вы не знакомы с ресурсами в Android, ознакомьтесь с обзором ресурсов приложений.
Струны
Самый распространенный тип ресурсов – строки. Используйте API stringResource, чтобы извлекать строки, статически определенные в XML-ресурсах.
// In the res/values/strings.xml file // <string name="compose">Jetpack Compose</string> // In your Compose code Text( text = stringResource(R.string.compose) )
stringResource также работает с позиционным форматированием.
// In the res/values/strings.xml file // <string name="congratulate">Happy %1$s %2$d</string> // In your Compose code Text( text = stringResource(R.string.congratulate, "New Year", 2021) )
Плюрализация строк (экспериментальная функция)
Используйте API pluralStringResource, чтобы загрузить множественное число с определенным количеством.
// In the res/strings.xml file // <plurals name="runtime_format"> // <item quantity="one">%1$d minute</item> // <item quantity="other">%1$d minutes</item> // </plurals> // In your Compose code Text( text = pluralStringResource( R.plurals.runtime_format, quantity, quantity ) )
При использовании метода pluralStringResource счетчик нужно передавать дважды, если в строке есть форматирование с числом. Например, для строки %1$d minutes первый параметр count выбирает подходящую строку во множественном числе, а второй параметр count вставляется в плейсхолдер %1$d.
Если в строках для множественного числа не используется форматирование, передавать третий параметр в функцию pluralStringResource не нужно.
Подробнее о строках для разных чисел…
Размеры
Аналогичным образом можно использовать dimensionResource API, чтобы получить параметры из XML-файла ресурса.
// In the res/values/dimens.xml file // <dimen name="padding_small">8dp</dimen> // In your Compose code val smallPadding = dimensionResource(R.dimen.padding_small) Text( text = "...", modifier = Modifier.padding(smallPadding) )
Цвета
Если вы постепенно внедряете Compose в свое приложение, используйте API colorResource, чтобы получать цвета из XML-файла ресурсов.
// In the res/colors.xml file // <color name="purple_200">#FFBB86FC</color> // In your Compose code HorizontalDivider(color = colorResource(R.color.purple_200))
colorResource работает с статическими цветами, но сглаживает ресурсы списка состояний цвета.
Векторные объекты и ресурсы изображений
Используйте painterResource API, чтобы загружать векторные изображения или растровые форматы, например PNG. Вам не нужно знать тип объекта Drawable. Просто используйте painterResource в композициях Image или модификаторах paint.
// Files in res/drawable folders. For example: // - res/drawable-nodpi/ic_logo.xml // - res/drawable-xxhdpi/ic_logo.png // In your Compose code Icon( painter = painterResource(id = R.drawable.ic_logo), contentDescription = null // decorative element )
painterResource декодирует и анализирует контент ресурса в основном потоке.
Анимированные векторные изображения
Используйте API AnimatedImageVector.animatedVectorResource, чтобы загрузить XML-файл анимированного класса VectorDrawable. Метод возвращает экземпляр AnimatedImageVector. Чтобы показать анимированное изображение, используйте метод rememberAnimatedVectorPainter для создания Painter, который можно использовать в композициях Image и Icon.
Логический параметр atEnd метода rememberAnimatedVectorPainter указывает, нужно ли отрисовывать изображение в конце всех анимаций.
Если используется изменяемое состояние, изменения этого значения запускают соответствующую анимацию.
// Files in res/drawable folders. For example: // - res/drawable/ic_hourglass_animated.xml // In your Compose code val image = AnimatedImageVector.animatedVectorResource(R.drawable.ic_hourglass_animated) val atEnd by remember { mutableStateOf(false) } Icon( painter = rememberAnimatedVectorPainter(image, atEnd), contentDescription = null // decorative element )
Значки
В Jetpack Compose есть объект Icons, который является точкой входа для использования значков Material в Compose. Существует пять тем значков:Filled,Outlined,Rounded,TwoTone иSharp. В каждой теме используются одни и те же значки, но в разных стилях. Обычно рекомендуется выбрать одну тему и использовать ее во всем приложении для обеспечения согласованности.
Чтобы нарисовать значок, можно использовать composable-функцию Icon, которая применяет оттенок и обеспечивает соответствие размера макета значку.
Icon(Icons.Rounded.Menu, contentDescription = "Localized description")
Некоторые из наиболее часто используемых значков доступны в качестве зависимости androidx.compose.material. Чтобы использовать другие значки Material, добавьте зависимость material-icons-extended в файл build.gradle.
dependencies {
def composeBom = platform('androidx.compose:compose-bom:2026.09.00')
implementation composeBom
implementation 'androidx.compose.material:material-icons-extended'
}
Шрифты
Чтобы использовать шрифты в Compose, скачайте и добавьте файлы шрифтов непосредственно в APK, поместив их в папку res/font.
Загрузите каждый шрифт с помощью API Font и создайте FontFamily с ними, который можно использовать в экземплярах TextStyle для создания собственного Typography. Ниже приведен код из примера Crane и файла Typography.kt.
// Define and load the fonts of the app private val light = Font(R.font.raleway_light, FontWeight.W300) private val regular = Font(R.font.raleway_regular, FontWeight.W400) private val medium = Font(R.font.raleway_medium, FontWeight.W500) private val semibold = Font(R.font.raleway_semibold, FontWeight.W600) // Create a font family to use in TextStyles private val craneFontFamily = FontFamily(light, regular, medium, semibold) // Use the font family to define a custom typography val craneTypography = Typography( titleLarge = TextStyle( fontFamily = craneFontFamily ) /* ... */ ) // Pass the typography to a MaterialTheme that will create a theme using // that typography in the part of the UI hierarchy where this theme is used @Composable fun CraneTheme(content: @Composable () -> Unit) { MaterialTheme(typography = craneTypography) { content() } }
Чтобы узнать, как использовать скачиваемые шрифты в Compose, перейдите на страницу Скачиваемые шрифты.
Подробнее о типографике можно узнать из документации по темам в Compose.
Рекомендуем
- Примечание. Текст ссылки показывается, когда JavaScript отключен.
- Загрузка изображений {:#loading-images}
- Material Design 2 в Compose
- Специальные системы проектирования в Compose