Xcode 9 का सुरक्षित क्षेत्र

Question

इंटरफ़ेस बिल्डरों पर Xcode9 बीटा पाया सुरक्षित क्षेत्र की खोज करते समय पदानुक्रम दर्शक देखें। जिज्ञासु हो गए और सेब के प्रलेखन पर सुरक्षित क्षेत्र के बारे में जानने की कोशिश की, डॉक में कहा गया है "दृश्य क्षेत्र जो सीधे ऑटो लेआउट के साथ बातचीत करता है" लेकिन यह मुझे संतुष्ट नहीं करता था, मैं इस नई चीज के व्यावहारिक उपयोग को जानना चाहता हूं।

क्या किसी के पास कोई सुराग है?

सुरक्षित क्षेत्र के लिए Apple डॉक से निष्कर्ष पैराग्राफ।

UILayoutGuide वर्ग को डमी विचारों द्वारा पहले किए गए सभी कार्यों को करने के लिए डिज़ाइन किया गया है, लेकिन इसे अधिक सुरक्षित तरीके से करने के लिए। लेआउट गाइड एक नए दृश्य को परिभाषित नहीं करते हैं। वे पदानुक्रम के दृश्य में भाग नहीं लेते हैं। इसके बजाय, वे बस अपने स्वयं के दृश्य समन्वय प्रणाली में एक आयताकार क्षेत्र को परिभाषित करते हैं जो ऑटो लेआउट के साथ बातचीत कर सकते हैं।

Comments

आप डब्ल्यूडब्ल्यूडीसी सत्र देख सकते हैं। वहां सब कुछ समझाया गया है। मैं नाम के बारे में निश्चित नहीं हूं। इसके नाम में Xcode या InterfaceBuilder के साथ कुछ।

— माक ६३

WWDC17 # 204 पर एक नज़र डालें - iOS 11 के लिए अपने ऐप को अपडेट करना और WWDC17 # 412 - इंटरफ़ेस बिल्डर में ऑटो लेआउट तकनीक

— nathan

Answer 1

सेफ एरिया एक लेआउट गाइड ( सेफ एरिया लेआउट गाइड ) है ।
लेआउट मार्गदर्शिका आपके विचार के उस हिस्से का प्रतिनिधित्व करती है जो बार और अन्य सामग्री द्वारा अनबॉस्स्ड है। IOS 11+ में, Apple शीर्ष और निचले लेआउट गाइडों को हटा रहा है और उन्हें एक ही सुरक्षित क्षेत्र लेआउट गाइड के साथ बदल रहा है।

जब दृश्य ऑनस्क्रीन दिखाई देता है, तो यह मार्गदर्शिका दृश्य के उस हिस्से को दर्शाती है जो अन्य सामग्री द्वारा कवर नहीं किया गया है। किसी दृश्य का सुरक्षित क्षेत्र नेविगेशन बार, टैब बार, टूलबार और अन्य पूर्वजों द्वारा कवर किए गए क्षेत्र को दर्शाता है जो एक दृश्य नियंत्रक के दृश्य को अस्पष्ट करते हैं। (टीवीओएस में, सुरक्षित क्षेत्र स्क्रीन के बेज़ेल को शामिल करता है, जैसा कि overscanCompensationInsetsयूआईस्क्रीन की संपत्ति द्वारा परिभाषित किया गया है ।) यह व्यू कंट्रोलर की additionalSafeAreaInsetsसंपत्ति द्वारा परिभाषित किसी भी अतिरिक्त स्थान को भी कवर करता है। यदि दृश्य वर्तमान में दृश्य पदानुक्रम में स्थापित नहीं है, या अभी तक ऑनस्क्रीन दिखाई नहीं दे रहा है, तो लेआउट गाइड हमेशा दृश्य के किनारों से मेल खाता है।

