Hướng dẫn và ví dụ Android ImageButton

Xem thêm các chuyên mục:

Các hướng dẫn lập trình Android

Android ImageButton
ImageButton Styles
ImageButton Event

Hãy theo dõi chúng tôi trên Fanpage để nhận được thông báo mỗi khi có bài viết mới.

Facebook

1- Android ImageButton

Trong Android, ImageButton là một điều khiển giao diện người dùng (User interface control), nó hiển thị như một button với hình ảnh, và cho phép người dùng nhấp (click) vào để thực hiện một hành động.

ImageButton là một lớp con của ImageView, vì vậy bạn có thể sét đặt Icon cho nó thông qua thuộc tính app:srcCompat. Chú ý, khác với Button, bạn không thể hiển thị một văn bản trên ImageButton.


<ImageButton
    android:id="@+id/imageButton"
    app:srcCompat="@drawable/icon_feel_good"
    ... />

Có một vài loại button khác mà bạn có thể tham khảo thêm trong các bài viết dưới đây:

Android Button

Android ToggleButton

Android RadioButton

Với mã Java, có một vài phương thức giúp bạn sét đặt Icon cho ImageButton, tất cả các phương thức này đều được thừa kế từ ImageView.

setImageBitmap(Bitmap bitmap)
setImageDrawable(Drawable drawable)
setImageIcon(Icon icon)
setImageResource(int resId)
setImageURI(Uri uri)

Android ImageView

2- ImageButton Styles

Thuộc tính style là một tùy chọn của ImageButton, nó cho phép bạn sét đặt kiểu dáng cho ImageButton. Có một vài kiểu dáng sẵn có trong thư viện của Android mà bạn có thể sẵn sàng sử dụng.


<ImageButton
    android:id="@+id/imageButton"
    style="@android:style/Widget.Holo.ImageButton"
    app:srcCompat="@drawable/icon_feel_good"
    ... />

style="@style/Widget.AppCompat.ImageButton"
style="@android:style/Widget.Holo.ImageButton"
style="@android:style/Widget.ImageButton"


<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <TextView
        android:id="@+id/textView11"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginLeft="16dp"
        android:layout_marginTop="16dp"
        android:layout_marginEnd="16dp"
        android:layout_marginRight="16dp"
        android:text="Widget.AppCompat.ImageButton (Default)"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <ImageButton
        android:id="@+id/imageButton11"
        style="@style/Widget.AppCompat.ImageButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginLeft="16dp"
        android:layout_marginTop="8dp"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/textView11"
        app:srcCompat="@drawable/icon_feel_good" />

    <TextView
        android:id="@+id/textView12"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginLeft="16dp"
        android:layout_marginTop="16dp"
        android:layout_marginEnd="16dp"
        android:layout_marginRight="16dp"
        android:text="Widget.Holo.ImageButton"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/imageButton11" />

    <ImageButton
        android:id="@+id/imageButton12"
        style="@android:style/Widget.Holo.ImageButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginLeft="16dp"
        android:layout_marginTop="8dp"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/textView12"
        app:srcCompat="@drawable/icon_feel_good" />

    <TextView
        android:id="@+id/textView13"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginLeft="16dp"
        android:layout_marginTop="16dp"
        android:layout_marginEnd="16dp"
        android:layout_marginRight="16dp"
        android:text="Widget.ImageButton"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="1.0"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/imageButton12" />

    <ImageButton
        android:id="@+id/imageButton13"
        style="@android:style/Widget.ImageButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginLeft="16dp"
        android:layout_marginTop="8dp"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/textView13"
        app:srcCompat="@drawable/icon_feel_good" />

</androidx.constraintlayout.widget.ConstraintLayout>

3- ImageButton Event

Về cơ bản ImageButton và Button đều có các sự kiện giống nhau, bạn có thể tham khảo bài viết về Button để tìm hiểu về các sự kiện này.

Android Button

Các sự kiện của ImageButton, Button:

button.setOnTouchListener(View.OnTouchListener)
button.setOnClickListener(View.OnClickListener)
button.setOnLongClickListener(View.OnLongClickListener)
button.setOnContextClickListener(View.OnContextClickListener);
...

Xem thêm các chuyên mục:

Các hướng dẫn lập trình Android