2016-04-06 10 views
7

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

enter image description here

मैं गतिशील तालिका दृश्य कक्ष में एक UIStackView को UIImageViews जोड़कर यह करने के लिए कोशिश कर रहा हूँ। मैं एक यूआईएसटीएक्स व्यू का उपयोग संरेखण सेट के साथ "भरने" और वितरण को "समान दूरी" पर सेट करने के साथ कर रहा हूं, यह विचार यह है कि स्टैक व्यू समान रूप से आइकन को स्थानांतरित करेगा चाहे इससे कोई फर्क नहीं पड़ता।

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

यहां कोड है जिसे मैं गतिशील रूप से सेल में UIImageViews जोड़ने की कोशिश करने के लिए उपयोग कर रहा हूं। नोट amenities मेरी छवि संपत्ति फ़ोल्डर में माउस के नाम के बराबर तार की एक सरणी है:

 cell.stackView.backgroundColor = UIColor.greenColor() 
     var i = 0 
     while (i < amenities.count && i < 4) { 
      if (i < 3) { 
       let imageView = UIImageView(image: UIImage(named: amenities[i])) 
       imageView.contentMode = .ScaleAspectFit 
       imageView.translatesAutoresizingMaskIntoConstraints = false 
       imageView.backgroundColor = UIColor.blueColor() 

       // Add size constraints to the image view 
       let widthCst = NSLayoutConstraint(item: imageView, attribute: NSLayoutAttribute.Width, relatedBy: .Equal, toItem: nil, attribute: .NotAnAttribute, multiplier: 1.0, constant: 50) 
       imageView.addConstraint(widthCst) 

       // Add image view to stack view 
       cell.stackView.addSubview(imageView) 
      } else { 
       // Add a label to the stack view if there are more than three amenities 
       let label = UILabel() 
       label.text = "\(amens.count - i) more" 
       label.textAlignment = NSTextAlignment.Left 
       cell.stackView.addSubview(label) 
      } 
      i++ 
     } 

छवि विचारों की पृष्ठभूमि नीले और स्टैक दृश्य की पृष्ठभूमि का रंग हरा है।

enter image description here

ऐसा लगता है कि सभी छवि विचारों स्क्रीन के बाईं ओर एक दूसरे के ऊपर धकेल दिया जा रहा है: यहाँ जहां घर तीन सुविधाओं है एक मामले के लिए, परिणाम है। वे सेल के सामग्री दृश्य को ऊपर से नीचे तक भरते हैं, भले ही स्टैक व्यू सामग्री दृश्य मार्जिन पर पिन किया गया हो। दृष्टि में कोई हरा नहीं है, इसलिए ऐसा लगता है कि स्टैक व्यू सेल के मार्जिन पर पिन नहीं किया गया है।

कोई विचार क्या गलत है?

+2

'addArrangedSubview' – dan

उत्तर

22

जैसा कि दान ने टिप्पणियों में कहा था, addArrangedSubview का उपयोग एक सबव्यू जोड़ने के लिए करें जो स्वचालित रूप से UIStackView द्वारा निर्धारित किया जाएगा।

नोट, हालांकि: यदि आप UIStackView पर arrangedSubviews सरणी से कोई दृश्य हटाते हैं, तो यह अभी भी एक सबव्यूव है। UIStackView दस्तावेज़ीकरण से:

स्टैक व्यू यह सुनिश्चित करता है कि इसकी व्यवस्था की गई सबव्यूब्स संपत्ति हमेशा इसकी उप-संपत्ति संपत्ति का सबसेट है। विशेष रूप से, स्टैक व्यू निम्नलिखित नियमों को लागू करता है:

• जब स्टैक व्यू अपनी व्यवस्थित दृश्य दृश्य सरणी में एक दृश्य जोड़ता है, तो यह उस दृश्य को सबव्यूव के रूप में भी जोड़ता है, अगर यह पहले से नहीं है।

• जब स्टैक व्यू से कोई सबव्यू हटा दिया जाता है, तो स्टैक व्यू इसे व्यवस्थित सबव्यूज़ सरणी से हटा देता है।

• व्यवस्थित दृश्य दृश्य से दृश्य को हटाने से इसे सबव्यूव के रूप में नहीं हटाया जाता है। स्टैक व्यू अब दृश्य के आकार और स्थिति का प्रबंधन नहीं करता है, लेकिन दृश्य अभी भी दृश्य पदानुक्रम का हिस्सा है, और यदि यह दिखाई दे रहा है तो स्क्रीन पर प्रस्तुत किया जाता है।

दस्तावेज़ीकरण से शुरू करना हमेशा एक अच्छा विचार है।

+2

का उपयोग करें दस्तावेज़ से नोट करने के लायक भी: "UIStackView UIView का एक गैर-प्रस्तुत करने वाला उप-वर्ग है। यह अपने स्वयं के किसी भी यूजर इंटरफेस प्रदान नहीं करता है। इसके बजाए, यह सिर्फ अपने व्यवस्थित विचारों की स्थिति और आकार का प्रबंधन करता है। नतीजतन, कुछ गुण (जैसे पृष्ठभूमि रंग) स्टैक व्यू पर कोई प्रभाव नहीं पड़ता है। "यही कारण है कि केसीस्ट्रिक्स उसकी हरी पृष्ठभूमि नहीं देखता है। –

+0

धन्यवाद @robmayoff! मैं वास्तव में दस्तावेज़ों में अब तक नहीं मिला था। मुझ पर शर्म की बात है! –

+0

देरी प्रतिक्रिया के लिए मेरी माफ़ी! आखिर में ऐप पर वापस आने का समय था और इसे आजमाएं। पूरी तरह से काम किया! धन्यवाद! उपयोगी नोट के लिए @robmayoff के लिए भी धन्यवाद। – kcstricks

संबंधित मुद्दे