Memahami fase scroll

Men-scroll dibagi menjadi beberapa fase. Delta input dikirim melalui urutan fase untuk memastikan setiap fase memiliki kesempatan untuk menggunakan atau bereaksi terhadap gerakan.

Sepanjang siklus ini, delta input yang tersedia dan delta input yang digunakan diteruskan di setiap langkah. Hal ini memberikan konteks lengkap yang diperlukan setiap fase untuk bereaksi, menggunakan, atau memproses peristiwa scroll.

Seperti yang diilustrasikan dalam Gambar 1, proses scroll mengikuti urutan berikut:

1. Overscroll: Menerima delta input awal terlebih dahulu, yang memberi overscroll kesempatan untuk bereaksi terlebih dahulu (misalnya, dengan merelaksasi efek peregangan aktif).
2. Pra-scroll scroll bertingkat: Memberikan kesempatan untuk bereaksi terhadap delta input sebelum fase Scroll. Pada fase ini, beberapa delta input mungkin digunakan, atau mungkin hanya dipantau untuk memicu perubahan UI, seperti menciutkan atau meluaskan panel aplikasi.
3. Mengubah delta input: Menyesuaikan tanda delta input mentah berdasarkan orientasi dan arah tata letak untuk memastikan perilaku scroll yang alami. Untuk mengetahui informasi selengkapnya, lihat bagian Mengubah delta input.
4. Scroll: Fase ini menerima delta input yang tersedia dan tidak digunakan, yang disesuaikan agar cocok dengan konfigurasi penampung scroll. Biasanya, komponen ini menggunakan delta ini untuk memperbarui offset scroll-nya sendiri.
5. Kembalikan ke delta input mentah: Mengembalikan delta yang tersedia dan digunakan dari fase Scroll ke tanda delta input mentah asli.
6. Scroll bertingkat pasca-scroll: Fase ini bereaksi setelah fase scroll utama selesai, menerima delta yang tersedia dan digunakan yang baru diperbarui. Model ini dapat menggunakan input yang tersisa, atau menggunakan konteks dari apa yang baru saja digunakan.
7. Overscroll: Fase terakhir ini melihat delta akhir yang tersedia dan digunakan. Setiap input yang tersisa dan tersedia yang mencapai tahap ini biasanya digunakan untuk mendorong efek tepi, seperti peregangan atau cahaya, yang menunjukkan bahwa pengguna telah mencapai batas area yang dapat di-scroll.

Delta input transformasi

Delta input pointer memerlukan penyesuaian tanda di seluruh fase scroll agar sesuai dengan kontrak yang diharapkan. Sebelum delta mencapai fase Scroll, pengubah scroll menyesuaikan delta input berdasarkan konteks orientasi, arah tata letak, dan RTL. Hal ini terjadi karena input mentah melacak gerakan piksel fisik pointer di layar (misalnya, bergerak ke bawah akan meningkatkan koordinat Y layar, sehingga menghasilkan delta positif). Namun, untuk mencapai "scroll alami" saat konten bergerak mengikuti jari Anda, menarik ke bawah berarti area pandang harus bergeser ke atas di atas konten, yang sesuai dengan offset scroll negatif.

Delta input dari sumber input lain, seperti roda mouse atau touchpad, tidak diubah selama fase scroll.

Contoh: Pointer bergerak ke kanan menggunakan Modifier.horizontalScroll()

Untuk memahami cara delta digunakan dan diubah, lihat Gambar 2, yang memetakan gestur saat pointer bergerak ke kanan.

• Pra-scroll: Gestur dimulai dengan delta input mentah positif sebesar 100.
  • Overscroll mengamati hal ini dan menggunakan 10, sehingga menyisakan 90.
  • Pra-scroll scroll bertingkat memberi komponen induk kesempatan untuk bereaksi, menggunakan 30. Selisih mentah yang tersisa adalah 60.
• Transformasi A: Sebelum memasuki fase Scroll, horizontalScroll membalikkan delta mentah positif yang tersisa (60) menjadi delta negatif (-60). Hal ini memastikan area pandang bergeser ke kiri sehingga konten tampak bergerak ke kanan mengikuti jari pengguna.
• Scroll: Komponen yang dapat di-scroll target menggunakan sebagian delta yang diubah ini untuk memperbarui offset scroll-nya. Dalam contoh ini, permintaan tersebut menggunakan -30, sehingga menyisakan -30 yang tidak digunakan.
• Transformasi B: Delta scroll yang tidak digunakan (-30) dikonversi kembali menjadi delta mentah positif (30) agar sesuai dengan kontrak scroll bertingkat dan overscroll.
• Pasca-scroll: Delta mentah yang tersisa diteruskan kembali ke pipeline.
  • Scroll bertingkat pasca-scroll menggunakan 10, menyisakan 20.
  • Efek overscroll menggunakan 20 terakhir untuk mendorong efek tepi visual, seperti peregangan atau cahaya, yang sepenuhnya menyelesaikan delta input menjadi 0.

Referensi transformasi delta input pointer

Tabel berikut menguraikan cara delta input ditandatangani di berbagai fase dan arah untuk input pointer.

	Delta input mentah	Efek overscroll	Scroll bertingkat	scrollableArea dengan orientasi horizontal	scrollableArea dengan orientasi horizontal (terbalik)	scrollableArea dengan orientasi vertikal	scrollableArea dengan orientasi vertikal (terbalik)
Pointer bergerak KE ATAS	Negatif	Negatif	Negatif	T/A	T/A	Positif	Negatif
Kursor bergerak KE BAWAH	Positif	Positif	Positif	T/A	T/A	Negatif	Positif
Kursor bergerak ke KIRI	Negatif	Negatif	Negatif	Positif (Negatif untuk RTL)	Negatif (Positif untuk RTL)	T/A	T/A
Pointer bergerak ke KANAN	Positif	Positif	Positif	Negatif (Positif untuk RTL)	Positif (Negatif untuk RTL)	T/A	T/A