Push Presentation मोबाइल डेवलपमेंट में: यह क्या है, स्क्रीन स्टैक

Push Presentation क्या है?

Push Presentation एक नेविगेशन तंत्र है जिसमें प्रत्येक नई स्क्रीन स्टैक के शीर्ष पर रखी जाती है, जबकि पिछली स्क्रीन उसके नीचे मेमोरी में रहती है। उपयोगकर्ता क्रमिक रूप से विस्तृत स्क्रीन खोलकर सामग्री में गहराई तक जाता है, और वापसी बटन उसे पिछले चरण पर लौटा देता है।

Push नेविगेशन की आर्किटेक्चर LIFO (Last In, First Out) डेटा संरचना पर आधारित है। नई स्क्रीन हमेशा स्टैक के अंत में जोड़ी जाती है, और हटाना केवल शीर्ष से होता है। यह पूर्वानुमानित व्यवहार सुनिश्चित करता है: उपयोगकर्ता हमेशा जानता है कि वापसी बटन उसे ठीक एक कदम पीछे ले जाएगा। नेविगेशन स्टैक एप्लिकेशन की जटिलता के आधार पर 2 से 10+ स्क्रीन तक हो सकता है।

Push Presentation पदानुक्रमित सामग्री वाले एप्लिकेशन में मुख्य पैटर्न है: समाचार फ़ीड, उत्पाद कैटलॉग, बहु-स्तरीय मेनू और दस्तावेज़ीकरण। Material Design के अनुसार, स्टैक नेविगेशन उन परिदृश्यों के लिए उपयुक्त है जहाँ उपयोगकर्ता सामान्य से विशिष्ट तक सामग्री का अन्वेषण करता है, और प्रत्येक अगली स्क्रीन विषय की समझ को गहरा करती है।

नेविगेशन स्टैक: कार्य सिद्धांत

नेविगेशन स्टैक स्क्रीन का एक क्रमबद्ध सेट है जहाँ प्रत्येक तत्व अपने ViewController या Fragment की स्थिति संग्रहीत करता है। Push ऑपरेशन के दौरान, एक नई स्क्रीन स्टैक में जोड़ी जाती है, इसकी उपस्थिति एनिमेटेड होती है (iOS में दाईं ओर से स्लाइड, Android में नीचे से स्लाइड या Fade), और यह सक्रिय हो जाती है।

Pop ऑपरेशन (वापस दबाने) के दौरान, शीर्ष स्क्रीन स्टैक से हटा दी जाती है, नष्ट हो जाती है या मेमोरी में चली जाती है, और पिछली स्क्रीन सक्रिय हो जाती है। iOS डिफ़ॉल्ट रूप से popped ViewController को नष्ट करता है, मेमोरी मुक्त करता है। Android Fragment को बैक स्टैक में पुनर्स्थापना की क्षमता के साथ बिना पुनर्निर्माण के सहेज सकता है।

स्टैक की गहराई प्रदर्शन को प्रभावित करती है: स्टैक में प्रत्येक स्क्रीन मेमोरी की खपत करती है। अनुशंसा की जाती है कि स्टैक में 10 से अधिक स्क्रीन न रखें। गहरे नेविगेशन के लिए, PopToRoot का उपयोग करें या नई रूट स्क्रीन के साथ स्टैक को पुनरारंभ करें। Android में Navigation Component SavedStateHandle के माध्यम से स्वचालित रूप से स्टैक स्थिति का प्रबंधन करता है।

iOS में Push नेविगेशन: UINavigationController

UINavigationController एक iOS कंटेनर कंट्रोलर है जो UIViewController के स्टैक का प्रबंधन करता है। यह स्वचालित रूप से वर्तमान स्क्रीन के शीर्षक और वापसी बटन के साथ एक नेविगेशन बार प्रदर्शित करता है। डिफ़ॉल्ट push एनिमेशन दाएँ से बाएँ स्लाइड है, जो उपयोगकर्ता के लिए सामग्री में डूबने की भावना पैदा करता है।

स्टैक प्रबंधन