कंट्रोलर के मूल दृश्य के लिए, इस गुण में सुरक्षित क्षेत्र दृश्य नियंत्रक की सामग्री के पूरे भाग का प्रतिनिधित्व करता है जो अस्पष्ट है, और आपके द्वारा निर्दिष्ट कोई अतिरिक्त इनसेट्स। दृश्य पदानुक्रम में अन्य विचारों के लिए, सुरक्षित क्षेत्र केवल उस दृश्य के हिस्से को दर्शाता है जो अस्पष्ट है। उदाहरण के लिए, यदि कोई दृश्य पूरी तरह से अपने दृश्य नियंत्रक के मूल दृश्य के सुरक्षित क्षेत्र के भीतर है, तो इस संपत्ति में किनारे वाले इंसर्ट 0 हैं।

Apple के अनुसार, Xcode 9 - रिलीज़ नोट
इंटरफ़ेस बिल्डर UIViewController में पदावनत शीर्ष और निचला लेआउट गाइड के प्रतिस्थापन के रूप में UIView.safeAreaLayoutGuide का उपयोग करता है। नए सुरक्षित क्षेत्र का उपयोग करने के लिए, दृश्य नियंत्रक के लिए फ़ाइल निरीक्षक में सुरक्षित क्षेत्र लेआउट मार्गदर्शिकाएँ चुनें और फिर अपनी सामग्री और नए सुरक्षित क्षेत्र लंगर के बीच बाधाओं को जोड़ें। यह आपकी सामग्री को ऊपर और नीचे की सलाखों से और टीवीओएस पर ओवरस्कैन क्षेत्र द्वारा अस्पष्ट होने से बचाता है। आईओएस के पुराने संस्करणों में तैनात होने पर सुरक्षित क्षेत्र की बाधाएं टॉप और बॉटम में बदल जाती हैं।

---

मौजूदा (टॉप एंड बॉटम) लेआउट गाइड और सेफ एरिया लेआउट गाइड के बीच तुलना (समान दृश्य प्रभाव बनाने के लिए) के रूप में यहां सरल संदर्भ है।

सुरक्षित क्षेत्र लेआउट:

autolayout

---

सुरक्षित क्षेत्र लेआउट के साथ कैसे काम करें?

समाधान खोजने के लिए इन चरणों का पालन करें:

• सक्षम नहीं होने पर 'सुरक्षित क्षेत्र लेआउट' को सक्षम करें।
• यदि वे सुपर व्यू के साथ संबंध दिखाते हैं और सभी को सुरक्षित लेआउट एंकर के साथ फिर से जोड़ते हैं, तो 'सभी बाधा' निकालें । या एक बाधा पर डबल क्लिक करें और सुपर व्यू से SafeArea लंगर के लिए कनेक्शन संपादित करें

यहाँ नमूना स्नैपशॉट है, कैसे सुरक्षित क्षेत्र लेआउट को सक्षम करें और बाधा को संपादित करें।

यहाँ उपरोक्त परिवर्तनों का परिणाम है

---

SafeArea के साथ लेआउट डिज़ाइन
जब iPhone X के लिए डिज़ाइन किया जाता है , तो आपको यह सुनिश्चित करना होगा कि लेआउट स्क्रीन को भर दें और डिवाइस के गोल कोनों, सेंसर हाउसिंग या होम स्क्रीन तक पहुँचने के लिए संकेतक द्वारा अस्पष्ट न हों।

अधिकांश एप्लिकेशन जो मानक, सिस्टम-प्रदान किए गए यूआई तत्वों जैसे नेविगेशन बार, टेबल और संग्रह का उपयोग करते हैं, स्वचालित रूप से डिवाइस के नए फॉर्म फैक्टर के अनुकूल होते हैं। पृष्ठभूमि सामग्री प्रदर्शन के किनारों तक फैली हुई है और यूआई तत्व उचित रूप से इनसेट और तैनात हैं।

कस्टम लेआउट वाले ऐप्स के लिए, iPhone X का समर्थन करना अपेक्षाकृत आसान होना चाहिए, खासकर यदि आपका ऐप ऑटो लेआउट का उपयोग करता है और सुरक्षित क्षेत्र और मार्जिन लेआउट गाइड का पालन करता है।

---

