Nút hành động nổi: Khi nào nên sử dụng FAB và cách tạo hiệu ứng cho nó

FAB dùng để làm gì

Material Design 3 mô tả FAB là hành động chính của màn hình và khuyên không nên hiển thị nhiều FAB trên một màn hình. Nó cũng lưu ý rằng FAB không cần thiết trên mọi màn hình, chẳng hạn như khi hình ảnh đã thể hiện các hành động chính.

Biến thể

Vật liệu cung cấp một số hình thức:

• FAB tiêu chuẩn: biểu tượng cho một hành động phổ biến như soạn thư.
• FAB mở rộng: biểu tượng cộng với nhãn, rõ ràng hơn cho các hành động ít rõ ràng hơn và trên màn hình lớn hơn.
• FAB lớn: dành cho các hoạt động chính nổi bật, phù hợp với cửa sổ rộng hơn như máy tính bảng và thiết bị có thể gập lại.
• Menu FAB: FAB mở một tập hợp ngắn các hành động liên quan.

Khi nào không nên sử dụng một

Bỏ qua FAB đối với các hành động nhỏ hoặc mang tính phá hoại, trên các màn hình nơi hành động chính đã rõ ràng và nơi hành động đó bao gồm nội dung hoặc điều khiển quan trọng. Trên iOS, FAB không phải là mẫu gốc; các nút thanh công cụ hoặc thanh điều hướng quen thuộc hơn với người dùng iPhone.

Cử động

FAB thường thu gọn từ mở rộng sang tiêu chuẩn khi mọi người cuộn, sau đó mở rộng trở lại và có thể chuyển đổi thành một trang tính hoặc menu khi nhấn vào. Những chuyển đổi này giải thích hành động đã diễn ra ở đâu và nội dung của nó đến từ đâu. Giữ chúng ngắn gọn, tránh nảy trên mỗi cuộn và tôn trọng chuyển động giảm.