autolayout - आधी पर्यवेक्षणीय ऊंचाई के सापेक्ष दृश्य की ऊंचाई बनाएं


136

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

अब, मैं अपने जीवन के लिए नहीं देख सकता कि यह कैसे करना है। जब मैं इसे स्थापित करने का प्रयास करता हूं तो मुझे यहां मिलता है:

ऑटोलॉययट ब्लूज़

नीचे का स्थान अवरोध "284 के बराबर" पर सेट है, जो iPhone4 लेआउट में बदलने पर मेरे लिए निरपेक्ष और बिल्कुल बेकार है, क्योंकि यह स्क्रीन के निचले भाग में 284 अंक रखता है, और दृश्य को अब आधे तक नहीं सिकोड़ता है स्क्रीन का आकार। और उस बाधा को किसी अन्य दृश्य की ऊंचाई के कुछ अंश के बराबर स्थापित करने का कोई तरीका नहीं है।

कुछ समय तक संघर्ष करने के बाद, जिस तरह से मैं ऐसा करने के बारे में सोच सकता हूं वह इस दृश्य के नीचे एक और दृश्य पेश करना होगा, उनकी ऊंचाइयों को समान रूप से पिन करना होगा, उन्हें एक दूसरे के ऊपर और नीचे बैठना होगा और फिर अदृश्य होने के लिए दूसरा (नीचे) दृश्य सेट करना होगा .. जो थोड़ा बदसूरत लगता है!

क्या मुझसे साफ़ - साफ़ कुछ चीज़ चूक रही है?..


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

जवाबों:


167

यह अब IB में [कम से कम] Xcode 5.1.1 के रूप में संभव है। हालांकि मुझे यह पता लगाने में कुछ समय लगा कि यह वास्तव में सुपर सरल है:

पहले एक मूल शीर्ष संरेखण बाधा बनाएं (आपको सामान्य की तरह, नीचे, बाएं और दाएं अवरोधों को भी सेटअप करना होगा)। फिर बाधा का चयन करें और गुण निरीक्षक को नेविगेट करें :

ऊपर दिए गए चरणों का प्रदर्शन

फिर आप गुणक को समायोजित कर सकते हैं। यदि आप चाहते हैं कि सुपर व्यू का 50% इसे छोड़ दें 1, क्योंकि यह सुपर के केंद्र के अनुसार संरेखित है। यह उन विचारों को बनाने का एक शानदार तरीका है जो अन्य प्रतिशत भी हैं (जैसे सुपर व्यू का 25%)

ऊपर दूसरे चरण का प्रदर्शन


अच्छा :) मुझे लगता है कि इस पोस्ट को स्वीकृत उत्तर के रूप में चिह्नित किया जाना चाहिए :) iOS डेवलपर अक्सर कोड जैसे समाधान के बजाय इंटरफ़ेस बिल्डर समाधान पसंद करते हैं
hqt

@hqt, धन्यवाद। मुझे लगता है कि जब स्वीकृत उत्तर लिखा गया था तो यह विधि उपलब्ध नहीं थी। कभी-कभी पूछने वाले पुराने प्रश्नों को फिर से नहीं मानते हैं या स्वीकृत उत्तर को बदलने के लिए देखभाल नहीं करते हैं। लेकिन अंत में मैं सिर्फ यहाँ मदद करने के लिए हूँ, खुशी है कि यह किया!
फिरोज़

3
मैं थोड़ा उलझन में हूँ। मैंने यह कोशिश की, लेकिन यह सिर्फ पर्यवेक्षण के लिए दृश्य को केंद्र में रखता है, यह दृश्य की ऊंचाई को समायोजित नहीं करता है।
डीन

@ डीन, आपको यह सुनिश्चित करने की आवश्यकता है कि First Itemऐसा View.Topनहीं है View.Center Y। अन्यथा, हाँ, यह सिर्फ इसे केन्द्रित करेगा। आपको यह भी सुनिश्चित करने की आवश्यकता होगी कि दृश्य के अन्य किनारों को संभालने के लिए अन्य बाधाओं को ठीक से सेट किया गया है।
फीरोज

1
View.Top Superview.Center के बराबर है Y गुणक 1 आपको कोई ऊंचाई नहीं देता है। यह उत्तर अधूरा है। आपको बस इतना सोचना है कि आप क्या कह रहे हैं और आप देख सकते हैं कि यह आपको पूरे केंद्र में एक लाइन देता है! मैं इस जवाब को यह स्पष्ट करने के लिए संपादित करूंगा कि आप किन अन्य बाधाओं के बारे में बात कर रहे हैं।
स्माइलबोट