स्क्रीन जोड़ना pushViewController(_:animated:) के माध्यम से किया जाता है। हटाना popViewController(animated:) के माध्यम से किया जाता है। रूट स्क्रीन पर वापस लौटने के लिए popToRootViewController(animated:) का उपयोग करें। UINavigationController viewControllers प्रॉपर्टी के माध्यम से प्रोग्रामेटिक स्टैक प्रबंधन का भी समर्थन करता है — स्टैक में सभी कंट्रोलर की एक सरणी।

नेविगेशन बार और Large Titles

नेविगेशन बार में स्क्रीन का शीर्षक, वापसी बटन और वैकल्पिक क्रिया बटन होते हैं। iOS 11 से शुरू होकर, Large Titles (prefersLargeTitles) शीर्षक को बड़े फ़ॉन्ट में प्रदर्शित करने की अनुमति देते हैं जो स्क्रॉल करने पर एनिमेटेड रूप से सिकुड़ता है। यह नेविगेशन पदानुक्रम में सुधार करता है और उपयोगकर्ता को वर्तमान अनुभाग के बारे में सूचित करता है।

let detailVC = DetailViewController()
detailVC.title = "Item Details"
navigationController?.pushViewController(detailVC, animated: true)

// पिछली स्क्रीन पर वापस जाएँ
navigationController?.popViewController(animated: true)

// रूट पर वापस जाएँ
navigationController?.popToRootViewController(animated: true)

Android में Push नेविगेशन: Navigation Component

Navigation Component घोषणात्मक नेविगेशन के लिए एक Android Jetpack लाइब्रेरी है। यह NavController प्रदान करता है, जो नेविगेशन ग्राफ़ (nav_graph) के माध्यम से फ़्रैगमेंट या Compose स्क्रीन का प्रबंधन करता है। Android में Push iOS के समान है: प्रत्येक नया Fragment बैक स्टैक में जोड़ा जाता है, और वापसी बटन पिछले पर लौटाता है।

NavHost और NavGraph

NavHost एक कंटेनर है जो NavGraph से वर्तमान गंतव्य प्रदर्शित करता है। NavGraph एक XML फ़ाइल है जो सभी एप्लिकेशन स्क्रीन और उनके बीच कनेक्शन का वर्णन करती है। संक्रमण actions के माध्यम से गंतव्य और वैकल्पिक तर्कों के साथ परिभाषित किए जाते हैं। Navigation Component स्वचालित रूप से सिस्टम बैक, एनिमेशन और स्थिति संरक्षण को संभालता है।

तर्क और Safe Args

स्क्रीन के बीच डेटा स्थानांतरित करने के लिए, Navigation Component Safe Args का समर्थन करता है — टाइप-सेफ़ तर्क वर्गों का कोड जनरेशन। मैन्युअल रूप से Bundle में डेटा रखने के बजाय, डेवलपर NavGraph में तर्क घोषित करता है और उन्हें जनरेटेड Directions और Args वर्गों के माध्यम से प्राप्त करता है। Safe Args प्रकार बेमेल त्रुटियों को समाप्त करता है और रीफ़ैक्टरिंग को सरल बनाता है।

// XML में NavGraph परिभाषा
<!-- res/navigation/nav_graph.xml -->
@navigation {
    NavHost(startDestination = "list") {
        composable("list") { ListScreen() }
        composable(
            "detail/{itemId}",
            arguments = listOf(navArgument("itemId") { type = NavType.IntType })
        ) { DetailScreen(it.arguments()?.getInt("itemId") ?: 0) }
    }
}

// प्रोग्रामेटिक रूप से नेविगेट करें
navController.navigate("detail/42")

Push स्टैक के साथ BottomNavigation

Bottom Navigation और Push नेविगेशन का संयोजन मोबाइल एप्लिकेशन में एक सामान्य पैटर्न है। प्रत्येक Bottom Navigation टैब का अपना स्क्रीन स्टैक होता है। Navigation Component इसे प्रति टैब NavHost या प्रत्येक टैब के लिए अलग-अलग ग्राफ़ वाले एकल NavHost के माध्यम से समर्थन करता है। टैब स्विच करने से push स्टैक की स्थिति रीसेट नहीं होती है।

