Thao tác cuộn được chia thành nhiều giai đoạn. Delta đầu vào được gửi qua một chuỗi các giai đoạn để đảm bảo mỗi giai đoạn đều có cơ hội sử dụng hoặc phản ứng với chuyển động.
Trong suốt chu kỳ này, cả delta đầu vào có sẵn và delta đầu vào đã sử dụng đều được truyền đi ở mọi bước. Điều này cung cấp cho mỗi giai đoạn ngữ cảnh hoàn chỉnh cần thiết để phản ứng, sử dụng hoặc lắng nghe sự kiện cuộn.
Như minh hoạ trong Hình 1, quy trình cuộn tuân theo đúng thứ tự này:
- Overscroll: Nhận delta đầu vào ban đầu trước, điều này cho phép overscroll có cơ hội phản ứng trước (ví dụ: bằng cách nới lỏng hiệu ứng kéo giãn đang hoạt động).
- Cuộn lồng trước khi cuộn: Tạo cơ hội phản ứng với delta đầu vào trước giai đoạn Cuộn. Trong giai đoạn này, một số delta đầu vào có thể được sử dụng hoặc chỉ được theo dõi để kích hoạt các thay đổi về giao diện người dùng, chẳng hạn như thu gọn hoặc mở rộng thanh ứng dụng.
- Biến đổi mức thay đổi đầu vào: Điều chỉnh dấu của mức thay đổi đầu vào thô dựa trên hướng và chiều của bố cục để đảm bảo hành vi cuộn tự nhiên. Để biết thêm thông tin, hãy xem phần Biến đổi mức chênh lệch đầu vào.
- Cuộn: Giai đoạn này nhận được delta đầu vào có sẵn, chưa được sử dụng, được điều chỉnh để phù hợp với cấu hình vùng chứa cuộn. Thường thì thành phần này sẽ dùng mức chênh lệch này để cập nhật mức chênh lệch cuộn của chính nó.
- Quay lại mức thay đổi đầu vào thô: Quay lại mức thay đổi có sẵn và đã dùng từ giai đoạn Scroll (Cuộn) về dấu mức thay đổi đầu vào thô ban đầu.
- Nested scroll post-scroll:Giai đoạn này phản ứng sau khi giai đoạn cuộn chính hoàn tất, nhận được các delta đã dùng và delta có sẵn mới cập nhật. Thao tác này có thể sử dụng mọi dữ liệu đầu vào còn lại có sẵn hoặc sử dụng bối cảnh của dữ liệu vừa được sử dụng.
- Overscroll (Cuộn quá mức): Giai đoạn cuối cùng này xem xét các mức chênh lệch cuối cùng có sẵn và đã dùng. Mọi dữ liệu đầu vào còn lại có sẵn ở giai đoạn này thường được dùng để tạo hiệu ứng cạnh, chẳng hạn như hiệu ứng kéo giãn hoặc phát sáng, cho biết rằng người dùng đã đạt đến ranh giới của vùng có thể cuộn.
Biến đổi delta đầu vào
Độ lệch đầu vào của con trỏ yêu cầu điều chỉnh dấu trong các giai đoạn cuộn để khớp với các hợp đồng dự kiến. Trước khi delta đạt đến giai đoạn Scroll (Cuộn), các đối tượng sửa đổi thao tác cuộn sẽ điều chỉnh delta đầu vào dựa trên hướng, hướng bố cục và ngữ cảnh RTL. Điều này xảy ra vì dữ liệu đầu vào thô theo dõi chuyển động của pixel thực của con trỏ trên màn hình (ví dụ: di chuyển xuống sẽ làm tăng toạ độ Y của màn hình, tạo ra một delta dương). Tuy nhiên, để đạt được hiệu ứng "cuộn tự nhiên" (nội dung di chuyển theo ngón tay của bạn), việc kéo xuống có nghĩa là khung hiển thị phải dịch chuyển lên trên nội dung, tương ứng với độ lệch cuộn âm.
Các delta đầu vào từ các nguồn đầu vào khác, chẳng hạn như bánh xe chuột hoặc bàn di chuột, sẽ không được chuyển đổi trong các giai đoạn cuộn.
Ví dụ: Con trỏ di chuyển sang phải bằng Modifier.horizontalScroll()
Để hiểu cách sử dụng và chuyển đổi các giá trị delta, hãy xem Hình 2, trong đó ánh xạ một cử chỉ mà con trỏ di chuyển sang phải.
- Trước khi cuộn: Cử chỉ bắt đầu bằng mức chênh lệch đầu vào thô dương là 100.
- Overscroll quan sát và sử dụng 10, còn lại 90.
- Thao tác cuộn lồng trước khi cuộn cho phép thành phần mẹ phản ứng, tiêu thụ 30. Số chênh lệch thô còn lại là 60.
- Biến đổi A: Trước khi chuyển sang giai đoạn Cuộn,
horizontalScrollđảo ngược phần còn lại của delta thô dương (60) thành delta âm (-60). Điều này đảm bảo khung hiển thị dịch chuyển sang trái để nội dung xuất hiện khi di chuyển sang phải bằng ngón tay của người dùng. - Cuộn: Thành phần có thể cuộn mục tiêu sử dụng một phần của độ lệch đã chuyển đổi này để cập nhật độ lệch cuộn. Trong ví dụ này, nó tiêu thụ -30, còn lại -30 chưa tiêu thụ.
- Phép biến đổi B: Giá trị delta cuộn chưa dùng (-30) được chuyển đổi trở lại thành giá trị delta thô dương (30) để khớp với hợp đồng cuộn lồng nhau và cuộn quá mức.
- Sau khi cuộn: Phần chênh lệch thô còn lại được truyền ngược lên quy trình.
- Nested scroll post-scroll sử dụng 10, còn lại 20.
- Hiệu ứng cuộn quá mức sử dụng 20 cuối cùng để tạo hiệu ứng cạnh trực quan, chẳng hạn như hiệu ứng kéo giãn hoặc phát sáng, giải quyết hoàn toàn delta đầu vào thành 0.
Tham chiếu phép biến đổi delta của dữ liệu đầu vào bằng con trỏ
Bảng sau đây trình bày cách các giá trị delta đầu vào được ký trên các giai đoạn và hướng khác nhau cho dữ liệu đầu vào bằng con trỏ.
| Delta đầu vào thô | Hiệu ứng cuộn quá mức | Cuộn dạng lồng | scrollableArea theo hướng ngang |
scrollableArea theo hướng ngang (đảo ngược) |
scrollableArea có hướng dọc |
scrollableArea theo hướng dọc (đảo ngược) |
|
|---|---|---|---|---|---|---|---|
| Con trỏ di chuyển LÊN | Tiêu cực | Tiêu cực | Tiêu cực | Không áp dụng | Không áp dụng | Tích cực | Tiêu cực |
| Con trỏ di chuyển XUỐNG | Tích cực | Tích cực | Tích cực | Không áp dụng | Không áp dụng | Tiêu cực | Tích cực |
| Con trỏ di chuyển sang TRÁI | Tiêu cực | Tiêu cực | Tiêu cực | Dương tính (Âm tính đối với RTL) | Âm (Dương đối với RTL) | Không áp dụng | Không áp dụng |
| Con trỏ di chuyển SANG PHẢI | Tích cực | Tích cực | Tích cực | Âm (Dương đối với RTL) | Dương tính (Âm tính đối với RTL) | Không áp dụng | Không áp dụng |