Dodaj przyciski do aplikacji

Wypróbuj tworzenie wiadomości
Jetpack Compose to zalecany zestaw narzędzi UI na Androida. Dowiedz się, jak dodawać komponenty w sekcji Tworzenie.
Button →

Przycisk składa się z tekstu lub ikony albo z obu tych elementów i informuje o działaniu, które nastąpi, gdy użytkownik go kliknie.

Możesz utworzyć przycisk w swoim szablonie na 3 sposoby, w zależności od tego, czy chcesz użyć przycisku z tekstem, ikoną czy z obu elementami:

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

Poprzedni kod wygeneruje coś takiego:

Ilustracja przedstawiająca 3 typy przycisków
Rysunek 1. 3 style przycisków.

Odpowiadanie na zdarzenia kliknięcia

Gdy użytkownik kliknie przycisk, obiekt Button otrzyma zdarzenie kliknięcia.

Aby zadeklarować moduł obsługi zdarzeń programowo, utwórz obiekt View.OnClickListener i przypisz go do przycisku, wywołując funkcję setOnClickListener(View.OnClickListener), jak w tym przykładzie:

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");
    }
});

Nadawanie stylu przyciskowi

Wygląd przycisku (obraz tła i czcionka) różni się w zależności od urządzenia, ponieważ urządzenia różnych producentów często mają różne style domyślne elementów sterujących.

Aby dostosować poszczególne przyciski za pomocą innego tła, określ atrybut android:background za pomocą zasobu rysowanego lub zasobu koloru. Możesz też zastosować styl przycisku, który działa podobnie do stylów HTML i służy do definiowania wielu właściwości stylów, takich jak tło, czcionka i rozmiar. Więcej informacji o stosowaniu stylów znajdziesz w artykule Style i motywy.

Przycisk bez obramowania

Jednym z przydatnych projektów jest przycisk bez obramowania. Przyciski bez obramowania przypominają podstawowe przyciski, ale nie mają obramowania ani tła, ale wciąż zmieniają wygląd w różnych stanach, np. po dotknięciu.

Aby utworzyć przycisk bez obramowania, zastosuj do niego styl borderlessButtonStyle, jak w tym przykładzie:

<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" />

Tło niestandardowe

Jeśli chcesz całkowicie zmienić wygląd przycisku, możesz ustawić niestandardowe tło. Zamiast prostej mapy bitowej lub koloru musisz jednak podać tło jako zasób listy stanów, które zmienia wygląd w zależności od bieżącego stanu przycisku.

Listę stanów możesz zdefiniować w pliku XML, który zawiera 3 obrazy lub kolory do użycia w różnych stanach przycisku.

Aby utworzyć listę stanów do rysowania na potrzeby tła przycisku, wykonaj te czynności:

  1. Utwórz 3 bitmapy tła przycisku, które reprezentują stany przycisku domyślny, dotknięty i wybrane. Aby mieć pewność, że obrazy pasują do przycisków o różnych rozmiarach, utwórz mapy bitowe w postaci map bitowych dziewięciu poprawek.
  2. Umieść bitmapy w katalogu res/drawable/ projektu. Nazwij każdą bitmapę tak, aby odzwierciedlała stan przycisku, np. button_default.9.png, button_pressed.9.png i button_focused.9.png.
  3. Utwórz nowy plik XML w katalogu res/drawable/. Nazwij go na przykład button_custom.xml. Wstaw kod XML w ten sposób: 
    <?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>

    Określa on pojedynczy zasób rysowalny, który zmienia obraz w zależności od bieżącego stanu przycisku.

    • Pierwszy element <item> określa bitmapę używaną po kliknięciu przycisku (aktywacji).
    • Drugi parametr <item> definiuje bitmapę, której należy użyć, gdy przycisk jest zaznaczony, np. gdy jest wyróżniony za pomocą trackballa lub pada kierunkowego.
    • Trzeci element <item> określa bitmapę, która ma być używana, gdy przycisk będzie w domyślnym stanie, bez kliknięcia ani zaznaczenia.

    Ten plik XML reprezentuje pojedynczy zasób rysowalny. Gdy odwołanie do niego jest używane przez element Button do wyświetlania tła, obraz zmienia się w zależności od stanu przycisku.

  4. Zastosuj plik XML drawable jako tło przycisku: 
    <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"  />

Więcej informacji o tej składni XML, w tym instrukcje definiowania przycisku, który jest wyłączony, najechany lub w innym stanie, znajdziesz w sekcji StateListDrawable.