Đường cong nới lỏng tiêu chuẩn thiết kế vật liệu
Thiết kế hàm định thời CSS cub-bezier() tùy chỉnh bằng cách kéo hai điểm điều khiển, xem trước trực tiếp dựa trên tham chiếu tuyến tính, sau đó sao chép giá trị sẵn sàng.
kết quả
Trang này mở trình tạo với x1=0,4, y1=0, x2=0,2, y2=1 đã được tải - đường cong nới lỏng tiêu chuẩn được công bố trong nguyên tắc chuyển động Thiết kế Vật liệu của Google. Kéo tay cầm hoặc chỉnh sửa các số và đường cong, bản xem trước trực tiếp và bản cập nhật CSS có thể sao chép cùng nhau.
Material Design gọi đường cong này là "nới lỏng tiêu chuẩn" và đề xuất nó cho hầu hết các chuyển đổi trên màn hình — các phần tử đã hiển thị và chỉ cần di chuyển, thay đổi kích thước hoặc mờ dần trong cùng một màn hình. Hình dạng của nó tăng tốc nhanh chóng, sau đó giảm tốc nhẹ nhàng vào đúng vị trí, đó là lý do tại sao rất nhiều ứng dụng Android và giao diện người dùng web theo kiểu Material có cùng cảm giác chuyển đổi mà không ai nhận ra rằng họ đang sử dụng bốn số giống nhau.
Thả thẳng vào chức năng chuyển tiếp thời gian hoặc chức năng định thời gian hoạt ảnh để có cảm giác nhất quán với Material hoặc sử dụng nó làm điểm tham chiếu: Nguyên tắc của Material cũng xác định các đường cong "giảm tốc" và "tăng tốc" riêng biệt cho các thành phần đi vào hoặc rời khỏi màn hình mà đường cong tiêu chuẩn duy nhất này không nhằm mục đích thay thế.