Push Presentation बनाम Modal Presentation

Push Presentation और Modal Presentation नेविगेशन के विभिन्न कार्यों को हल करते हैं। Push अनुक्रमिक सामग्री देखने के लिए डिज़ाइन किया गया है, जहाँ प्रत्येक नई स्क्रीन संदर्भ को गहरा करती है। Modal केंद्रित कार्यों के लिए है जिन्हें पूरा करना आवश्यक है। व्यवहार में, विशिष्ट परिदृश्य के लिए सही पैटर्न चुनना महत्वपूर्ण है।

मुख्य चयन मानदंड: यदि उपयोगकर्ता को संदर्भ खोए बिना स्वतंत्र रूप से वापस लौटने में सक्षम होना चाहिए — Push चुनें। यदि कार्य अस्थायी है और मुख्य सामग्री (फ़ॉर्म, प्राधिकरण) को अवरुद्ध करता है — Modal का उपयोग करें। एक ही स्क्रीन पर पैटर्न मिश्रण (Modal के अंदर Push) स्वीकार्य है लेकिन स्पष्ट दृश्य पदानुक्रम की आवश्यकता होती है।

एक गलती स्क्रीन के अनुक्रमों के लिए Modal का उपयोग करना है जो तार्किक रूप से मुख्य प्रवाह का हिस्सा हैं। उदाहरण के लिए, ऑर्डर निर्माण विज़ार्ड (चरण 1 → चरण 2 → चरण 3) को मोडल विंडो की श्रृंखला के बजाय मोडल कंटेनर के अंदर Push के माध्यम से लागू करना बेहतर है। यह नेविगेशन पदानुक्रम और वापसी की पूर्वानुमानिता को संरक्षित करता है।

Swift और Kotlin में कार्यान्वयन उदाहरण

आइए दोनों प्लेटफ़ॉर्म पर Push नेविगेशन का पूर्ण कार्यान्वयन देखें। Swift उदाहरण प्रोग्रामेटिक स्टैक प्रबंधन और डीप लिंक हैंडलिंग के साथ UINavigationController प्रदर्शित करता है। Kotlin उदाहरण NavHost, तर्क और एनिमेशन के साथ Navigation Component दिखाता है।

class ListViewController: UIViewController {
    func showDetail(_ itemId: Int) {
        let storyboard = UIStoryboard(name: "Main", bundle: nil)
        let detailVC = storyboard.instantiateViewController(
            withIdentifier: "DetailViewController"
        ) as! DetailViewController
        detailVC.itemId = itemId
        navigationController?.pushViewController(detailVC, animated: true)
    }
}

class DetailViewController: UIViewController {
    var itemId: Int = 0

    override func viewDidLoad() {
        super.viewDidLoad()
        title = "Item #\(itemId)"
    }
}

@Composable
fun PushNavigationApp() {
    val navController = rememberNavController()

    NavHost(navController = navController, startDestination = "list") {
        composable("list") {
            ListScreen(
                onItemClick = { id -> navController.navigate("detail/$id") }
            )
        }
        composable(
            "detail/{itemId}",
            arguments = listOf(navArgument("itemId") { type = NavType.IntType })
        ) { backStackEntry ->
            val itemId = backStackEntry.arguments()?.getInt("itemId") ?: 0
            DetailScreen(itemId = itemId, onBack = { navController.popBackStack() })
        }
    }
}

उदाहरण मूल Push नेविगेशन दिखाते हैं: सूची → विवरण। iOS मैन्युअल डेटा पासिंग के साथ स्टोरीबोर्ड और UINavigationController का उपयोग करता है। Android टाइप-सेफ़ तर्क और स्वचालित बैक स्टैक प्रबंधन के साथ NavHost का उपयोग करता है। दोनों दृष्टिकोण डीप लिंक, कस्टम एनिमेशन और रोटेशन पर स्थिति संरक्षण का समर्थन करते हैं।