জেসচার নেভিগেশন — এটি কীভাবে কাজ করে, প্রকার এবং বাস্তবায়ন

জেসচার নেভিগেশন কী

জেসচার নেভিগেশন হল একটি মোবাইল ডিভাইসের সাথে ব্যবহারকারীর মিথস্ক্রিয়ার একটি পদ্ধতি যা টাচ স্ক্রিন দ্বারা স্বীকৃত স্পর্শ, চলাচল এবং চাপের ক্রমগুলির মাধ্যমে কাজ করে। ঐতিহ্যবাহী বাটনের বিপরীতে, জেসচারগুলির স্ক্রিনে কোনো নির্দিষ্ট অবস্থান থাকে না এবং এগুলি চলাচলের প্যাটার্ন দ্বারা স্বীকৃত হয়: কিনারা থেকে সোয়াইপ, দুই আঙুল দিয়ে পিঞ্চ, লং প্রেস।

জেসচার নেভিগেশনে রূপান্তর iPhone X দিয়ে শুরু হয়েছিল (2017), যেখানে Apple হোম বাটন সম্পূর্ণরূপে সরিয়ে ফেলে, এটিকে নিচের কিনারা থেকে সোয়াইপ দিয়ে প্রতিস্থাপন করে। Google Android 10 (2020)-এ এই প্রবণতা অনুসরণ করে, ব্যবহারকারীদের পছন্দ প্রদান করে: তিন-বাটন নেভিগেশন, দুই-বাটন নেভিগেশন এবং পূর্ণ জেসচার নেভিগেশন। StatCounter (2025) অনুসারে, 75% এর বেশি Android ডিভাইস এবং 95% iOS ডিভাইস জেসচার নেভিগেশন ব্যবহার করে।

স্থাপত্যগতভাবে, জেসচার শনাক্তকরণ তিনটি পর্যায় নিয়ে গঠিত: ক্যাপচার (স্পর্শ ইভেন্ট ক্যাপচার করা), শনাক্তকরণ (চলাচলের প্যাটার্ন চিহ্নিত করা) এবং অ্যাকশন (নির্ধারিত কাজ সম্পাদন করা)। সিস্টেম স্তরে, Android এবং iOS-এ মৌলিক নেভিগেশন জেসচারের জন্য অন্তর্নির্মিত হ্যান্ডলার রয়েছে — সোয়াইপ ব্যাক, হোম স্ক্রিনে যাওয়া, অ্যাপ সুইচার খোলা। ডেভেলপারকে শুধুমাত্র তার নিজস্ব জেসচারগুলিকে এই সিস্টেমে সঠিকভাবে সংহত করতে হবে।

মোবাইল নেভিগেশনে জেসচারের প্রকারভেদ

সব স্পর্শ জেসচারকে উদ্দেশ্য এবং নির্বাহ পদ্ধতির ভিত্তিতে তিনটি বিভাগে ভাগ করা যায়। প্রতিটি প্রকারের নিজস্ব প্রক্রিয়াকরণ নিয়ম এবং ইন্টারফেসে ব্যবহারের জন্য সুপারিশ রয়েছে।

নেভিগেশন জেসচার

নেভিগেশন জেসচার স্ক্রিনের মধ্যে চলাচল নিয়ন্ত্রণ করে: ফিরে যেতে বাম কিনারা থেকে সোয়াইপ (iOS), অ্যাপ সুইচার খুলতে উপরে সোয়াইপ, হোম স্ক্রিনে ফিরতে নিচের কিনারা থেকে সোয়াইপ। এই জেসচারগুলি উইন্ডো স্তরে সিস্টেম দ্বারা পরিচালিত হয় এবং অ্যাপের ভিতরে কাস্টম জেসচারের সাথে দ্বন্দ্ব করা উচিত নয়।

ম্যানিপুলেশন জেসচার

ম্যানিপুলেশন জেসচার স্ক্রিন上的 অবজেক্টের অবস্থান, আকার বা অভিমুখ পরিবর্তন করে। পিঞ্চ (দুই-আঙুলের জুম), রোটেট (ঘূর্ণন), প্যান (টেনে আনা), সোয়াইপ (দ্রুত সোয়াইপ) — এই সব জেসচার View বা Composable স্তরে পরিচালিত হয় এবং সিস্টেম নেভিগেশনকে প্রভাবিত করে না।

প্রাসঙ্গিক জেসচার

