Ресурсы в Compose

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)
)
ResourcesSnippets.kt

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)
)
ResourcesSnippets.kt

Строковые формы множественного числа (экспериментальные)

Используйте 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
    )
)
ResourcesSnippets.kt

При использовании метода pluralStringResource необходимо передать значение count дважды, если строка содержит форматирование с использованием числа. Например, для строки %1$d minutes первый параметр count выбирает соответствующую строку для множественного числа, а второй параметр count вставляется в заполнитель %1$d . Если строки множественного числа не содержат форматирования, третий параметр pluralStringResource передавать не нужно.

Более подробную информацию о множественном числе можно найти в документации по строкам количества .

Размеры

Аналогичным образом используйте API dimensionResource для получения измерений из 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)
)
ResourcesSnippets.kt

Цвета

Если вы постепенно внедряете Compose в свое приложение, используйте API colorResource для получения цветов из XML-файла ресурсов. 

// In the res/colors.xml file
// <color name="purple_200">#FFBB86FC</color>

// In your Compose code
Divider(color = colorResource(R.color.purple_200))
ResourcesSnippets.kt

colorResource работает, как и ожидалось, со статическими цветами, но выравнивает ресурсы списка состояний цвета .

Векторные ресурсы и ресурсы изображений

Используйте API painterResource для загрузки векторных изображений или растровых ресурсов в форматах, таких как PNG. Вам не нужно знать тип изображения, просто используйте 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
)
ResourcesSnippets.kt

painterResource декодирует и анализирует содержимое ресурса в основном потоке.

Анимированные векторные рисунки

Используйте API AnimatedImageVector.animatedVectorResource для загрузки анимированного векторного XML-файла. Метод возвращает экземпляр 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
)
ResourcesSnippets.kt

Иконки

Jetpack Compose поставляется с объектом Icons , который служит отправной точкой для использования Material Icons в Compose. Существует пять различных тем значков: Filled , Outlined , Rounded , TwoTone и Sharp . Каждая тема содержит одни и те же значки, но с разным визуальным стилем. Обычно рекомендуется выбрать одну тему и использовать её во всём приложении для обеспечения единообразия.

Чтобы нарисовать иконку, можно использовать компонуемый элемент Icon , который применяет оттенок и обеспечивает размер макета, соответствующий иконке. 

Icon(Icons.Rounded.Menu, contentDescription = "Localized description")
ResourcesSnippets.kt

Некоторые из наиболее часто используемых значков доступны в зависимости androidx.compose.material . Чтобы использовать другие значки Material, добавьте зависимость material-icons-extended в файл build.gradle .

dependencies {
  def composeBom = platform('androidx.compose:compose-bom:2025.05.00')
  implementation composeBom

  implementation 'androidx.compose.material:material-icons-extended'
}

Шрифты

Чтобы использовать шрифты в Compose, загрузите и скомпонуйте файлы шрифтов непосредственно в ваших APK-файлах, поместив их в папку res/font .

Загрузите каждый шрифт с помощью Font API и создайте с ними семейство FontFamily , которое можно использовать в экземплярах TextStyle для создания собственной Typography . Ниже представлен код из примера Crane Compose и его файла 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()
    }
}
ResourcesSnippets.kt

Информацию об использовании загружаемых шрифтов в Compose см. на странице Загружаемые шрифты .

Узнайте больше о типографике в документации по темам в Compose.

{% дословно %} {% endverbatim %} {% дословно %} {% endverbatim %}