184

स्टोरीबोर्ड समाधान जहां आप किसी भी दृश्य के बीच सटीक अनुपात सेट कर सकते हैं:

ऊंचाई समानता की बाधा निर्धारित करें

अभी:

बाधा के गुणक को संपादित करें

फायदा!!!

परिणाम

PS यह भी ध्यान दें कि यह विधि विभिन्न घोंसले के स्तर पर विचारों के साथ काम करती है और (जाहिर है) चौड़ाई के लिए लागू होती है

पीपीएस कभी-कभी यह बाधा के "पहले और दूसरे आइटम को उलटने" या रिवर्स मल्टीप्लायर (उदाहरण के लिए 0.5 के बजाय 2) के लिए सहायक हो सकता है (लेकिन ये तरीके सहायक नहीं हैं यदि आप समझ नहीं पाते हैं कि विचार एक दूसरे के बीच कैसे संबंधित हैं)।


1
चरण 2 मेरे लिए काम नहीं करता है। मैं 'मार्जिन से बाधा' को छोड़कर पैनल में कुछ भी नहीं चुन सकता। मैं UITableViewCell में UIImageView की चौड़ाई को 50% सामग्री दृश्य में सेट करने का प्रयास कर रहा हूं।
DrMickeyLauer

2
अद्यतन: स्पष्ट रूप से इंटरफ़ेस बिल्डर सामग्री दृश्य को किसी भी ऑटो लेआउट बाधाओं का स्पष्ट लक्ष्य होने की अनुमति नहीं देता है। मुझे इस कार्य को करने के लिए सामग्री दृश्य के बच्चे के रूप में एक डमी सबव्यू डालना है।
DrMickeyLauer 19

1
इससे मेरा काम बनता है। आपको बिल्डर स्क्रीन नहीं लिस्टिंग में दो विचारों का चयन करने की आवश्यकता है। प्रतिशत के लिए गुणक मान को छोटा करने के लिए बड़े दृश्य से छोटे दृश्य को विभाजित करें उदाहरण के लिए छोटा दृश्य 25, बड़ा दृश्य 135 - 25/135 = 0.185। इसे मल्टीप्लायर मूल्य के रूप में सेट करें ताकि यह देखने के लिए कि X1 और x2 = 25 पर बड़े 6 और 6 प्लस आदि के साथ स्केल करें
latenitecoder

1
यह मेरे लिए काम करता है, लेकिन कृपया ध्यान दें कि मुझे तीन अवरोधों को भी जोड़ना था जो कि
सबवे

यह स्वीकृत उत्तर होना चाहिए। पहले मैं स्वीकृत उत्तर का प्रयास करता हूं। यह काम नहीं किया तो मैं नीचे स्क्रॉल करता हूं और मैंने यह उत्तर देखा और यह काम किया। धन्यवाद!
मिहिर ओझा

31

थोड़े और समय के बाद मैं निम्नलिखित के साथ आया हूँ।

मैं इसे एक उत्तर के रूप में देख रहा हूं, लेकिन यह बहुत संतोषजनक नहीं है, क्योंकि यह मानता है कि आप वास्तव में इंटरफ़ेस बिल्डर में ऐसा नहीं कर सकते, लेकिन सही बाधा को बाद में कोड में जोड़ा जा सकता है:

- (void) viewWillAppear:(BOOL)animated
{

    NSLayoutConstraint *constraint = [NSLayoutConstraint constraintWithItem:upperview
                                                                 attribute:NSLayoutAttributeHeight 
                                                                 relatedBy:0 
                                                                    toItem:self.view
                                                                 attribute:NSLayoutAttributeHeight
                                                                multiplier:.5 
                                                                  constant:0];
    [self.view addConstraint:constraint];

}

मूल रूप से, यह स्व.व्यू की ऊंचाई के मुकाबले 0.5 का गुणक सेट करता है, ऊपरवाला अभिनय करता है। मुझे आईबी में बॉटम वर्टिकल स्पेस कंस्ट्रक्शन की प्राथमिकता निर्धारित करनी पड़ी, साथ ही साथ बाधाओं को तोड़ने के बारे में रनटाइम संदेशों के एक समूह से बचने के लिए 1000 से कम किया गया।

तो अगर कोई यह बता सकता है कि इंटरफ़ेस बिल्डर में यह कैसे करना है, जो मेरे सवाल का बेहतर जवाब देगा, अन्यथा मुझे लगता है कि यह उतना ही अच्छा है जितना इसे (अभी के लिए) ???