यहाँ नमूना कोड है (Ref: सेफ़ एरिया लेआउट गाइड ) :
यदि आप कोड में अपनी बाधाएँ बनाते हैं तो संबंधित लेआउट एंकर प्राप्त करने के लिए UIVIV की सुरक्षित संपत्ति का उपयोग करें। आइए कोड में उपरोक्त इंटरफ़ेस बिल्डर उदाहरण को फिर से बनाएँ, यह देखने के लिए कि यह कैसा दिखता है:

मान लें कि हमारे पास हमारे दृश्य नियंत्रक में एक संपत्ति के रूप में हरा दृश्य है:

private let greenView = UIView()

हमारे पास व्यूडलडड से कहे जाने वाले विचारों और बाधाओं को स्थापित करने के लिए एक समारोह हो सकता है:

private func setupView() {
  greenView.translatesAutoresizingMaskIntoConstraints = false
  greenView.backgroundColor = .green
  view.addSubview(greenView)
}

हमेशा रूट दृश्य के लेआउटमार्गेगाइड का उपयोग करते हुए अग्रणी और अनुगामी मार्जिन बाधाओं को बनाएं:

 let margins = view.layoutMarginsGuide
    NSLayoutConstraint.activate([
      greenView.leadingAnchor.constraint(equalTo: margins.leadingAnchor),
      greenView.trailingAnchor.constraint(equalTo: margins.trailingAnchor)
 ])

अब जब तक आप iOS 11 को लक्षित नहीं कर रहे हैं, तब तक आपको केवल # iOS के साथ सुरक्षित क्षेत्र लेआउट गाइड बाधाओं को लपेटने और पिछले iOS संस्करणों के लिए ऊपर और नीचे लेआउट गाइडों पर गिरने की आवश्यकता होगी:

if #available(iOS 11, *) {
  let guide = view.safeAreaLayoutGuide
  NSLayoutConstraint.activate([
   greenView.topAnchor.constraintEqualToSystemSpacingBelow(guide.topAnchor, multiplier: 1.0),
   guide.bottomAnchor.constraintEqualToSystemSpacingBelow(greenView.bottomAnchor, multiplier: 1.0)
   ])

} else {
   let standardSpacing: CGFloat = 8.0
   NSLayoutConstraint.activate([
   greenView.topAnchor.constraint(equalTo: topLayoutGuide.bottomAnchor, constant: standardSpacing),
   bottomLayoutGuide.topAnchor.constraint(equalTo: greenView.bottomAnchor, constant: standardSpacing)
   ])
}

परिणाम:

---

UIViewविस्तार के बाद , सुरक्षित रूप से सुरक्षित रूप से प्रोग्राम के साथ काम करना आपके लिए आसान हो जाता है।

extension UIView {

  // Top Anchor
  var safeAreaTopAnchor: NSLayoutYAxisAnchor {
    if #available(iOS 11.0, *) {
      return self.safeAreaLayoutGuide.topAnchor
    } else {
      return self.topAnchor
    }
  }

  // Bottom Anchor
  var safeAreaBottomAnchor: NSLayoutYAxisAnchor {
    if #available(iOS 11.0, *) {
      return self.safeAreaLayoutGuide.bottomAnchor
    } else {
      return self.bottomAnchor
    }
  }

  // Left Anchor
  var safeAreaLeftAnchor: NSLayoutXAxisAnchor {
    if #available(iOS 11.0, *) {
      return self.safeAreaLayoutGuide.leftAnchor
    } else {
      return self.leftAnchor
    }
  }

  // Right Anchor
  var safeAreaRightAnchor: NSLayoutXAxisAnchor {
    if #available(iOS 11.0, *) {
      return self.safeAreaLayoutGuide.rightAnchor
    } else {
      return self.rightAnchor
    }
  }

}

---

यहाँ उद्देश्य-सी में नमूना कोड है :

• प्रोग्रामेटिक रूप से सुरक्षित क्षेत्र कैसे जोड़ें

---

यहाँ सुरक्षित क्षेत्र लेआउट गाइड के लिए Apple डेवलपर आधिकारिक दस्तावेज है

