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

Попробуйте способ создания композиций.

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>

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

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

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

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

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

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. Создайте три растровых изображения для фона кнопки, которые будут представлять состояния кнопки по умолчанию, при нажатии и в фокусе. Чтобы изображения подходили для кнопок разных размеров, создайте растровые изображения в виде девятичастных блоков.
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-файл с изображением в качестве фона кнопки:

   <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 .