0Pricing
Android Academy · Урок

Кнопки и нажатия

Добавляйте интерактивные кнопки.

«Кнопки и нажатия» — бесплатный урок Android Academy на CoddyKit. Это урок 2 из 4. Ты можешь прочитать весь урок бесплатно ниже — а потом практиковать его прямо в браузере с встроенным редактором кода и ИИ-репетитором 24/7. Это часть пути обучения Android Academy, и твой прогресс синхронизируется между веб-версией и приложением CoddyKit. Курс Android Academy содержит 4 уроков всего.

Что такое кнопка

Кнопка — это компонуемый элемент, на который можно нажать. Когда пользователь нажимает её, приложение выполняет некоторый код.

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

Button(onClick = { }) {
    Text("Tap me")
}

Лямбда onClick

Параметр onClick принимает лямбду — код внутри фигурных скобок { }. Этот код выполняется при каждом нажатии кнопки.

Туда можно поместить любую логику, например вывод сообщения или изменение данных.

Button(onClick = {
    println("Clicked!")
}) {
    Text("Click")
}

Содержимое кнопки

Содержимое внутри замыкающих фигурных скобок имеет область RowScope. В неё можно поместить Text, значки или и то и другое.

В большинстве кнопок находится одна текстовая подпись, описывающая действие.

Button(onClick = { }) {
    Text("Save")
}

Подсчёт нажатий с помощью состояния

Чтобы реагировать на нажатия, сохраните значение с помощью remember и mutableStateOf. При его изменении интерфейс обновляется.

Здесь каждое нажатие увеличивает значение count на единицу.

var count by remember { mutableStateOf(0) }
Button(onClick = { count++ }) {
    Text("Count: $count")
}

Отключение кнопки

Параметр enabled определяет, можно ли нажать кнопку. Установите для него значение false, чтобы сделать кнопку серой и заблокировать нажатия.

Это полезно, пока форма заполнена не полностью.

Button(
    onClick = { },
    enabled = false
) {
    Text("Locked")
}

OutlinedButton

OutlinedButton рисует только границу без заливки. Он работает так же, но выглядит легче.

Используйте его для второстепенных действий рядом с более заметной основной кнопкой.

OutlinedButton(onClick = { }) {
    Text("Cancel")
}

TextButton

TextButton отображает только подпись без границы и заливки. Это самый ненавязчивый стиль кнопки.

Он хорошо подходит для действий с низким приоритетом, например «Пропустить» или «Узнать больше».

TextButton(onClick = { }) {
    Text("Skip")
}

Цвета кнопки

Вы можете изменить цвет кнопки с помощью ButtonDefaults.buttonColors, передав containerColor для фона.

Выбирайте цвета, которые соответствуют вашему бренду и остаются хорошо читаемыми.

Button(
    onClick = { },
    colors = ButtonDefaults.buttonColors(
        containerColor = Color.Green
    )
) {
    Text("Go")
}

IconButton

IconButton — это небольшая круглая область, на которую можно нажать. Она предназначена для одного значка, например сердца или меню.

У неё нет подписи, поэтому она экономит место на панелях инструментов.

IconButton(onClick = { }) {
    Icon(Icons.Default.Favorite, contentDescription = "Like")
}

Изменение формы кнопки

Параметр shape изменяет форму углов. Используйте RoundedCornerShape со значением в dp, чтобы сделать края более округлыми.

Большие значения создают более мягкие кнопки, похожие на капсулы.

Button(
    onClick = { },
    shape = RoundedCornerShape(16.dp)
) {
    Text("Rounded")
}

Именование функций нажатия

Чтобы код оставался аккуратным, передавайте в onClick именованную функцию вместо логики, записанной прямо в этом месте. Так интерфейс легче читать.

Передайте ссылку на функцию или вызовите её внутри лямбды.

fun onSave() { println("Saved") }
Button(onClick = { onSave() }) {
    Text("Save")
}

Быстрая проверка

Проверьте, насколько хорошо вы поняли работу с кнопками.

Итоги

Вы узнали, что Button использует onClick для своего действия, а блок содержимого — для подписи. Состояние с remember позволяет нажатиям изменять интерфейс.

Вы также познакомились с OutlinedButton, TextButton и IconButton, а ещё узнали, как задавать enabled, цвета и форму.

Далее вы научитесь управлять отступами с помощью padding.

Часто задаваемые вопросы

Урок «Кнопки и нажатия» бесплатный?

Да — полный текст урока «Кнопки и нажатия» бесплатно доступен здесь в веб-версии. Чтобы практиковать его интерактивно (встроенный редактор кода и ИИ-репетитор 24/7) и разблокировать остальной курс Android Academy, подпишись на CoddyKit PRO. Курс Android Academy содержит 4 уроков всего.

Чему я научусь в уроке «Кнопки и нажатия»?

Добавляйте интерактивные кнопки. Ты практикуешь Android Academy с помощью реального кода, который запускаешь прямо в браузере, и ИИ-репетитор 24/7 отвечает на твои вопросы во время урока.

Нужен ли мне опыт, чтобы начать Android Academy?

Предыдущий опыт не требуется. Android Academy на CoddyKit структурирован для всех уровней — от новичков до продвинутых, поэтому ты можешь начать отсюда или с самого начала и учиться в своем темпе. Это урок 2 из 4.

Сколько времени занимает урок «Кнопки и нажатия»?

Большинство уроков CoddyKit занимают около 5–10 минут. Каждый из них компактный и интерактивный, поэтому ты постоянно делаешь прогресс и продолжаешь с того же места в веб-версии и приложении.

Можно ли писать и запускать код в этом уроке Android Academy?

Да. Каждый урок Android Academy включает встроенный редактор кода, поэтому ты пишешь и запускаешь реальный код прямо в браузере и получаешь моментальную обратную связь от AI — локальная установка не требуется.

Все уроки этого курса

  1. Стилизация текста
  2. Кнопки и нажатия
  3. Интервалы с помощью Padding
  4. Цвета и MaterialTheme
← Назад к Android Academy