প্রাসঙ্গিক জেসচার অন্য স্ক্রিনে নেভিগেট না করেই অতিরিক্ত ফাংশন সক্রিয় করে। লং প্রেস (প্রসঙ্গ মেনুর জন্য), ডাবল ট্যাপ (লাইক বা জুমের জন্য), এজ সোয়াইপ (Drawer খোলার জন্য)। এই জেসচারগুলির সবচেয়ে সতর্ক বাস্তবায়ন প্রয়োজন কারণ এগুলি সিস্টেম নেভিগেশন জেসচারের সাথে ওভারল্যাপ হতে পারে।

Android-এ জেসচার নেভিগেশন: GestureDetector এবং MotionEvent

Android SDK নিম্ন-স্তরের MotionEvent থেকে উচ্চ-স্তরের GestureDetector এবং GestureOverlayView পর্যন্ত একটি বহু-স্তরের জেসচার প্রক্রিয়াকরণ ব্যবস্থা প্রদান করে। সঠিক স্তর নির্বাচন করা জেসচারের জটিলতা এবং কর্মক্ষমতার প্রয়োজনীয়তার উপর নির্ভর করে।

GestureDetector — বেস ক্লাস

GestureDetector একটি উচ্চ-স্তরের ক্লাস যা MotionEvent-এর ক্রমকে নির্দিষ্ট জেসচারে রূপান্তর করে: onDown, onShowPress, onSingleTapUp, onScroll, onLongPress, onFling। ডেভেলপার GestureDetector.SimpleOnGestureListener-এর প্রয়োজনীয় মেথডগুলি ওভাররাইড করে এবং একটি প্রস্তুত শনাক্ত ইভেন্ট পায়। স্কেলিং ছাড়া সব মানক জেসচারের জন্য GestureDetector সুপারিশ করা হয় — তার জন্য ScaleGestureDetector আছে।

val gestureDetector = GestureDetector(this, object : GestureDetector.SimpleOnGestureListener() {
    override fun onFling(
        e1: MotionEvent?, e2: MotionEvent,
        velocityX: Float, velocityY: Float
    ): Boolean {
        val deltaX = e2.x - (e1?.x ?: 0f)
        return if (Math.abs(deltaX) > Math.abs(e2.y - (e1?.y ?: 0f))) {
            if (deltaX > 0) onSwipeRight() else onSwipeLeft()
            true
        } else false
    }
})

view.setOnTouchListener { _, event -> gestureDetector.onTouchEvent(event) }

কাস্টম লক্ষ্যের জন্য TouchDelegate

TouchDelegate একটি View-এর স্পর্শ এলাকা প্রসারিত করার একটি পদ্ধতি। এটি ব্যবহার করা হয় যখন লক্ষ্য উপাদানটি 48dp-এর ন্যূনতম স্পর্শ আকারের চেয়ে ছোট হয়। উদাহরণস্বরূপ, স্ক্রিনের কোণায় একটি ছোট "বন্ধ" বাটন একটি TouchDelegate পায় যা দৃশ্যমান আকার না বদলেই তার হিট এলাকা প্রসারিত করে। Google 48x48dp-এর চেয়ে ছোট সব ইন্টারেক্টিভ উপাদানের জন্য TouchDelegate সুপারিশ করে।

Jetpack Compose-এ জেসচার

Compose জেসচার পরিচালনার জন্য মডিফায়ার প্রদান করে: clickable, draggable, swipeable, combinedClickable (ডাবল ট্যাপ এবং লং প্রেসের জন্য)। অভ্যন্তরীণভাবে, Compose নিম্ন-স্তরের প্রক্রিয়াকরণের জন্য PointerInputScope ব্যবহার করে, কিন্তু বেশিরভাগ ডেভেলপারের শুধুমাত্র উচ্চ-স্তরের মডিফায়ার প্রয়োজন। কাস্টম জেসচারের জন্য awaitPointerEvent সহ pointerInput ব্যবহার করুন।

iOS-এ জেসচার নেভিগেশন: UIGestureRecognizer এবং SwiftUI

iOS SDK UIGestureRecognizer আর্কিটেকচার ব্যবহার করে — একটি অ্যাবস্ট্রাক্ট বেস ক্লাস যা UITouch-এর ক্রম বিশ্লেষণ করে এবং নির্ধারণ করে যে এটি একটি পরিচিত জেসচারের সাথে মেলে কিনা। Apple যেখানে সম্ভব মানক রিকগনাইজার ব্যবহার করার এবং শুধুমাত্র অনন্য জেসচারের জন্য কাস্টম সাবক্লাস তৈরি করার সুপারিশ করে।

