ऑटोलायआउट

Question

के साथ नीचे दिए गए शीर्ष पर लेबल के साथ UIButton (UIButtonTypeCustom) बनाना और मैं & छवि (परिपत्र दिखाना है) के नीचे एक टेक्स्ट (सिंगल/मल्टी लाइन) के साथ बटन प्रदर्शित करने का प्रयास कर रहा हूं। शीर्ष; छवि पर & टेक्स्ट को हाइलाइट किया जाना चाहिए। इस तरह:

यहाँ viewDidLoad में कोड है:

btArtAndPainting = [UIButton buttonWithType:UIButtonTypeCustom]; 
btArtAndPainting.backgroundColor = [[UIColor cyanColor] colorWithAlphaComponent:1.00f]; 

btArtAndPainting.translatesAutoresizingMaskIntoConstraints = NO; 
self.vwContainer.translatesAutoresizingMaskIntoConstraints = NO; 

[self.vwContainer addSubview:btArtAndPainting]; 

[btArtAndPainting setImage:[UIImage imageNamed:kIMGCategoryArtAndPaintingNormal] forState:UIControlStateNormal]; 
[btArtAndPainting setImage:[UIImage imageNamed:kIMGCategoryArtAndPaintingHighlighted] forState:UIControlStateHighlighted]; 

[btArtAndPainting setTitle:@"Art and Painting" forState:UIControlStateNormal]; 
[btArtAndPainting setTitle:@"Art and Painting" forState:UIControlStateHighlighted]; 

btArtAndPainting.tintColor = [UIColor redColor]; 
btArtAndPainting.titleLabel.font = [UIFont systemFontOfSize:10.00f]; 
btArtAndPainting.titleLabel.textColor = [UIColor whiteColor]; 
btArtAndPainting.titleLabel.textAlignment = NSTextAlignmentCenter; 
btArtAndPainting.titleLabel.lineBreakMode = NSLineBreakByWordWrapping | NSLineBreakByTruncatingTail; 
btArtAndPainting.titleLabel.numberOfLines = 0; 
btArtAndPainting.imageEdgeInsets = UIEdgeInsetsMake(0.00f, 8.00f, 20.00f, 8.00f); 
btArtAndPainting.titleEdgeInsets = UIEdgeInsetsMake(32.00f, 0.00f, 0.00f, 0.00f); 

NSArray *constraintsWidth = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-10-[btArtAndPainting(60)]|" 
                    options:0 
                    metrics:nil 
                     views:viewDictionary]; 

NSArray *constraintsHeight = [NSLayoutConstraint constraintsWithVisualFormat:@"V:[searchBar]-10-[btArtAndPainting(60)]" 
                    options:0 
                    metrics:nil 
                     views:viewDictionary]; 

[self.vwContainer addConstraints:constraintsHeight]; 
[self.vwContainer addConstraints:constraintsWidth]; 

[btArtAndPainting layoutIfNeeded]; 
[btArtAndPainting needsUpdateConstraints]; 

समस्या है कि पाठ सब पर प्रदर्शित नहीं किया जाता है (दोनों सामान्य & प्रकाश डाला राज्यों में) है। नीचे लिंक्ड छवियों को देखें। टेक्स्ट के लिए जगह बनाने के लिए मैं UIEdgeInset का उपयोग कैसे करूं? मैंने UIButton श्रेणी बनाने की भी कोशिश की है लेकिन प्रभाव उतना ही कम है।

Answer 1

इनसेट सेट करने के लिए नीचे दिए गए कोड का उपयोग करें,

CGFloat spacing = 1.0; 
CGSize imageSize = btArtAndPainting.imageView.frame.size; 
btArtAndPainting.titleEdgeInsets = UIEdgeInsetsMake(0.0, - imageSize.width, - (imageSize.height + spacing), 0.0); 
CGSize titleSize = btArtAndPainting.titleLabel.frame.size; 
btArtAndPainting.imageEdgeInsets = UIEdgeInsetsMake(- (titleSize.height + spacing), 0.0, 0.0, - titleSize.width); 

आशा इस मदद करता है ..

Answer 2

मैं कई बार इस स्थिति का सामना करना पड़ा, कि मैं एक कस्टम लिखने का फैसला किया UIButton जो कोड की कुछ पंक्तियों में लचीला संरेखण का समर्थन करता है।
यह यहाँ उपलब्ध है: https://github.com/namanhams/FlexibleAlignButton

उदाहरण:
self.btn.alignment = kButtonAlignmentLabelBottom; self.btn.gap = 5; // vertical gap between image and text

Answer 3

यहाँ समस्या के लिए अपने समाधान है। एक UIButton उपवर्ग बनाया और layoutSubviews() ओवरराइड

import UIKit 

@IBDesignable 
class ImageTopButton: UIButton 
{ 
    override func layoutSubviews() 
    { 
     super.layoutSubviews() 

     let size = self.frame.size 
     let imageSize = self.imageView!.intrinsicContentSize() 
     let labelSize = self.titleLabel!.intrinsicContentSize() 

     let totalHeight = imageSize.height + labelSize.height 
     let heightDiff = size.height - totalHeight 
     let padding = heightDiff/2 

     self.imageView!.center = CGPoint(x: size.width/2, y: imageSize.height/2 + padding) 
     self.titleLabel!.center = CGPoint(x: size.width/2, y: imageSize.height + padding + labelSize.height/1.5) 
    } 
}