IPhone-X के लिए उपयोगकर्ता इंटरफ़ेस डिज़ाइन को संभालने के लिए सुरक्षित क्षेत्र आवश्यक है। सुरक्षित क्षेत्र लेआउट का उपयोग करके iPhone-X के लिए उपयोगकर्ता इंटरफ़ेस कैसे डिज़ाइन करें, इसके लिए बुनियादी दिशानिर्देश है

Comments

के बीच के अंतर के रूप में marginsऔर view.leadingAnchor: जब आप उपयोग करते हैं let margins = view.layoutMarginsGuideऔर बाद में उपयोग करते हैं margins.leadingAnchor, तो आप दृश्य को हाशिये पर देखने के लिए विवश कर रहे हैं । यह पक्षों में कुछ अतिरिक्त स्थान जोड़ देगा। यदि आप ऐसा नहीं चाहते हैं, तो बस उपयोग करें view.leadingAnchorऔर view.trailingAnchorआपको बाईं या दाईं ओर कोई भी सफेद स्थान दिखाई नहीं देगा ...

— Honey

"एक दृश्य का सुरक्षित क्षेत्र नेविगेशन बार, टैब बार, टूलबार और अन्य पूर्वजों द्वारा कवर किया गया क्षेत्र दर्शाता है जो एक दृश्य नियंत्रक के दृश्य को अस्पष्ट करता है" क्या आपका मतलब कवर नहीं है? दस्तावेज़ में कहा गया है " सलाखों और अन्य सामग्री द्वारा बिना पढ़ा हुआ।"

— हनी

मैंने Xcode 10.1 में एक अजीब व्यवहार देखा है, जहां सुरक्षित क्षेत्र पूर्ण स्क्रीन पर स्क्रीन के निचले भाग तक विस्तृत नहीं होगा। मेरा मानना ​​है कि मैंने गलती से एक 'टैब बार' को नीचे तक खींच लिया और फिर इसे हटा दिया। मुझे यह लाइन .storyboard फ़ाइल में मिली जिसे मैंने मैन्युअल रूप से एक टेक्स्ट एडिटर के साथ डिलीट किया था। <simulatedToolbarMetrics कुंजी = "simulatedBottomBarMetrics" />। यह तय किया।

— डेव हबर्ड

Answer 2

मैं उल्लेख करना चाहते हैं कुछ है कि मुझे पहले पकड़ा जब मैं दौर किनारों और नए iPhone एक्स के "निशान" से बचने के लिए एक SpriteKit आधारित एप्लिकेशन अनुकूल करने के लिए कोशिश कर रहा था, के रूप में नवीनतम ने सुझाव दिया ह्यूमन इंटरफ़ेस दिशानिर्देश नई संपत्ति: safeAreaLayoutGuideके UIViewलिए की जरूरत है एक सार्थक लेआउट फ्रेम की रिपोर्ट करने के लिए पदानुक्रम (उदाहरण के लिए, पर ) में जोड़ दिए जाने के बाद क्वियर किया जाना चाहिए -viewDidAppear:(अन्यथा, यह पूर्ण स्क्रीन आकार लौटाता है)।

संपत्ति के दस्तावेज से:

लेआउट मार्गदर्शिका आपके विचार के उस हिस्से का प्रतिनिधित्व करती है जो बार और अन्य सामग्री द्वारा अनबॉस्स्ड है। जब दृश्य ऑनस्क्रीन दिखाई देता है , तो यह मार्गदर्शिका दृश्य के उस हिस्से को दर्शाती है जो नेविगेशन बार, टैब बार, टूलबार और अन्य पूर्वजों के विचारों से कवर नहीं होती है। (टीवीओएस में, सुरक्षित क्षेत्र स्क्रीन के बेज़ल को कवर नहीं करने वाले क्षेत्र को दर्शाता है।) यदि दृश्य वर्तमान में दृश्य पदानुक्रम में स्थापित नहीं है, या अभी तक ऑनस्क्रीन दिखाई नहीं दे रहा है, तो लेआउट गाइड किनारे दृश्य के किनारों के बराबर हैं ।

(जोर मेरा)