3
मुझे लगता है कि यह अब जितना अच्छा है उतना अच्छा है। यह अच्छा होगा यदि Apple ने हमें IB में गुणक मूल्य तक पहुंच प्रदान की है, ताकि निरंतर के साथ-साथ सेट किया जा सके।
rdelmar

3
इस उत्तर को देखने वाले किसी के लिए, Xcode 5.1 अब आपको इंटरफ़ेस बिल्डर के माध्यम से गुणक सेट करने की अनुमति देता है। अब मैं उन विचारों को कॉन्फ़िगर करने में सक्षम हूं, जो आईबी के माध्यम से उनके पर्यवेक्षण की ऊंचाई से आधे हैं।
मार्क क्रेनेक 5'14

9

Fyodor Volchyok के उत्तर की तुलना में विधि की तुलना में थोड़ा आसान और अधिक सीधे आगे। -नियंत्रण बटन नीचे रखें और सबव्यू पर क्लिक करें। -इस कमांड बटन को दबाकर रखें, कर्सर को सुपरवाइवे पर खींचें और फिर सुपरवाइवे पर क्लिक करें। "पहलू अनुपात" का चयन करें।

यहां छवि विवरण दर्ज करें

-इसके बाद साइज इंस्पेक्टर पर क्लिक करें। -इसके बाद बाधक पर डबल क्लिक करें। यहां छवि विवरण दर्ज करें

-सुनिश्चित करें कि "ऊँचाई" दोनों वस्तुओं के लिए चुनी गई है। यहां छवि विवरण दर्ज करें

-फिर स्क्रीन के लिए "मल्टीप्लायर" को 0.5 में बदलें, या आपके द्वारा वांछित पर्यवेक्षण के कुछ अंश। यहां छवि विवरण दर्ज करें


आसान और त्वरित दृष्टिकोण! धन्यवाद दोस्त
अब्दुल्ला सईद

7

कोड में एक और संभावना यह भी है कि आपके पास 2 विचार हैं जो दोनों की ऊंचाई समान होनी चाहिए: बस view2 की ऊंचाई को view1 की ऊंचाई पर सेट करें (यहां ट्रिक view1 की ऊंचाई को स्पष्ट रूप से सेट नहीं कर रही है)।

    [self.view addConstraints:[NSLayoutConstraint
        constraintsWithVisualFormat:@"V:[topLayoutGuide]-0-[_view1]-0-[_view2(==_view1)]-0-[bottomLayoutGuide]"
                            options:0
                            metrics:nil
                              views:viewsDict]];

महसूस नहीं किया कि आप उस तरह की चौड़ाई / ऊंचाइयों के लिए अन्य विचारों का संदर्भ दे सकते हैं। यदि आप पहले से ही दृश्य प्रारूप भाषा में हैं तो यह सबसे साफ उत्तर IMO है।
लेशचग

@brainray का उदाहरण यहां डेवलपर.
apple.com

0

मेटे के उत्तर का स्विफ्ट संस्करण:

    override func viewDidLoad() {
    super.viewDidLoad()
    // Do any additional setup after loading the view, typically from a nib.



    upperView.translatesAutoresizingMaskIntoConstraints = false


    var constraint = NSLayoutConstraint(item: upperView,
                                        attribute: NSLayoutAttribute.top,
                                        relatedBy: NSLayoutRelation.equal,
                                        toItem: self.view,
                                        attribute: NSLayoutAttribute.top,
                                        multiplier: 1,
                                        constant: 0)

    self.view.addConstraint(constraint)


    constraint = NSLayoutConstraint(item: upperView,
                                    attribute: NSLayoutAttribute.height,
                                    relatedBy: NSLayoutRelation.equal,
                                    toItem: self.view,
                                    attribute: NSLayoutAttribute.height,
                                    multiplier: 0.5,
                                    constant: 0)

    self.view.addConstraint(constraint)


    constraint = NSLayoutConstraint(item: upperView,
                                    attribute: NSLayoutAttribute.leading,
                                    relatedBy: NSLayoutRelation.equal,
                                    toItem: self.view,
                                    attribute: NSLayoutAttribute.leading,
                                    multiplier: 1,
                                    constant: 0)

    self.view.addConstraint(constraint)


    constraint = NSLayoutConstraint(item: upperView,
                                    attribute: NSLayoutAttribute.trailing,
                                    relatedBy: NSLayoutRelation.equal,
                                    toItem: self.view,
                                    attribute: NSLayoutAttribute.trailing,
                                    multiplier: 1,
                                    constant: 0)

    self.view.addConstraint(constraint)


}
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.