UIKit-এ UIGestureRecognizer

UIKit প্রস্তুত রিকগনাইজারের একটি সেট প্রদান করে: UITapGestureRecognizer, UISwipeGestureRecognizer, UIPanGestureRecognizer, UIPinchGestureRecognizer, UIRotationGestureRecognizer, UILongPressGestureRecognizer। প্রতিটি রিকগনাইজারের অবস্থা থাকে (possible, began, changed, ended, cancelled, failed) — ডেভেলপার জেসচারের বিভিন্ন পর্যায়ে প্রতিক্রিয়া জানাতে অবস্থা ট্র্যাক করে।

let swipeBack = UISwipeGestureRecognizer(
    target: self,
    action: #selector(handleSwipeBack)
)
swipeBack.direction = .right
view.addGestureRecognizer(swipeBack)

@objc func handleSwipeBack() {
    navigationController?.popViewController(animated: true)
}

SwiftUI-এ জেসচার

SwiftUI Compose-এর মতো ঘোষণামূলক জেসচার মডিফায়ার ব্যবহার করে: onTapGesture, onLongPressGesture, MagnificationGesture, RotationGesture, DragGesture। SwiftUI simultaneousGesture, sequencedGesture এবং exclusiveGesture-এর মাধ্যমে জেসচারের মধ্যে দ্বন্দ্ব স্বয়ংক্রিয়ভাবে পরিচালনা করে — মডিফায়ার যা একসাথে ট্রিগার হলে জেসচার অগ্রাধিকার নির্ধারণ করে।

Image("photo")
    .gesture(
        MagnificationGesture()
            .onChanged { scale in
                self.currentScale = scale
            }
            .sequenced(before: DragGesture())
    )

InteractivePopGestureRecognizer

InteractivePopGestureRecognizer একটি সিস্টেম রিকগনাইজার যা UINavigationController-এ সোয়াইপ-ব্যাক জেসচার নিয়ন্ত্রণ করে। ডিফল্টভাবে, এটি রুট ছাড়া সব স্ক্রিনের জন্য সক্রিয়। যদি আপনার অ্যাপ একটি কাস্টম NavigationBar ব্যবহার করে, তাহলে interactivePopGestureRecognizer কাজ বন্ধ করে দিতে পারে — এটি navigationController.interactivePopGestureRecognizer?.delegate-এর মাধ্যমে প্রোগ্রাম্যাটিকভাবে সক্রিয় করতে হবে।

সিস্টেম এবং কাস্টম জেসচারের দ্বন্দ্ব

জেসচার দ্বন্দ্ব জেসচার নেভিগেশনের সবচেয়ে চ্যালেঞ্জিং সমস্যাগুলির মধ্যে একটি। যখন একটি কাস্টম জেসচার (উদাহরণস্বরূপ, বাম কিনারা থেকে সোয়াইপ করে Drawer খোলা) সিস্টেম জেসচারের (iOS বা Android-এ সোয়াইপ ব্যাক) সাথে মিলে যায়, তখন সিস্টেমকে নির্ধারণ করতে হবে কোন জেসচারের অগ্রাধিকার রয়েছে। এই দ্বন্দ্ব সঠিকভাবে পরিচালনা করা ব্যবহারকারীর অভিজ্ঞতার জন্য গুরুত্বপূর্ণ।

Android-এ সমাধান: Insets এবং SystemGestureExclusionRects

Android 10+ অ্যাপকে WindowInsets-এর মাধ্যমে নিজস্ব জেসচারের জন্য স্ক্রিনের এলাকা সংরক্ষণ করতে দেয়। ViewCompat.setSystemGestureExclusionRects ব্যবহার করে এমন অঞ্চল নির্দিষ্ট করুন যেখানে সিস্টেম জেসচার ট্রিগার হওয়া উচিত নয়। উদাহরণস্বরূপ, বাম দিকের Drawer-এর জন্য, আপনি সিস্টেম সোয়াইপ-ব্যাক থেকে স্ক্রিনের বাম কিনারা (200dp পর্যন্ত চওড়া) বাদ দিতে পারেন। Google একটি সীমা নির্ধারণ করেছে: প্রতিটি পাশে 200dp পর্যন্ত বাদ দেওয়া যেতে পারে।

