Добавьте кнопки в приложение

Попробуйте Compose
Jetpack Compose – это рекомендуемый набор инструментов для создания пользовательского интерфейса в Android. Узнайте, как добавлять компоненты в Compose.

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

Вы можете создать кнопку в макете одним из трех способов, в зависимости от того, хотите ли вы кнопку с текстом, значком или и тем, и другим:

  
  <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
      xmlns:app="http://schemas.android.com/apk/res-auto"
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      android:paddingLeft="16dp"
      android:paddingRight="16dp"
      android:orientation="vertical" >
  
      <Button
          android:id="@+id/supabutton"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:text="I'm a button" />
  
      <ImageButton
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:contentDescription="A tiny Android icon"
          android:src="@drawable/baseline_android_24"
          app:tint="#ff0000" />
  
      <Button
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:drawableStart="@drawable/baseline_android_24"
          android:drawablePadding="4dp"
          android:drawableTint="#ff0000"
          android:text="I'm a button with an icon" />
  </LinearLayout>

Приведенный выше код генерирует примерно следующее:

Изображение, показывающее три типа кнопок
Рисунок 1. Три стиля кнопок.

Реагирование на события кликов

Когда пользователь нажимает кнопку, объект Button получает событие нажатия.

Чтобы объявить обработчик событий программно, создайте объект View.OnClickListener и назначьте его кнопке, вызвав метод setOnClickListener(View.OnClickListener), как показано в следующем примере:

Kotlin

findViewById<Button>(R.id.supabutton)
  .setOnClickListener {
      Log.d("BUTTONS", "User tapped the Supabutton")
  }

Java

Button button = (Button) findViewById(R.id.supabutton);
button.setOnClickListener(new View.OnClickListener() {
    public void onClick(View v) {
      Log.d("BUTTONS", "User tapped the Supabutton");
    }
});

Настройка внешнего вида кнопки

Внешний вид кнопки (фоновое изображение и шрифт) зависит от устройства, поскольку у разных производителей могут быть разные стили по умолчанию для элементов управления вводом.

Чтобы настроить отдельные кнопки с другим фоном, укажите атрибут android:background с ресурсом drawable или color. Вы также можете применить к кнопке стиль, который работает аналогично стилям HTML и позволяет задать несколько свойств, таких как фон, шрифт и размер. Подробнее о применении стилей…

Кнопка без рамки

Один из вариантов дизайна, который может быть полезен, – это кнопка без рамки. Кнопки без границ похожи на обычные кнопки, за исключением того, что у них нет границ или фона, но они все равно меняют внешний вид в разных состояниях, например, при нажатии.

Чтобы создать кнопку без границ, примените к ней стиль borderlessButtonStyle, как показано в следующем примере:

<Button
  android:id="@+id/supabutton"
  style="?android:attr/borderlessButtonStyle"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:text="I'm a button" />

Свой фон

Если вы хотите полностью изменить внешний вид кнопки, вы можете задать собственный фон. Однако вместо простого растрового изображения или цвета фон должен быть ресурсом списка состояний, который меняет внешний вид в зависимости от текущего состояния кнопки.

Вы можете определить список состояний в XML-файле, который определяет три изображения или цвета, которые будут использоваться для разных состояний кнопки.

Чтобы создать список состояний для фона кнопки, выполните следующие действия:

  1. Создайте три растровых изображения для фона кнопки, которые представляют состояния по умолчанию, нажатия и фокуса. Чтобы изображения подходили для кнопок разных размеров, создайте их в формате Nine-patch.
  2. Поместите растровые изображения в каталог res/drawable/ проекта. Назовите каждую битовую карту в соответствии с состоянием кнопки, которое она представляет, например button_default.9.png, button_pressed.9.png и button_focused.9.png.
  3. Создайте новый XML-файл в каталоге res/drawable/. Например, можно назвать его button_custom.xml. Вставьте XML-код, как показано ниже.
    <?xml version="1.0" encoding="utf-8"?>
    <selector xmlns:android="http://schemas.android.com/apk/res/android">
        <item android:drawable="@drawable/button_pressed"
              android:state_pressed="true" />
        <item android:drawable="@drawable/button_focused"
              android:state_focused="true" />
        <item android:drawable="@drawable/button_default" />
    </selector>

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

    • Первый элемент <item> определяет растровое изображение, которое будет использоваться при нажатии (активации) кнопки.
    • Второй элемент <item> определяет битовую карту, которая будет использоваться, когда кнопка находится в фокусе, например когда она выделена с помощью трекбола или крестовины.
    • Третий элемент <item> определяет битовую карту, которая будет использоваться, когда кнопка находится в состоянии по умолчанию (не нажата и не выбрана).

    Этот XML-файл представляет один прорисовываемый ресурс. Если этот ресурс используется в качестве фона для Button, то изображение меняется в зависимости от состояния кнопки.

  4. Примените XML-файл drawable в качестве фона кнопки:
    <Button
        android:id="@+id/button_send"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/button_send"
        android:onClick="sendMessage"
        android:background="@drawable/button_custom"  />

Дополнительную информацию о синтаксисе XML, в том числе о том, как определить кнопку, которая отключена, на которую наведен указатель мыши или которая находится в другом состоянии, можно найти в статье StateListDrawable.