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