val exclusionRect = Rect(0, 0, 200, height)
ViewCompat.setSystemGestureExclusionRects(
    drawerView,
    listOf(SystemGestureExclusionRect(exclusionRect))
)

iOS-এ সমাধান: UIGestureRecognizerDelegate

iOS UIGestureRecognizerDelegate-এ gestureRecognizerShouldBegin মেথড প্রদান করে, যা একটি কাস্টম রিকগনাইজারকে সিদ্ধান্ত নিতে দেয় যে এটি শনাক্তকরণ শুরু করবে কিনা। বাম কিনারা থেকে Drawer সোয়াইপের জন্য, আপনি স্পর্শের অবস্থান পরীক্ষা করতে পারেন: যদি ব্যবহারকারী Drawer টেনে নেয় (দূরত্ব সীমা অতিক্রম করে), কাস্টম জেসচার নিয়ন্ত্রণ নেয়। যদি জেসচার শনাক্ত না হয়, সিস্টেম InteractivePopGestureRecognizer-এ নিয়ন্ত্রণ ফিরিয়ে দেয়।

সাধারণ ভুল এবং সর্বোত্তম অনুশীলন

জেসচার নেভিগেশন এর জন্য সাবধানে ডিজাইনের প্রয়োজন, বিশেষ করে সিস্টেম জেসচার নেভিগেশনযুক্ত ডিভাইসে। চলুন সাধারণ ভুল এবং সেগুলি ঠিক করার সুপারিশগুলি দেখি।

ভুল: স্ক্রিনের কিনারায় দ্বন্দ্ব অঞ্চল উপেক্ষা করা

সবচেয়ে সাধারণ ভুল হল সিস্টেম জেসচার জোনে (বাম এবং ডান কিনারা, নিচের কিনারা) ইন্টারেক্টিভ উপাদান রাখা বা কাস্টম সোয়াইপ বাস্তবায়ন করা। ব্যবহারকারী একটি কাজ করার চেষ্টা করে, কিন্তু তার পরিবর্তে সিস্টেম নেভিগেশন ট্রিগার হয়। সর্বদা সিস্টেম জেসচারের জন্য মার্জিন প্রদান করুন এবং exclusion rects-এর মাধ্যমে দ্বন্দ্ব পরিচালনা করুন।

ভুল: Android এবং iOS-এ ভিন্ন শনাক্তকরণ গতি

জেসচার প্যারামিটার (বেগের সীমা, ন্যূনতম দূরত্ব) ডিফল্টভাবে প্ল্যাটফর্মের মধ্যে ভিন্ন হয়। যদি আপনার অ্যাপ ক্রস-প্ল্যাটফর্ম হয়, তাহলে এক প্ল্যাটফর্ম থেকে অন্য প্ল্যাটফর্মে প্যারামিটার কপি করবেন না — প্রতিটি জেসচার Android এবং iOS-এ আলাদাভাবে পরীক্ষা করুন। Flutter এবং React Native স্বয়ংক্রিয়ভাবে কিছু প্যারামিটার অভিযোজিত করে, কিন্তু সব নয়।

সর্বোত্তম অনুশীলন: ভিজ্যুয়াল প্রতিক্রিয়া

প্রতি জেসচার ভিজ্যুয়াল প্রতিক্রিয়া সহ থাকা উচিত: রঙ পরিবর্তন, রূপান্তর, অ্যানিমেশন। ব্যবহারকারীর বোঝা উচিত যে জেসচার শনাক্ত হয়েছে এবং কাজ সম্পাদিত হচ্ছে। iOS-এ, সিস্টেম রিকগনাইজার স্বয়ংক্রিয়ভাবে হ্যাপটিক ফিডব্যাক প্রদান করে; Android-এ এটি HapticFeedbackConstants-এর মাধ্যমে যোগ করতে হবে।

সর্বোত্তম অনুশীলন: জেসচারের জন্য অ্যাক্সেসিবিলিটি

সব ব্যবহারকারী জেসচার করতে পারেন না — সীমিত মোটর দক্ষতা সম্পন্ন লোকেরা নেভিগেশনের জন্য VoiceOver এবং TalkBack ব্যবহার করে। প্রতিটি জেসচারের জন্য একটি বাটন বিকল্প থাকা উচিত। Google এবং Apple প্রয়োজন করে যে সব জেসচার ক্রিয়া অ্যাক্সেসিবিলিটির জন্য উপলব্ধ নিয়ন্ত্রণের সাথে নকল করা হোক।