স্ক্রল করার প্রক্রিয়াটি একাধিক ধাপে বিভক্ত। ইনপুট ডেল্টা একাধিক পর্যায়ের মাধ্যমে পাঠানো হয় যাতে প্রতিটি পর্যায় মুভমেন্ট ব্যবহার বা প্রতিক্রিয়া করার সুযোগ পায়।
এই সাইকেল চলাকালীন, উপলভ্য ইনপুট ডেল্টা এবং ব্যবহৃত ইনপুট ডেল্টা, উভয়ই প্রতিটি ধাপে পাস করা হয়। এটি প্রতিটি ফেজকে স্ক্রল ইভেন্টে প্রতিক্রিয়া জানাতে, ব্যবহার করতে বা শুনতে প্রয়োজনীয় সম্পূর্ণ প্রসঙ্গ প্রদান করে।
ছবি ১-এ যেমন দেখানো হয়েছে, স্ক্রল করার প্রসেস ঠিক এই ক্রম অনুসরণ করে:
- ওভারস্ক্রল: প্রথমে প্রাথমিক ইনপুট ডেল্টা গ্রহণ করে, যা ওভারস্ক্রলকে প্রথমে প্রতিক্রিয়া জানানোর সুযোগ দেয় (যেমন, একটি অ্যাক্টিভ স্ট্রেচ এফেক্ট রিল্যাক্স করে)।
- নেস্টেড স্ক্রল প্রি-স্ক্রল: স্ক্রল ফেজের আগে ইনপুট ডেল্টায় প্রতিক্রিয়া জানানোর সুযোগ দেয়। এই ফেজে, কিছু ইনপুট ডেল্টা ব্যবহার করা হতে পারে, অথবা UI পরিবর্তন ট্রিগার করার জন্য এটি শুধু মনিটর করা হতে পারে, যেমন অ্যাপ বার ছোট বা বড় করা।
- ইনপুট ডেল্টা ট্রান্সফর্ম করা: লেআউট ওরিয়েন্টেশন ও দিকের উপর ভিত্তি করে র ইনপুট ডেল্টার সাইন অ্যাডজাস্ট করে যাতে ন্যাচারাল স্ক্রলিংয়ের অভিজ্ঞতা পাওয়া যায়। আরও তথ্যের জন্য, ইনপুট ডেল্টা ট্রান্সফর্ম করুন বিভাগ দেখুন।
- স্ক্রল: এই ফেজ উপলভ্য, ব্যবহার না করা ইনপুট ডেল্টা পায় যা স্ক্রলিং কন্টেনার কনফিগারেশনের সাথে ম্যাচ করার জন্য অ্যাডজাস্ট করা হয়। এটি সাধারণত নিজের স্ক্রল অফসেট আপডেট করতে এই ডেল্টা ব্যবহার করে।
- র কাঁচা ইনপুট ডেল্টায় ফিরিয়ে আনুন: স্ক্রল ফেজ থেকে আসল কাঁচা ইনপুট ডেল্টা চিহ্নে উপলভ্য ও ব্যবহৃত ডেল্টা ফিরিয়ে আনে।
- নেস্টেড স্ক্রল পোস্ট-স্ক্রল: মূল স্ক্রল ফেজ সম্পূর্ণ হওয়ার পরে এই ফেজ কাজ করে, নতুন আপডেট করা উপলভ্য ও ব্যবহৃত ডেল্টা গ্রহণ করে। এটি অবশিষ্ট উপলভ্য ইনপুট ব্যবহার করতে পারে অথবা যা ব্যবহার করা হয়েছে তার প্রসঙ্গ ব্যবহার করতে পারে।
- ওভারস্ক্রল: এই শেষ ফেজে, শেষ উপলভ্য ও ব্যবহৃত ডেল্টা দেখা হয়। এই পর্যায়ে পৌঁছানো বাকি উপলভ্য ইনপুট সাধারণত এজ এফেক্ট, যেমন স্ট্রেচ বা গ্লো, ড্রাইভ করার জন্য ব্যবহার করা হয়, যা ইঙ্গিত করে যে ব্যবহারকারী স্ক্রলযোগ্য এরিয়ার সীমায় পৌঁছে গেছেন।
ইনপুট ডেল্টা ট্রান্সফর্ম করুন
পয়েন্টার ইনপুট ডেল্টার জন্য প্রত্যাশিত চুক্তির সাথে মিলতে স্ক্রল ফেজ জুড়ে সাইন অ্যাডজাস্টমেন্ট প্রয়োজন। ডেল্টা স্ক্রল ফেজে পৌঁছানোর আগে, স্ক্রল মডিফায়ার ওরিয়েন্টেশন, লেআউট ডিরেকশন ও RTL প্রসঙ্গের উপর ভিত্তি করে ইনপুট ডেল্টা অ্যাডজাস্ট করে। এটি ঘটে কারণ র ইনপুট স্ক্রিনে পয়েন্টারের ফিজিক্যাল পিক্সেল মুভমেন্ট ট্র্যাক করে (যেমন, নিচের দিকে সরানোর ফলে স্ক্রিনের Y-কোঅর্ডিনেট বৃদ্ধি পায়, যার ফলে একটি পজিটিভ ডেল্টা পাওয়া যায়)। তবে, "ন্যাচুরাল স্ক্রলিং" অর্জন করতে, যেখানে কন্টেন্ট আপনার আঙুলের সাথে চলে, নিচের দিকে টেনে আনার অর্থ হল ভিউ পোর্টটি অবশ্যই কন্টেন্টের উপরে শিফট হতে হবে, যা নেগেটিভ স্ক্রল অফসেটের সাথে সম্পর্কিত।
অন্যান্য ইনপুট সোর্স থেকে ইনপুট ডেল্টা, যেমন মাউস হুইল বা টাচপ্যাড, স্ক্রল ফেজ জুড়ে রূপান্তরিত হয় না।
উদাহরণ: Modifier.horizontalScroll() ব্যবহার করে পয়েন্টার ডানদিকে সরানো হয়
ডেল্টা কীভাবে ব্যবহার ও পরিবর্তন করা হয় তা বুঝতে, চিত্র ২ দেখুন, যেখানে পয়েন্টার ডানদিকে সরানোর জেসচার ম্যাপ করা হয়েছে।
- প্রি-স্ক্রল: ১০০-এর পজিটিভ র ইনপুট ডেল্টা দিয়ে জেসচার শুরু হয়।
- ওভারস্ক্রল এটি লক্ষ্য করে এবং ১০ ব্যবহার করে, ৯০ বাকি থাকে।
- নেস্টেড স্ক্রল প্রি-স্ক্রল মূল কম্পোনেন্টকে প্রতিক্রিয়া জানানোর সুযোগ দেয়, ৩০ ব্যবহার করে। বাকি থাকা র ডেল্টা হল ৬০।
- ট্রান্সফর্মেশন A: স্ক্রল ফেজে প্রবেশ করার আগে,
horizontalScrollবাকি থাকা পজিটিভ র ডেল্টাকে (60) নেগেটিভ ডেল্টায় (-60) ইনভার্ট করে। এটি নিশ্চিত করে যে ভিউপোর্ট বাঁদিকে সরে যায় যাতে কন্টেন্ট ব্যবহারকারীর আঙুলের সাথে ডানদিকে সরে যাচ্ছে বলে মনে হয়। - স্ক্রল: স্ক্রল করা যায় এমন টার্গেট কম্পোনেন্ট, স্ক্রল অফসেট আপডেট করার জন্য এই ট্রান্সফর্ম করা ডেল্টার একটি অংশ ব্যবহার করে। এই উদাহরণে, এটি -৩০ ব্যবহার করে, -৩০ অব্যবহৃত রেখে দেয়।
- ট্রান্সফর্মেশন B: নেস্টেড স্ক্রল ও ওভারস্ক্রলের চুক্তি ম্যাচ করার জন্য ব্যবহার না করা স্ক্রল ডেল্টা (-30) আবার পজিটিভ র ডেল্টা (30)-তে কনভার্ট করা হয়।
- পোস্ট-স্ক্রল: বাকি থাকা র-ডেল্টা পাইপলাইনে ফেরত পাঠানো হয়।
- নেস্টেড স্ক্রল পোস্ট-স্ক্রল ১০ ব্যবহার করে, ২০ বাকি থাকে।
- ওভারস্ক্রল এফেক্ট, ভিজ্যুয়াল এজ এফেক্ট ড্রাইভ করতে, শেষ ২০ ব্যবহার করে, যেমন, স্ট্রেচ বা গ্লো, ইনপুট ডেল্টা সম্পূর্ণভাবে ০-তে রিজলভ করে।
পয়েন্টার ইনপুট ডেল্টা ট্রান্সফর্মেশন রেফারেন্স
নিম্নলিখিত সারণীতে ইনপুট ডেল্টা কীভাবে বিভিন্ন ফেজে সাইন করা হয় এবং পয়েন্টার ইনপুটের জন্য নির্দেশাবলী দেওয়া আছে।
| র ইনপুট ডেল্টা | ওভারস্ক্রল এফেক্ট | নেস্ট করা স্ক্রল | অনুভূমিক সজ্জা সহ scrollableArea |
অনুভূমিক সজ্জা সহ scrollableArea (উল্টো) |
উল্লম্ব ওরিয়েন্টেশন সহ scrollableArea |
উল্লম্ব ওরিয়েন্টেশন সহ scrollableArea (উল্টো) |
|
|---|---|---|---|---|---|---|---|
| পয়েন্টার উপরের দিকে সরান | নেগেটিভ | নেগেটিভ | নেগেটিভ | N/A | N/A | পজিটিভ | নেগেটিভ |
| পয়েন্টার নিচের দিকে সরান | পজিটিভ | পজিটিভ | পজিটিভ | N/A | N/A | নেগেটিভ | পজিটিভ |
| পয়েন্টার বাঁদিকে সরবে | নেগেটিভ | নেগেটিভ | নেগেটিভ | পজিটিভ (RTL-এর জন্য নেগেটিভ) | নেগেটিভ (RTL-এর জন্য পজিটিভ) | N/A | N/A |
| পয়েন্টার ডানদিকে সরান | পজিটিভ | পজিটিভ | পজিটিভ | নেগেটিভ (RTL-এর জন্য পজিটিভ) | পজিটিভ (RTL-এর জন্য নেগেটিভ) | N/A | N/A |