Full Screen Cover: यह क्या है, पूर्ण-स्क्रीन प्रेजेंटेशन और UIKit

iOS में Full Screen Cover क्या है?

Full Screen Cover iOS में एक मोडल प्रेजेंटेशन शैली है जिसमें प्रस्तुत किया गया कंट्रोलर पूरे डिवाइस स्क्रीन को घेर लेता है। पैरेंट कंटेंट पूरी तरह छुप जाता है, जो एक इमर्सिव प्रभाव पैदा करता है और उपयोगकर्ता को वर्तमान कार्य पर केंद्रित करता है।

iOS 13 से पहले, Full Screen Cover iPhone पर एकमात्र मोडल प्रेजेंटेशन शैली थी। present(_:animated:completion:) के सभी काल डिफ़ॉल्ट रूप से .fullScreen का उपयोग करते थे। iOS 13 से शुरू करके, Apple ने डिफ़ॉल्ट शैली को .automatic में बदल दिया, जो iPhone के लिए .pageSheet चुनता है। हालांकि, Full Screen Cover अभी भी उपलब्ध है और उन परिदृश्यों के लिए उपयोग किया जाता है जहाँ पूर्ण फ़ोकस महत्वपूर्ण है।

Page Sheet के विपरीत, Full Screen Cover पैरेंट कंटेंट के साथ बातचीत की अनुमति नहीं देता और न ही उसे मोडल विंडो के नीचे दिखाता है। उपयोगकर्ता Full Screen Cover को नीचे स्वाइप करके बंद नहीं कर सकता — बंद करने के लिए dismiss(animated:completion:) का प्रोग्रामेटिक काल या स्क्रीन पर ही एक बंद बटन की आवश्यकता होती है। UX डिजाइन करते समय इस व्यवहार को ध्यान में रखना महत्वपूर्ण है।

Full Screen Cover बनाम Page Sheet: शैलियों की तुलना

Page Sheet दूसरी प्रमुख मोडल प्रेजेंटेशन शैली है, जो iOS 13 में पेश की गई थी। Page Sheet ऐक कार्ड के रूप में ऊपर के मार्जन के साथ प्रदर्शित होता है, जिसके नीचे पैरेंट स्क्रीन दिखाई देती है। उपयोगकर्ता नीचे स्वाइप करके Page Sheet को बंद कर सकता है। Full Screen Cover, इसके विपरीत, पैरेंट कंटेंट को छुपाता है और स्वाइप बंद का समर्थन नहीं करता।

Full Screen Cover और Page Sheet के बीच चुनाव कंटेंट और संदर्भ पर निर्भर करता है। अनुशंसा की जाती है कि Full Screen Cover का उपयोग उस कंटेंट के लिए किया जाए जिसे पूर्ण ध्यान की आवश्यकता है: पूर्ण-स्क्रीन वीडियो, फ़ोटो पूर्वावलोकन, दस्तावेज़ स्कैनिंग। Page Sheet उन कार्यों के लिए है जहाँ पैरेंट स्क्रीन संदर्भ महत्वपूर्ण है: संपादन फ़ॉर्म, विकल्प चयन, विस्तृत दृश्य।

UIKit में कार्यान्वयन: UIModalPresentationStyle

UIKit मोडल प्रेजेंटेशन शैली को कॉन्फ़िगर करने के लिए UIModalPresentationStyle.fullScreen स्थिरांक प्रदान करता है। present काल करने से पहले UIViewController पर यह गुण सेट करना सुनिश्चित करता है कि कंट्रोलर पूर्ण स्क्रीन पर प्रदर्शित हो। कंट्रोलर कीबोर्ड दिखाई देने पर व्यवहार का भी प्रबंधन करता है और सिस्टम ईवेंट को हैंडल करता है।

कॉन्फ़िगरेशन और डिलेगेट