यदि आप इसे जल्द से जल्द पढ़ते हैं -viewDidLoad:, layoutFrameतो मार्गदर्शक {{0, 0}, {375, 812}}की अपेक्षा के बजाय होगा{{0, 44}, {375, 734}}

Comments

मुझे भी। मैं हमेशा एक प्रकार के उपलब्ध गुणों पर कूदता हूं, केवल उनके नाम द्वारा निर्देशित, डॉक्स को पूरी तरह से पढ़े बिना ...

— निकोलस मारी

Answer 3

• इससे पहले iOS 7.011.0 में < Deprecated > topLayoutGuide और bottomLayoutGuideUIKit का उपयोग करता है जो कि संपत्ति हैUIView

• iOS11 + का उपयोग करता safeAreaLayoutGuide जो भी है UIViewसंपत्ति

• फ़ाइल इंस्पेक्टर से सुरक्षित क्षेत्र लेआउट गाइड चेक बॉक्स सक्षम करें ।

• सुरक्षित क्षेत्र आपके विचारों को समग्र इंटरफ़ेस के दृश्य भाग के भीतर रखने में मदद करते हैं।

• में tvOS , सुरक्षित क्षेत्र अपनी स्क्रीन का ओवरस्कैन सन्निवेश वाली है, जो क्षेत्र स्क्रीन के फलक के द्वारा कवर का प्रतिनिधित्व भी शामिल है।

• safeAreaLayoutGuide नेविगेशन बार, टैब बार, टूलबार और अन्य पूर्वजों के विचारों द्वारा कवर नहीं किए जाने वाले दृश्य के हिस्से को दर्शाता है।

• अपनी सामग्री जैसे UIButton आदि को बाहर करने के लिए एक सहायता के रूप में सुरक्षित क्षेत्रों का उपयोग करें ।

• IPhone X के लिए डिज़ाइन करते समय, आपको यह सुनिश्चित करना होगा कि लेआउट स्क्रीन को भर दें और डिवाइस के गोल कोनों, सेंसर हाउसिंग या होम स्क्रीन तक पहुँचने के लिए संकेतक द्वारा अस्पष्ट न हों।

• सुनिश्चित करें कि पृष्ठभूमि प्रदर्शन के किनारों तक फैली हुई है, और यह कि टेबल और संग्रह की तरह लंबवत स्क्रॉल किए गए लेआउट, नीचे तक सभी तरह से जारी है।

• अन्य iPhone की तुलना में iPhone X पर स्थिति पट्टी लंबी होती है। यदि आपका ऐप स्टेटस बार के नीचे पोजिशनिंग कंटेंट के लिए एक निश्चित स्टेटस बार की ऊँचाई को मानता है, तो आपको उपयोगकर्ता के डिवाइस के आधार पर डायनेमिकली पोज़िशन कंटेंट के लिए अपने ऐप को अपडेट करना होगा। ध्यान दें कि जब iPhone वॉयस रिकॉर्डिंग और लोकेशन ट्रैकिंग जैसे पृष्ठभूमि के कार्य सक्रिय होते हैं, तो iPhone X पर स्थिति पट्टी ऊंचाई नहीं बदलती है print(UIApplication.shared.statusBarFrame.height)//44 for iPhone X, 20 for other iPhones

• होम इंडिकेटर कंटेनर की ऊंचाई 34 अंक है।

• एक बार जब आप सुरक्षित क्षेत्र लेआउट गाइड को सक्षम कर लेते हैं, तो आप इंटरफ़ेस बिल्डर में सूचीबद्ध सुरक्षित क्षेत्र बाधाओं को देख सकते हैं।

आप इस तरह से संबंधित बाधाओं को सेट कर सकते self.view.safeAreaLayoutGuideहैं-

ObjC:

  self.demoView.translatesAutoresizingMaskIntoConstraints = NO;
    UILayoutGuide * guide = self.view.safeAreaLayoutGuide;
    [self.demoView.leadingAnchor constraintEqualToAnchor:guide.leadingAnchor].active = YES;
    [self.demoView.trailingAnchor constraintEqualToAnchor:guide.trailingAnchor].active = YES;
    [self.demoView.topAnchor constraintEqualToAnchor:guide.topAnchor].active = YES;
    [self.demoView.bottomAnchor constraintEqualToAnchor:guide.bottomAnchor].active = YES;

