|
Chào các bạn. Hôm nay mình sẽ giới thiệu 1 hiệu ứng mờ dần và rõ dần 1 đối tượng trên Android, hy vọng nó sẽ có ích cho các bạn trong việc thiết kế giao diện. Còn nhiều hiệu ứng nữa mình sẽ giới thiệu với các bạn sau, và giờ mình sẽ bắt đầu hướng dẫn cách viết code về hiệu ứng này: Cách 1: Bước 1: các bạn kéo vào 1 textView, 1 button. Bước 2: Khởi tạo biến toàn cục:
TextView tv;
Button btn; Bước 3: Các bạn vào hàm onCreate viết
btn = (Button) findViewById(R.id.btnXuLy);
tv = (TextView) findViewById(R.id.txv); Bây giờ chúng ta bắt đầu làm mờ dần và rõ dần textView:
btn.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { AlphaAnimation animation1 = new AlphaAnimation(0.0f, 1.0f);//0.0f là độ mờ cao nhất(không thấy gì cả), 1.0f là độ mờ nhỏ nhất(chữ bình thường) animation1.setDuration(5000);// thời gian chữ bị mờ 5000 = 5 giây animation1.setStartOffset(1000);// thời gian lặp lại(nếu có cho lặp) animation1.setRepeatCount(1);// Số lần lặp lại tv.startAnimation(animation1); }
}); Cách 2: Làm tương tự bước 1, bước 2 ở cách 1. Ở bước 2 ta thêm 1 biến toàn cục là:
Animation ht;
Bước 3: Tạo thư mục “anim” trong thư mục “res”. Trong thư mục vừa tạo tạo ra 1 file xml tên “alpha.xml” như sau:
<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
android:fromAlpha="1.0"
android:toAlpha="0"
android:duration="1500"
android:repeatCount="0"
>
<!-- dòng 3: độ mờ nhỏ nhất -->
<!-- dòng 4: độ mờ lớn nhất -->
<!-- -->
<!-- dòng 6: số lần lặp lại -->
</alpha>
Tiếp theo trong onCreate load file “alpha.xml” lên. Bắt sự kiện click nút và chạy bằng cách gọi hàm startAnimation.
ht = AnimationUtils.loadAnimation(this, R.anim.alpha_demo);
ht.setDuration(5000);// thời gian bị mờ
ht.setStartOffset(1000);// thời gian lặp lại
btn.setOnClickListener(new View.OnClickListener()
{
@Override
public void onClick(View v)
{
tv.startAnimation(ht);
}
});
Vậy là xong. Các bạn tải về Tại Đây Nút bao gồm văn bản hoặc biểu tượng (hoặc cả văn bản và biểu tượng) cho biết hành động sẽ xảy ra khi người dùng chạm vào nút. Tuỳ thuộc vào việc bạn muốn nút có văn bản, biểu tượng hay cả hai, bạn có thể tạo nút trong bố cục theo 3 cách sau:
- Bao gồm văn bản, hãy sử dụng lớp Button:
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/button_text"
... />
- Bao gồm biểu tượng, đang sử dụng lớp ImageButton:
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/button_icon"
android:contentDescription="@string/button_icon_desc"
... />
- Bao gồm cả văn bản và biểu tượng, hãy sử dụng lớp Button với thuộc tính android:drawableLeft:
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/button_text"
android:drawableLeft="@drawable/button_icon"
... />
Các lớp chính là các lớp sau: Phản hồi sự kiện nhấp Khi người dùng nhấp vào một nút, đối tượng Button sẽ nhận được một sự kiện khi nhấp. Để định nghĩa trình xử lý sự kiện nhấp cho một nút, hãy thêm thuộc tính android:onClick vào phần tử <Button> trong bố cục XML. Giá trị cho thuộc tính này phải là tên của phương thức mà bạn muốn gọi để phản hồi một sự kiện nhấp. Sau đó, Activity lưu trữ bố cục phải triển khai phương thức tương ứng. Sau đây là ví dụ về bố cục có nút sử dụng android:onClick: <?xml version="1.0" encoding="utf-8"?>
<Button xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/button_send"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/button_send"
android:onClick="sendMessage" />
Trong Activity lưu trữ bố cục này, phương thức sau sẽ xử lý
sự kiện nhấp:
/** Called when the user touches the button */
fun sendMessage(view: View) {
// Do something in response to button click
}
/** Called when the user touches the button */
public void sendMessage(View view) {
// Do something in response to button click
}
Phương thức bạn khai báo trong thuộc tính android:onClick phải có chữ ký chính xác như ở trên. Cụ thể, phương thức phải:
- Công khai
- Trả về kết quả void
- Xác định View là tham số duy nhất (View sẽ được nhấp)
Sử dụng OnClickListener Bạn cũng có thể khai báo trình xử lý sự kiện nhấp theo cách lập trình thay vì trong bố cục XML. Điều này có thể cần thiết nếu bạn tạo bản sao Button vào thời gian chạy hoặc cần khai báo hành vi nhấp chuột trong lớp con Fragment. Để khai báo trình xử lý sự kiện theo cách lập trình, hãy tạo đối tượng View.OnClickListener và gán đối tượng đó cho nút bằng cách gọi setOnClickListener(View.OnClickListener). Ví dụ:
val button: Button = findViewById(R.id.button_send)
button.setOnClickListener {
// Do something in response to button click
}
Button button = (Button) findViewById(R.id.button_send);
button.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
// Do something in response to button click
}
});
Tạo kiểu cho nút Hình thức của nút (hình nền và phông chữ) có thể khác nhau tuỳ theo thiết bị, vì các thiết bị của các nhà sản xuất khác nhau thường có các kiểu mặc định khác nhau để kiểm soát đầu vào. Bạn có thể kiểm soát chính xác cách các nút điều khiển được tạo kiểu bằng chủ đề mà bạn áp dụng cho toàn bộ ứng dụng. Ví dụ: để đảm bảo rằng tất cả thiết bị chạy Android 4.0 trở lên đều sử dụng chủ đề Holo trong ứng dụng, hãy khai báo android:theme="@android:style/Theme.Holo" trong phần tử <application> của tệp kê khai. Ngoài ra, hãy đọc bài đăng trên blog Holo Everywhere để biết thông tin về cách sử dụng chủ đề Holo trong khi hỗ trợ các thiết bị cũ. Để tuỳ chỉnh từng nút với nền khác nhau, hãy chỉ định thuộc tính android:background bằng đối tượng có thể vẽ hoặc tài nguyên màu.
Ngoài ra, bạn có thể áp dụng kiểu cho nút theo cách tương tự như các kiểu HTML để định nghĩa nhiều thuộc tính kiểu như nền, phông chữ, kích thước và các thuộc tính khác.
Để biết thêm thông tin về cách áp dụng kiểu, hãy xem Kiểu và Chủ đề. Nút không đường viền Một thiết kế có thể hữu ích là nút "không đường viền". Các nút không đường viền giống với các nút cơ bản, ngoại trừ việc các nút đó không có đường viền hoặc nền nhưng vẫn thay đổi hình thức trong các trạng thái khác nhau, chẳng hạn như khi người dùng nhấp vào. Để tạo nút không đường viền, hãy áp dụng kiểu borderlessButtonStyle cho nút đó. Ví dụ: <Button
android:id="@+id/button_send"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/button_send"
android:onClick="sendMessage"
style="?android:attr/borderlessButtonStyle" />
Nền tuỳ chỉnh Nếu muốn định nghĩa lại hình thức của nút, bạn có thể chỉ định nền tuỳ chỉnh. Tuy nhiên, thay vì phải cung cấp một bitmap hoặc màu đơn giản, nền phải là tài nguyên danh sách trạng thái mà thay đổi hình thức tuỳ thuộc vào trạng thái hiện tại của nút. Bạn có thể định nghĩa danh sách trạng thái trong tệp XML. Tệp này định nghĩa ba hình ảnh hoặc màu sắc khác nhau để sử dụng cho các trạng thái nút khác nhau. Để tạo danh sách trạng thái có thể vẽ cho nền của nút, hãy làm như sau: - Tạo 3 bitmap cho nền của nút đại diện cho các trạng thái nút như mặc định, được nhấn và tâm điểm.
Để đảm bảo rằng hình ảnh của bạn phù hợp với các nút có kích thước khác nhau, hãy tạo các bitmap dưới dạng bitmap 9-patch. - Đặt bitmap vào thư mục res/drawable/ của dự án. Hãy chắc chắn rằng mỗi bitmap được đặt tên chính xác để phản ánh đúng trạng thái nút mà mỗi bitmap biểu thị, ví dụ như button_default.9.png, button_pressed.9.png và button_focused.9.png.
- Tạo một tệp XML mới trong thư mục res/drawable/ (đặt tên giống như
button_custom.xml). Chèn XML sau:
<?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>
Hành động này định nghĩa một tài nguyên có thể vẽ duy nhất mà sẽ thay đổi hình ảnh của tài nguyên đó dựa trên trạng thái hiện tại của nút.
- <item> đầu tiên định nghĩa bitmap cần sử dụng khi người dùng nhấn nút (kích hoạt).
- <item> thứ hai định nghĩa bitmap cần sử dụng khi nút được làm tâm điểm (khi nút này được làm nổi bật bằng cách sử dụng bi xoay hoặc bàn phím di chuyển).
- <item> thứ ba định nghĩa bitmap cần sử dụng khi nút ở trạng thái mặc định (không nhấn và cũng không lấy làm tâm điểm).
Lưu ý: Thứ tự của các phần tử <item> là rất quan trọng. Khi tham chiếu đối tượng có thể vẽ này, các phần tử <item> sẽ được đọc theo thứ tự để xác định phần tử nào phù hợp với trạng thái nút hiện tại. Vì bitmap mặc định được đặt ở cuối cùng, nên bitmap này chỉ được áp dụng khi cả hai điều kiện android:state_pressed và
android:state_focused đều được đánh giá là sai. Giờ đây, tệp XML này biểu thị cho một tài nguyên có thể vẽ duy nhất và khi Button tham chiếu đến để lấy nền thích hợp, hình ảnh hiển thị sẽ thay đổi dựa trên ba trạng thái này.
- Sau đó, chỉ cần áp dụng tệp XML có thể vẽ làm nền của nút như sau:
<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" />
Để biết thêm thông tin về cú pháp XML này, bao gồm cách định nghĩa trạng thái vô hiệu hoá, di chuột hoặc trạng thái nút khác, hãy đọc về Danh sách trạng thái có thể vẽ.
| 