.fullScreen शैली सेट करने के बाद, बंद करने की घटनाओं को संभालने के लिए presentationController?.delegate को कॉन्फ़िगर करने की अनुशंसा की जाती है। UIAdaptivePresentationControllerDelegate एगिंडल बंद करने के प्रयासों को रोकने और डेटा हानि रोकने की अनुमति देता है। Page Sheet के विपरीत, Full Screen Cover के लिए डिलेगेट केवल प्रोग्रामेटिक dismiss काल पर ही चलता है।

रोटेशन और कीबोर्ड हैंडलिंग

Full Screen Cover स्क्रीन रोटेशन और कीबोर्ड दिखाई देने को सही ढंग से संभालता है। घूमने पर, मोडल कंट्रोलर नई दिशा के अनुरूप स्वचालित रूप से ढल जाता है। UIKeyboardWillShowNotification कीबोर्ड दिखाई देने पर कंटेंट को ऊपर ले जाने की अनुमति देता है, जिससे टेक्स्ट फ़ील्ड दिखाई देते रहें। Page Sheet के विपरीत, Full Screen Cover कीबोर्ड दिखाई देने पर अपना आकार नहीं बदलता है।

let playerVC = VideoPlayerViewController()
playerVC.modalPresentationStyle = .fullScreen
playerVC.modalTransitionStyle = .crossDissolve
present(playerVC, animated: true) {
    playerVC.startPlayback()
}

// ख़रीज करें
dismiss(animated: true) {
    print("प्लेयर बंद किया गया")
}

SwiftUI: .fullScreenCover मॉडिफायर

SwiftUI पूर्ण-स्क्रीन मोडल विंडो के घोषणात्मक निर्माण के लिए .fullScreenCover मॉडिफायर प्रदान करता है। .sheet (Page Sheet) के विपरीत, .fullScreenCover समान व्यवहार के साथ .fullScreen शैली बनाता है: पूर्ण कंटेंट कवरेज और कोई स्वाइप बंद नहीं।

Binding और डेटा के साथ उपयोग

मॉडिफायर Bool या एक ऐप्शनल पहचाने योग्य ऐटम में binding स्वीकार करता है। जब binding true पर सेट होती है, SwiftUI पूर्ण-स्क्रीन विंडो की उपस्थिति को एनिमेट करता है। डेटा पासिंग के लिए onDismiss पैरामीटर और कंटेंट के साथ एक क्लोजर का उपयोग किया जाता है। \.dismiss पर्यावरण मान मोडल विंडो को अंदर से बंद करने की अनुमति देता है।

Full Screen Cover बनाम Sheet

SwiftUI में .fullScreenCover और .sheet के बीच चुनाव UIKit के समान है: .fullScreenCover इमर्सिव कंटेंट के लिए, .sheet कार्ड के लिए। SwiftUI स्वचालित रूप से सही बंद व्यवहार का चयन करता है: .sheet को स्वाइप से बंद किया जा सकता है, .fullScreenCover को केवल प्रोग्रामेटिक्ली। मॉडिफायर को एक View पति में जोड़ा जा सकता है।

struct CameraView: View {
    @State private var showCamera = false

    var body: some View {
        Button("कैमरा खोलें") {
            showCamera = true
        }
        .fullScreenCover(isPresented: $showCamera) {
            CameraPreviewView()
                .ignoresSafeArea()
        }
    }
}

struct CameraPreviewView: View {
    @Environment(\.dismiss) private var dismiss

    var body: some View {
        ZStack {
            Color.black.ignoresSafeArea()
            VStack {
                Spacer()
                Button("कैप्चर करें") { dismiss() }
                    .foregroundColor(.white)
            }
        }
    }
}

कस्टम एनिमेशन और ट्रांजिशन

Full Screen Cover UIKit में UIModalTransitionStyle के माध्यम से और SwiftUI में कस्टम ट्रांजिशन के माध्यम से कस्टम एनिमेशन का समर्थन करता है। मानक शैलियों में शामिल हैं: .coverVertical (नीचे से ऊपर), .crossDissolve (धीरे-धीरे प्रकट होना), .flipHorizontal (पलटना) और .partialCurl (पृष्ठ प्रभाव)।

UIKit: UIViewControllerAnimatedTransitioning

