Подъём состояния
Поднимайте состояние для повторного использования компонуемых элементов
«Подъём состояния» — бесплатный урок Android Academy на CoddyKit. Это урок 3 из 4. Ты можешь прочитать весь урок бесплатно ниже — а потом практиковать его прямо в браузере с встроенным редактором кода и ИИ-репетитором 24/7. Это часть пути обучения Android Academy, и твой прогресс синхронизируется между веб-версией и приложением CoddyKit. Курс Android Academy содержит 4 уроков всего.
Что такое поднятие состояния?
Поднятие состояния означает перемещение состояния вверх, из компонуемого элемента в вызывающий его код. Компонуемый элемент становится не имеющим состояния: он только получает значение и сообщает об изменениях.
Элементы с состоянием и без состояния
Компонуемый элемент с состоянием хранит своё состояние с помощью remember. Компонуемый элемент без состояния ничего не хранит: он принимает значение как параметр и предоставляет событие. Такие компонуемые элементы проще повторно использовать и тестировать.
Шаблон value + onValueChange
Стандартная форма поднятия состояния содержит два параметра: value (текущее состояние, передаваемое вниз) и лямбду onValueChange (событие, передаваемое вверх).
@Composable
fun NameField(value: String, onValueChange: (String) -> Unit) {
TextField(value = value, onValueChange = onValueChange)
}До поднятия состояния
Здесь компонуемый элемент владеет своим состоянием. Это работает, но родитель не имеет доступа к тексту, а компонуемый элемент сложнее повторно использовать.
@Composable
fun NameField() {
var name by remember { mutableStateOf("") }
TextField(value = name, onValueChange = { name = it })
}После поднятия состояния
Теперь состояние находится в родительском элементе. Поле не хранит состояние и может повторно использоваться, а родитель управляет значением.
@Composable
fun Parent() {
var name by remember { mutableStateOf("") }
NameField(value = name, onValueChange = { name = it })
}Вниз и вверх
Шаблон выглядит так: состояние передаётся вниз, события — вверх. Значение передаётся вниз как параметр, а изменения — вверх через обратный вызов. Это называется однонаправленным потоком данных.
Зачем поднимать состояние?
Поднятие состояния позволяет нескольким компонуемым элементам совместно использовать одно состояние, позволяет родителю реагировать на изменения и превращает дочерний элемент в чистую функцию его входных данных — это идеально для предварительного просмотра и тестов.
Куда поднимать состояние
Поднимайте состояние к ближайшему общему предку, которому оно нужно. Если состояние использует только один компонуемый элемент, поднятие может быть излишним. Поднимайте состояние, когда компоненту выше по иерархии нужно его читать или изменять.
Пример с общим состоянием
Здесь одно состояние управляет и полем, и предварительным просмотром в реальном времени — это возможно только благодаря поднятию состояния.
@Composable
fun Editor() {
var text by remember { mutableStateOf("") }
Column {
TextField(value = text, onValueChange = { text = it })
Text(text = "Preview: $text")
}
}Элемент без состояния можно повторно использовать
Поскольку компонуемый элемент без состояния принимает значение как параметр, его можно просматривать с примером данных и использовать в любом месте с другими владельцами состояния.
@Preview
@Composable
fun NameFieldPreview() {
NameField(value = "Sample", onValueChange = {})
}Объединяем всё вместе
Повторно используемый счётчик, в котором родитель владеет значением счётчика, а кнопка не хранит состояния.
@Composable
fun CounterButton(count: Int, onIncrement: () -> Unit) {
Button(onClick = onIncrement) {
Text(text = "Count: $count")
}
}
@Composable
fun Screen() {
var count by remember { mutableStateOf(0) }
CounterButton(count = count, onIncrement = { count++ })
}Быстрая проверка
Какие два элемента обычно предоставляет компонуемый элемент без состояния при поднятии состояния?
Повторение
Поднятие состояния:
- Переместите состояние в вызывающий код, сделав дочерний элемент не имеющим состояния.
- Используйте шаблон
value+onValueChange. - Состояние вниз, события вверх — однонаправленный поток данных.
- Поднимайте состояние к ближайшему общему предку, которому оно нужно.
Часто задаваемые вопросы
Урок «Подъём состояния» бесплатный?
Да — полный текст урока «Подъём состояния» бесплатно доступен здесь в веб-версии. Чтобы практиковать его интерактивно (встроенный редактор кода и ИИ-репетитор 24/7) и разблокировать остальной курс Android Academy, подпишись на CoddyKit PRO. Курс Android Academy содержит 4 уроков всего.
Чему я научусь в уроке «Подъём состояния»?
Поднимайте состояние для повторного использования компонуемых элементов Ты практикуешь Android Academy с помощью реального кода, который запускаешь прямо в браузере, и ИИ-репетитор 24/7 отвечает на твои вопросы во время урока.
Нужен ли мне опыт, чтобы начать Android Academy?
Предыдущий опыт не требуется. Android Academy на CoddyKit структурирован для всех уровней — от новичков до продвинутых, поэтому ты можешь начать отсюда или с самого начала и учиться в своем темпе. Это урок 3 из 4.
Сколько времени занимает урок «Подъём состояния»?
Большинство уроков CoddyKit занимают около 5–10 минут. Каждый из них компактный и интерактивный, поэтому ты постоянно делаешь прогресс и продолжаешь с того же места в веб-версии и приложении.
Можно ли писать и запускать код в этом уроке Android Academy?
Да. Каждый урок Android Academy включает встроенный редактор кода, поэтому ты пишешь и запускаешь реальный код прямо в браузере и получаешь моментальную обратную связь от AI — локальная установка не требуется.