Button Trong Android

Kiến thức lập trình ứng dụng, Website, PHP,  Java, HTML, CSS Trang chủ Lập trình Android - Java § 1 Android Studio - Ứng dụng đầu tiên § 2 Thành phần ứng dụng § 3 Vòng đời Activity § 4 Activity cơ bản § 5 Lưu và phục hồi trạng thái § 6 View, ViewGroup, Layout § 7 TextView § 8 Button § 9 CheckBox § 10 Switch / SwitchCompat § 11 ToggleButton § 12 RadioButton § 13 TextClock § 14 EditText § 15 ImageView / ImageButton § 16 FrameLayout § 17 LinearLayout § 18 ListView § 19 ConstraintLayout § 20 TableLayout § 21 RelativeLayout § 22 Drawable - shape § 23 BitmapDrawable § 24 VectorDrawable § 25 NinePatchDrawable § 26 LayerDrawable § 27 StateListDrawable § 28 ActionBar - Toolbar § 29 Snackbar § 30 FAB - FloatingActionButton § 31 RecylerView § 32 CoordinatorLayout 1 § 33 CoordinatorLayout 2 § 34 Broadcast Intent § 35 Theme Android (1) § 36 Theme Android (2) § 37 SQlite (1) § 38 SQlite (2) § 39 Màn hình Ngang - Dọc
  • Lập trình PHP
    • PSR
    • Laminas
    • SPL
    • Xenforo
    • Zend Framework
  • Lập trình ứng dụng iOS - Swift
  • Ruby
    • Sketchup
  • Lập trình Dart - Flutter
  • Lập trình C# (C Sharp)
    • Lập trình C# Cơ bản
  • Server
    • MySql Server
    • Windows
    • Apache
    • PHP
  • HTML
  • Javascript
    • JQuery
    • TypeScript - Angular
  • CSS
    • Sử dụng SASS / SCSS
    • Bootstrap - CSS Framework
  • SQL
    • SQL Server ( .NET Framework - C#)
    • MS Access
  • Java
    • Android Java
  • Thuật ngữ - Các vấn đề cơ bản
  • Tools
    • Git và GitHub
    • Kubernetes
    • Mathematica
    • SSH - Secure Shell
    • Grunt
    • Elasticsearch
    • Docker
    • macOS
    • English Study
  • Tin tức công nghệ
  • Tri thức & Khoa học
    • Yoga
  • Java
  • Android Java
TextView (Bài trước) (Bài tiếp) CheckBox Button trong Android

Sử dụng Button trong Android, thành phần biểu diễn nút bấm, bắt sự kiện click nên Button cũng như thiết lập màu nền, màu chữ, Drawable khi thay đổi trạng thái Button

Button trong Android

Button là một loại View, nó hiện thị nút bấm để chờ người dùng bấm vào. Button kế thừa từ TextView nên các thuộc tính, thiết lập cho TextView ở phần trước là có hiệu quả như đối với Button (Bạn nên đọc trước phần đó)

Cú pháp khai báo Button trong XML

<Button android:id="@+id/mybutton_id" android:layout_height="wrap_content" android:layout_width="wrap_content" android:text="Xin chào" />

Lấy Button và bắt sự kiện Click

Từ Activity hoặc từ đối tượng ViewGroup chứa Button, để lấy Button và bắt sự kiện khi người dùng bấm vào thì làm như sau:

final Button button = findViewById(R.id.mybutton_id); button.setOnClickListener(new View.OnClickListener() { public void onClick(View v) { //Muốn làm gì khi bấm vào Button thì //Viết code ở đây - Ví dụ: Toast.makeText(MainActivity.this, "Hello!", Toast.LENGTH_SHORT).show(); } });

Một số thuộc tính

Do Button mở rộng từ TextView nên nó có đầy đủ các thuộc tính của TextView như: android:text, android:textColor, android:textSize, android:textStyle, android:textAllCaps ... Ngoài các thuộc tính được kế thừa đó ra có một số thuộc tính cần lưu ý:

  • Gán Drawable vào các biên nút bấm

    Dùng các thuộc tính android:drawableLeft, android:drawableRight, android:drawableTop, android:drawableBottom để gán các ảnh Drawable vào biên trái, phải, trên, dưới của nút bấm. Nếu muốn thiết lập khoảng cách các ảnh Drawable đến vùng nội dung dùng thuộc tính android:drawablePaddingVí dụ có 2 drawable như sau:

    drawable/button_top_bottom.xml (vẽ một hình chữ nhật 15dp x 100 dp) <?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <size android:height="15dp" android:width="100dp" /> <solid android:color="#fdd109" /> </shape> drawable/button_left_right.xml (vẽ một hình tròn đường kính 30dp) <?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval"> <size android:height="30dp" android:width="30dp" /> <solid android:color="#800789" /> </shape>

    Áp dụng vào Button như sau:

    <Button android:id="@+id/mybutton_id" android:layout_height="wrap_content" android:layout_width="wrap_content" android:text="Xin chào" android:drawablePadding="10dp" android:drawableLeft="@drawable/button_left_right" android:drawableRight="@drawable/button_left_right" android:drawableTop="@drawable/button_top_bottom" android:drawableBottom="@drawable/button_top_bottom"/>
  • Không bo viền Button

    Mặc định các nút bấm có bo viền xung quanh và có các hiệu ứng khi bấm giữ, click vào. Nếu muốn Button không vẽ viền này nhưng vẫn thấy hiệu ứng khi nhấn vào thì thiết lập

    style="?android:attr/borderlessButtonStyle"
  • Tùy biến nền Button

    Màu nền

    Có thể gán màu nền cho Button bằng thuộc tính android:background, ví dụ:

    android:background="#edffac06"

    Cách thiết lập vào background giá trị màu theo HEX, theo giá trị màu như vậy thì nền đã thay đổi như mong muốn, tuy nhiên hiệu ứng khi nhấn, hiệu ứng khi Button đang focus bị mất.

    Nền Drawable / Ảnh Bitmap

    android:background cũng dùng để gán một Drawable cho Button, ví dụ có:

    drawable/button_oval_bg.xml (Drawable vẽ một hình oval) <?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval"> <size android:height="50dp" android:width="100dp" /> <solid android:color="#c22ace" /> </shape>

    Gán nó cho Button bằng: android:background="@drawable/button_oval_bg"

    Ảnh PNG 9-PATCH

    Nếu có các ảnh PNG đạng 9-patch (tạo ảnh 9-patch bằng các phần mềm vẽ ảnh như Photoshop, xem thêm 9-PATCH) ví dụ như:

    Bạn đưa vào dự án, và gán cho android:background, nó sẽ dựng nền theo dạng 9-patch (thu/phóng phần nội dung và các phần góc giữ nguyên)

    android:background="@drawable/ic_orange_button"

    Nền StateListDrawable

    Tùy loại phần tử View có nhận các trạng thái: activated, enabled, checked, selected, focused ...

    Với Button quan tâm đến ba trạng thái:

    • pressed khi nhấn vào nút
    • selected khi chọn nút
    • normal khi trạng thái bình thường
    • disabled khi nút bấm bị vô hiệu

    Ứng với mỗi trạng thái này, bạn có thể thiết lập một Drawable để Button vẽ khi ở trạng thái đó. Các trạng thái muốn gán Drawable thì định nghĩa vào một file XML theo cấu trúc:

    <?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item /> <item /> <!--...--> <item /> </selector>

    Với mỗi item định nghĩa ra một Drawable cho trạng thái muốn gán. Ví dụ, selector có 2 phần tử cho trạng thái bình thường và trạng thái khi nhấn

    <?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:state_pressed="true" android:drawable="@drawable/drawable_pressed"> <item android:drawable="@drawable/button_normal"> </selector>

    Trong code trên thì drawable_pressed và button_normal là 2 Drawable, android:state_pressed="true" cho biết item đó dành cho trạng thái khi pressed, item không thiết lập state đó là dành cho trạng thái normal.

    Ngay trong các item của selector cũng có thể viết XML Drawable mà không cần gán từ ngoài như thuộc tính android:drawable="@drawable/drawable_pressed" ở trên. Ví dụ sau sử dụng selector với 2 item, một dành cho ở trạng thái bình thường, một dành cho khi bấm, Drawable của item viết ngay trong item.

    drawable/button_3state.xml <?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:state_pressed="true" > <shape> <solid android:color="#ce3f1b" /> <stroke android:width="1dp" android:color="#ce0f0f" /> <corners android:radius="3dp" /> <padding android:left="10dp" android:top="10dp" android:right="10dp" android:bottom="10dp" /> </shape> </item> <item> <shape> <gradient android:startColor="#70c656" android:endColor="#53933f" android:angle="270" /> <stroke android:width="1dp" android:color="#53933f" /> <corners android:radius="4dp" /> <padding android:left="10dp" android:top="10dp" android:right="10dp" android:bottom="10dp" /> </shape> </item> </selector>

    Gán vào Button bằng

    android:background="@drawable/button_3state" Tải một số Button định nghĩa sẵn 3 trạng thái
  • Colored Button

    Mỗi Button có thể thiết lập màu nền nhanh chóng mà vẫn giữ khả năng vẽ ở nhiều trạng thái bằng cách thiết lập: android:backgroundTint để thiết lập màu nền, đồng thời thêm style="@style/Widget.AppCompat.Button.Colored"

    <Button android:id="@+id/mybutton_id" android:layout_height="wrap_content" android:layout_width="220dp" android:text="Xin chào" android:backgroundTint="#d50000" style="@style/Widget.AppCompat.Button.Colored" /> <Button android:layout_height="wrap_content" android:layout_width="220dp" android:text="Xin chào" android:backgroundTint="#9c27b0" style="@style/Widget.AppCompat.Button.Colored" /> <Button android:layout_height="wrap_content" android:layout_width="220dp" android:text="Xin chào" android:backgroundTint="#311b92" style="@style/Widget.AppCompat.Button.Colored" /> <Button android:layout_height="wrap_content" android:layout_width="220dp" android:text="Xin chào" android:backgroundTint="#00acc1" style="@style/Widget.AppCompat.Button.Colored" /> <Button android:layout_height="wrap_content" android:layout_width="220dp" android:text="Xin chào" android:backgroundTint="#00c853" style="@style/Widget.AppCompat.Button.Colored" /> <Button android:layout_height="wrap_content" android:layout_width="220dp" android:text="Xin chào" android:backgroundTint="#00c853" style="@style/Widget.AppCompat.Button.Colored" /> <Button android:layout_height="wrap_content" android:layout_width="220dp" android:text="Xin chào" android:backgroundTint="#ffd600" style="@style/Widget.AppCompat.Button.Colored" /> <Button android:layout_height="wrap_content" android:layout_width="220dp" android:text="Xin chào" android:backgroundTint="#000000" style="@style/Widget.AppCompat.Button.Colored" />
  • android:minHeight="0dp"android:minWidth="0dp" giảm kích thước của Button (loại bỏ khoảng giống padding của Button)

    android:maxLines="1" thiết lập Button chỉ hiện thị một dòng Text

Mục lục bài viết Button trong AndroidMột số thuộc tínhGán Drawable vào các biênMàu nềnNền Drawable, BitmapNền 9-PatchNền StateListDrawableSử dụng Colored ĐĂNG KÝ KÊNH, XEM CÁC VIDEO TRÊN XUANTHULAB Đăng ký nhận bài viết mới SQLite trong Android (phần 2) sử dụng SQLiteOpenHelper Sử dụng SQLite trong Android (phần 1) Sử dụng ListView hiện thị dữ liệu dạng danh sách trong Android Tạo và sử dụng Theme trong lập trình Android Thuộc tính style trong các View lập trình Android TextView trong lập trình Android hiện thị text, HTML, SpannableString Cơ bản về cách tạo và sử dụng Activity trong Android Hiểu về View, ViewGroup, Layout trong Android Lưu và phục hồi trạng thái của Activity trong Android Các thành phần của một ứng dụng Android TextView (Bài trước) (Bài tiếp) CheckBox Giới thiệuPrivacyTừ điển Anh - ViệtChạy SQLRegExpCubic-bezierUnix timestampKý tự HTMLcalories, chỉ số BMRchỉ số khối cơ thể BMITạo QR CodeLịch vạn niên Liên hệ RSS

Đây là blog cá nhân, tôi ghi chép và chia sẻ những gì tôi học được ở đây về kiến thức lập trình PHP, Java, JavaScript, Android, C# ... và các kiến thức công nghệ khác Developed by XuanThuLab

DMCA.com Protection Status

Từ khóa » đổi Màu Button Trong Html