पूर्ण रूप से कस्टम एनिमेशन के लिए, UIViewControllerAnimatedTransitioning प्रोटोकॉल को लागू करें। यह animateTransition(using:) मेथड के माध्यम से एनिमेशन की अवधि और ट्रांजिशन को परिभाषित करने की अनुमति देता है। एनिमेशन कंट्रोलर UINavigationControllerDelegate या UIViewControllerTransitioningDelegate के माध्यम से निर्दिष्ट किया जाता है।

SwiftUI: Matched Geometry Effect

SwiftUI में, .fullScreenCover के लिए कस्टम ट्रांजिशन matchedGeometryEffect के माध्यम से बनाए जाते हैं। यह मॉडिफायर एक तत्व को मूल View से पूर्ण-स्क्रीन विंडो में ले जाने की एनिमेशन करता है। उदाहरण के लिए, फ़ोटो थम्ननैल पर टाप करने पर यह धीरे-धीरे पूर्ण-स्क्रीन में फैल जाता है, जो एक सतत्व प्रभाव पैदा करता है। MatchedGeometryEffect id और namespace के साथ काम करता है जो तत्व को स्रोत और गंतव्य स्थितियों में जोड़ते हैं।

struct PhotoViewer: View {
    @State private var selectedPhoto: String?
    @Namespace private var animation

    var body: some View {
        HStack {
            ForEach(["photo1", "photo2"], id: \.self) { photo in
                Image(photo)
                    .matchedGeometryEffect(id: photo, in: animation)
                    .onTapGesture { selectedPhoto = photo }
            }
        }
        .fullScreenCover(item: $selectedPhoto) { photo in
            Image(photo)
                .matchedGeometryEffect(id: photo, in: animation)
                .ignoresSafeArea()
        }
    }
}

Full Screen Cover कब उपयोग करें?

Full Screen Cover उन परिदृश्यों के लिए अनुशंसित है जहाँ कंटेंट को पैरेंट इंटरफ़ेस से विचलन के बिना पूरी स्क्रीन पर रहना چاہिए। Apple HIG तीन मुख्य श्रेणियों की पहचान करता है: मीडिया कंटेंट, कंटेंट निर्माण उपकरण और अस्थायी सिस्टम इंटरफ़ेस।

मीडिया और मनोरंजन

वीडियो प्लेयर, फ़ोटो देखना, PDF और कॉमिक्स पढ़ना Full Screen Cover के विशिष्ट उपयोग मामले हैं। iOS में AVPlayerViewController लैंडस्केप पर जाने पर स्वचालित रूप से पूर्ण-स्क्रीन मोड का उपयोग करता है। Adobe Lightroom जैसे फ़ोटो एडिटर फ़ोटो लाइब्रेरी के ऊपर पूर्ण-स्क्रीन एडिटर खोलते हैं।

कंटेंट निर्माण उपकरण

कैमरा, दस्तावेज़ स्कैनर, वॉइस रिकॉर्डिंग — उपयोगकर्ता के पूर्ण ध्यान की आवश्यकता वाले कार्य। UIImagePickerController iOS 14 से पहले कैमरा के लिए Full Screen Cover का उपयोग करता था। iOS 14 से शुरू करके, सिस्टम पाइकर Page Sheet का उपयोग करता है, लेकिन डिवेलपर कस्टम कैमरा के लिए जबरन .fullScreen सेट कर सकता है।

किससे बचें

Full Screen Cover का उपयोग इनके लिए न करें: रजिस्ट्रेशन फ़ॉर्म (Page Sheet बेहतर है), टेक्स्ट इनपुट वाली स्क्रीनें जहाँ पैरेंट पृष्ठ संदर्भ महत्वपूर्ण है, और मोडल विंडो के अंदर अनुक्रमिक नेविगेशन। Material Design सिस्टम बैक बटन को ब्लॉक करने से बचने की भी सिफ़ारिश करता है — iOS में यह स्वीकार्य है, लेकिन उपयोगकर्ता के पास UI तत्व के माध्यम से बंद करने का एक स्पष्ट तरीका होना چاہिए।