स्विफ्ट:

   demoView.translatesAutoresizingMaskIntoConstraints = false
        if #available(iOS 11.0, *) {
            let guide = self.view.safeAreaLayoutGuide
            demoView.trailingAnchor.constraint(equalTo: guide.trailingAnchor).isActive = true
            demoView.leadingAnchor.constraint(equalTo: guide.leadingAnchor).isActive = true
            demoView.bottomAnchor.constraint(equalTo: guide.bottomAnchor).isActive = true
            demoView.topAnchor.constraint(equalTo: guide.topAnchor).isActive = true
        } else {
            NSLayoutConstraint(item: demoView, attribute: .leading, relatedBy: .equal, toItem: view, attribute: .leading, multiplier: 1.0, constant: 0).isActive = true
            NSLayoutConstraint(item: demoView, attribute: .trailing, relatedBy: .equal, toItem: view, attribute: .trailing, multiplier: 1.0, constant: 0).isActive = true
            NSLayoutConstraint(item: demoView, attribute: .bottom, relatedBy: .equal, toItem: view, attribute: .bottom, multiplier: 1.0, constant: 0).isActive = true
            NSLayoutConstraint(item: demoView, attribute: .top, relatedBy: .equal, toItem: view, attribute: .top, multiplier: 1.0, constant: 0).isActive = true
        }

Comments

मुझे यह बुलेट पॉइंट गाइड बहुत उपयोगी लगता है, लेकिन "सुरक्षित क्षेत्र नेविगेशन बार, टैब बार, टूलबार और अन्य पूर्वजों के विचारों को शामिल नहीं करता है" क्या वास्तव में इसका मतलब है?

— Chewie The Chorkie

उदाहरण - जैसा कि ऊपर के स्क्रीन टूलबार (आज, कैलेंडर और इनबॉक्स) में है, जो सेफरेग्यूइड द्वारा कवर नहीं किया गया है

— जैक

Answer 4

Apple ने topLayoutGuide और bottomLayoutGuide को iOS 7 में UIViewController तरीके के गुणों के रूप में पेश किया। उन्होंने आपको अपनी सामग्री को स्थिति, नेविगेशन या टैब बार जैसे UIKit बार से छिपाकर रखने के लिए बाधा बनाने की अनुमति दी। ये लेआउट गाइड iOS 11 में पदावनत किए गए हैं और उनकी जगह एक सुरक्षित क्षेत्र लेआउट गाइड लिया गया है।

अधिक जानकारी के लिए लिंक देखें ।

Answer 5

सेफ एरिया लेआउट गाइड कंटेंट और कंट्रोल को पोजिशन करते समय सिस्टम UI तत्वों को रेखांकित करने में मदद करता है।

सुरक्षित क्षेत्र सिस्टम UI तत्वों के बीच का क्षेत्र है जो स्टेटस बार, नेविगेशन बार और टूल बार या टैब बार हैं। इसलिए जब आप अपने ऐप में स्टेटस बार जोड़ते हैं, तो सेफ एरिया सिकुड़ जाता है। जब आप अपने ऐप में एक नेविगेशन बार जोड़ते हैं, तो सुरक्षित क्षेत्र फिर से सिकुड़ जाता है।

IPhone X पर, सुरक्षित क्षेत्र चित्र में ऊपर और नीचे स्क्रीन किनारों से अतिरिक्त इनसेट प्रदान करता है, यहां तक ​​कि जब कोई बार नहीं दिखाया गया है। परिदृश्य में, सेफ एरिया स्क्रीन के किनारों और होम इंडिकेटर से अलग है।

यह iPhone X के लिए Apple के वीडियो डिजाइनिंग से लिया गया है जहां वे यह भी कल्पना करते हैं कि विभिन्न तत्व सेफ एरिया को कैसे प्रभावित करते हैं।