Custom Toast trong Android

kim

Thành viên VIP
Staff member


Ý tưởng thì mình lấy từ tấm hình trên, chẳng biết có phải ăn cắp bản quyền không nữa, thôi cứ credit lại cho chắc (http://codecanyon.net/item/android-custom-toast/926057)

Khi làm việc với Androi chắc hẳn ai cũng tiếp xúc với một lớp có tên là Toast. Lớp này cho phép hiển thị một thông báo dạng popup trong một khoảng thời gian nhất định nào đó!
Chi tiết tại đây: More info...
Nhưng nếu hiển thị như mặc định thì có vẻ còn hơi đơn điệu, vì thế chúng ta sẽ tự tạo Toast mang một phong cách riêng (còn gọi là Custom Toast).

Thực hiện
Bước 1: Tạo một Project mới.
Bước 2: Trên Layout của Project, mình tạo một Button.
Bước 3: Mình viết sự kiện click cho Button dùng để hiện thị Toast trong MainActivity.
Bước 4: Mình sẽ tạo Resource cho Layout Toast. (chi tiết như bên dưới)
Tại thư mục res mình tạo thêm một thư mục khác có tên là Drawable, sau đó mình tạo một file *.xml dạng shape. (mục đích dùng để thiết lập mã màu background và border cho Layout Toast sau này). Sau đó mình cũng bỏ một tấm hình thư mục đó (Link hình)


Nội dung file mborder_green.xml:
PHP:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
    <padding
        android:left="5dp"
        android:top="5dp"
        android:right="5dp"
        android:bottom="5dp" />
    <solid android:color="#E3FFDB"/>
    <stroke android:color="#7FFF00" android:width="1dp"/>
    <corners android:radius="5dp" />
</shape>
Trong nội dung của file *.xml mình có chú đánh số các thuộc tính mà mình thêm vào, ý nghĩa của chúng như sau:
1. Xác định khoảng cách nội dung thành phần bên trong so với biên.
2. Xác định màu nền.
3. Xác định màu và độ rộng đường biên.
4. Xác định độ tròn khi bo góc.

Bước 5: Mình tạo Layout cho Toast bằng cách thêm một Layout nữa vào thư mục /layout và xác định tài nguyên mà mình đã định nghĩa từ trước.


Nội dung toàn bộ file mcustom_toast_green.xml:
PHP:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/mborder_green"
    android:orientation="horizontal" >
<ImageView
    android:layout_width="37dp"
    android:layout_height="37dp"
    android:layout_gravity="center"
    android:src="@drawable/tick" />

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center_vertical"
    android:text="Login successful message" />

</LinearLayout>
Bước 6: Quay trở lại MainActivity, mình sẽ dùng lớp LayoutInflater để định nghĩa giao diện cho đối tượng View, và sử dụng chính đối tượng view này để xây dựng Custom Toast, minh họa đoạn code dưới:
PHP:
public class CustomToast extends Activity {

    private View mButton;
    private Toast mToast;

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_custom_toast);
        mButton = (findViewById(R.id.button1));
        mButton.setOnClickListener(new OnClickListener() {

            @Override
            public void onClick(View v) {
                // TODO Auto-generated method stub
                mToast.show();
            }
        });

        LayoutInflater inflater = getLayoutInflater();
        View mToastView = inflater.inflate(R.layout.mcustom_toast_green, null);

        mToast = new Toast(this);
        mToast.setView(mToastView);
    }
}
Kết quả:


Mình còn bổ sung thêm 3 Custom Toast như hình dưới, bạn có thể tham khảo cuối bài viết:


Download ProJect

Special thanks
 
  • Like
Reactions: gorkiit and rfabbc

rfabbc

New Member
20/2/13
15
0
1
40
tks bạn về bài viết rất hữu ích.

nhờ bạn hướng dẫn cách chạy project này:

có cần phải copy nó vào thư mục \workspace hay để nó ở đâu cung đc rồi mở bằng Eclipse hay ntnao vậy bạn?
 

vtcNew

Active Member
8/10/11
252
60
28
- Bạn để đâu cũng được
- Nhìn lên thanh công cụ của Eclispe . Chọn File / Import / Existing project into workspace / ....
 
  • Like
Reactions: rfabbc

rfabbc

New Member
20/2/13
15
0
1
40
Tks bạn. MÌnh hỏi vậy vì cái Eclipse này rất khó chịu, hôm bữa mình edit 1 project, trc khi edit thì mình cẩn thận copy toàn bộ thư mục để lưu lại, sau khi edit tùm lum thì mình muốn khôi phục lại cái ban đầu bằng cách copy cái đã backup ghi đè lên cái đã edit. Tưởng đơn giản vậy mà nó báo lỗi mất đồng bộ gì đấy, hoảng luôn.