आप UIButton में मल्टी-लाइन टेक्स्ट कैसे जोड़ते हैं?


368

मेरे पास निम्नलिखित कोड है ...

UILabel *buttonLabel = [[UILabel alloc] initWithFrame:targetButton.bounds];
buttonLabel.text = @"Long text string";
[targetButton addSubview:buttonLabel];
[targetButton bringSubviewToFront:buttonLabel];

... यह विचार होना कि मेरे पास बटन के लिए बहु-पंक्ति पाठ हो सकता है, लेकिन पाठ हमेशा UIButton की पृष्ठभूमि के अनुसार अस्पष्ट होता है। बटन के साक्षात्कार को दिखाने के लिए एक लॉगिंग कॉल से पता चलता है कि यूआईबेल जोड़ा गया है, लेकिन पाठ स्वयं नहीं देखा जा सकता है। क्या यह UIButton में एक बग है या मैं कुछ गलत कर रहा हूं?


7
button.titleLabel?.numberOfLines = 0
ma11hew28

2
इस बहुत पुराने क्यूए के लिए ध्यान दें, आधुनिक Xcode VERY SIMPLY में, "ATTRIBUTED TEXT" को चुनें और फिर यह तुच्छ है, "वर्ण लपेटें" चुनें।
फटी डे

इसी तरह के प्रश्न का अद्यतन उत्तर भी देखें ।
टूलमेकरसैट

जवाबों:


675

IOS 6 और इसके बाद के संस्करण के लिए, कई लाइनों की अनुमति देने के लिए निम्नलिखित का उपयोग करें:

button.titleLabel.lineBreakMode = NSLineBreakByWordWrapping;
// you probably want to center it
button.titleLabel.textAlignment = NSTextAlignmentCenter; // if you want to 
[button setTitle: @"Line1\nLine2" forState: UIControlStateNormal];

IOS 5 और नीचे के लिए कई लाइनों की अनुमति देने के लिए निम्नलिखित का उपयोग करें:

button.titleLabel.lineBreakMode = UILineBreakModeWordWrap;
// you probably want to center it
button.titleLabel.textAlignment = UITextAlignmentCenter;
[button setTitle: @"Line1\nLine2" forState: UIControlStateNormal];

2017, iOS9 फॉरवर्ड के लिए ,

आम तौर पर, बस ये दो काम करें:

  1. चुनें "जिम्मेदार ठहराया पाठ"
  2. "लाइन ब्रेक" पॉपअप पर "वर्ड रैप" चुनें

5
कृपया ध्यान दें कि ये असाइनमेंट iOS 6 में पदावनत हैं। अपडेट किए गए सिंटैक्स के लिए नीचे @NiKKi द्वारा उत्तर देखें।
आरोन ब्रेजर 9'13

6
बस इतना लोगों को पता है: यदि आप NSAttributedString का उपयोग कर रहे हैं तो यह काम नहीं करता है
यार

29
असल में, बस बटन जोड़ें। TitleLabel.numberOfLines = 0; यह लाइनों को असीमित बना देगा। और button.titleLabel.textAlignment = NSTextAlignmentLeft; यदि आप बचे हुए पाठ को छोड़ना चाहते हैं तो शीर्षक डिफ़ॉल्ट रूप से केंद्रित है।
RyJ

4
स्विफ्ट मेंbutton.titleLabel?.lineBreakMode = NSLineBreakMode.ByWordWrapping
रॉबर्ट

1
धन्यवाद @Robert स्विफ्ट सॉल्यूशन के लिए। यह भी अनुमान का उपयोग करें और छोड़ सकते हैं NSLineBreakMode, तो जैसे: button.titleLabel?.lineBreakMode = .ByWordWrapping
mjswensen

145

चयनित उत्तर सही है, लेकिन यदि आप इंटरफ़ेस बिल्डर में इस तरह की चीज़ करना पसंद करते हैं, तो आप ऐसा कर सकते हैं:

पिक


58
इस उत्तर को लिखने के लिए मेरे 24 वर्षीय स्व का धन्यवाद, 28 वर्षीय स्व।
एडम वेट

5
और इंटरफ़ेस बिल्डर केवल सेटअप के साथ रहने के लिए, एक निर्धारित करना चाहिए titleLabel.textAlignmentके साथ Numberमूल्य के लिए 1में User Defined Runtime Attributedबनाने के लिए पाठ केंद्रित
AnthoPak

2
मेरे २४ साल के स्वंय को मेरे २४ साल के स्व से धन्यवाद!
डैनियल स्प्रिंगर

59

यदि आप कई लाइनों के साथ शीर्षक वाले बटन को जोड़ना चाहते हैं, तो बटन के लिए अपना इंटरफ़ेस बिल्डर की सेटिंग सेट करें:

[ यहाँ]


क्या आप इसे प्राप्त करने का पाठ विवरण जोड़ सकते हैं। एक छवि बहुत अच्छी है, लेकिन अगर यह अनुपलब्ध हो जाता है तो आपका उत्तर बेकार हो जाएगा।
रोरी मैक्रों

1
@RoryMcCrossan हाय, मैंने ऊपर एक छवि जोड़ी। क्या आप इसे देख सकते हैं? कृपया ध्यान दें, Xcode 7 अभी भी छोटी है इसलिए बटन शीर्षक गायब हो सकता है। हालाँकि, एक बार जब आप ऐप चलाते हैं, तो आपको वांछित परिणाम मिलेगा।
user5440039

2
यह वास्तव में इस धागे में सबसे अच्छा जवाब है। तुरंत काम करता है और आईबी से केंद्रित पाठ दिखाता है। धन्यवाद!
रेनकास्ट

@ user5440039 महान जवाब के लिए धन्यवाद। पाठ विवरण जोड़ने की कोई आवश्यकता नहीं है।
फेटी डे

54

IOS 6 के लिए:

button.titleLabel.lineBreakMode = NSLineBreakByWordWrapping;
button.titleLabel.textAlignment = NSTextAlignmentCenter;

जैसा

UILineBreakModeWordWrap and UITextAlignmentCenter

IOS 6 में बाद में पदावनत किए गए हैं।


अंदर NSText.hमें Foundationकोई जोड़ा नहीं किया जाता। इसके 6.0 से उपलब्ध है, लेकिन नहीं पदावनत।
एलेक्स Cio

स्विफ्ट में: button.titleLabel?.lineBreakMode = NSLineBreakMode.ByWordWrapping button.titleLabel?.textAlignment = NSTextAlignment.Center
jcity

30

रोजर नोलन के सुझाव को पुनर्स्थापित करने के लिए, लेकिन स्पष्ट कोड के साथ, यह सामान्य समाधान है:

button.titleLabel?.numberOfLines = 0


13

Xcode 9.3 में आप नीचे दिए गए स्टोरीबोर्ड का उपयोग करके ऐसा कर सकते हैं ,

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

आपको बटन शीर्षक टेक्स्ट सेट करने की आवश्यकता है केंद्र में

button.titleLabel?.textAlignment = .center

आपको नीचे की तरह नई पंक्ति (\ n) के साथ शीर्षक पाठ सेट करने की आवश्यकता नहीं है,

button.setTitle("Good\nAnswer",for: .normal)

बस शीर्षक सेट,

button.setTitle("Good Answer",for: .normal)

यहाँ परिणाम है,

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


myButton.titleLabel.textAlignment = NSTextAlignmentCenterबयान की भी जरूरत है।
tounaobun

11

बहुत आसान तरीका है:

someButton.lineBreakMode = UILineBreakModeWordWrap;

(IOS 3 और बाद के लिए संपादित करें :)

someButton.titleLabel.lineBreakMode = UILineBreakModeWordWrap;

4
UIButton.lineBreakMode 3.0 में पदावनत किया गया था, इसलिए यह अब एक अच्छा विकल्प नहीं है।
क्रिस्टोफर पिक्सले

2
लाइनब्रुकमोड को केवल यूआईट्यूटन की प्रत्यक्ष संपत्ति के रूप में चित्रित किया गया है। हम "इसके बजाय टाइटलबेल के लाइनब्रेककोड संपत्ति का उपयोग करने के लिए निर्देशित हैं।" मैंने उसी हिसाब से वेलेरी का जवाब संपादित किया। यह अभी भी एक अच्छा विकल्प है।
वीनके

11

ऑटोलैयट के साथ iOS7 पर लेफ्ट अलाइन:

button.titleLabel.lineBreakMode = NSLineBreakByWordWrapping;
button.titleLabel.textAlignment = NSTextAlignmentLeft;
button.contentHorizontalAlignment = UIControlContentHorizontalAlignmentLeft;

9

मैं ऑटो लेआउट के साथ एक समस्या हुई, बहु लाइन परिणाम इस तरह था सक्षम करने के बाद: इसलिए आकार बटन आकार को प्रभावित नहीं करता मैं जोड़ दिया है के आधार पर (इस मामले contentEdgeInsets में था (10, 10, 10, 10 ) कॉलिंग के बाद : आशा है कि यह आपकी मदद करे (तेजी से 5.0):
यहां छवि विवरण दर्ज करें
titleLabel
ConstraintscontentEdgeInsets
makeMultiLineSupport()
यहां छवि विवरण दर्ज करें

extension UIButton {

    func makeMultiLineSupport() {
        guard let titleLabel = titleLabel else {
            return
        }
        titleLabel.numberOfLines = 0
        titleLabel.setContentHuggingPriority(.required, for: .vertical)
        titleLabel.setContentHuggingPriority(.required, for: .horizontal)
        addConstraints([
            .init(item: titleLabel,
                  attribute: .top,
                  relatedBy: .greaterThanOrEqual,
                  toItem: self,
                  attribute: .top,
                  multiplier: 1.0,
                  constant: contentEdgeInsets.top),
            .init(item: titleLabel,
                  attribute: .bottom,
                  relatedBy: .greaterThanOrEqual,
                  toItem: self,
                  attribute: .bottom,
                  multiplier: 1.0,
                  constant: contentEdgeInsets.bottom),
            .init(item: titleLabel,
                  attribute: .left,
                  relatedBy: .greaterThanOrEqual,
                  toItem: self,
                  attribute: .left,
                  multiplier: 1.0,
                  constant: contentEdgeInsets.left),
            .init(item: titleLabel,
                  attribute: .right,
                  relatedBy: .greaterThanOrEqual,
                  toItem: self,
                  attribute: .right,
                  multiplier: 1.0,
                  constant: contentEdgeInsets.right)
            ])
    }

}

स्विफ्ट 5 में सही काम करता है। मैंने बटन में केंद्र पाठ में अपना फ़ंक्शन भी जोड़ा। func CentreTextInButton () {गार्ड को शीर्षकलेबेल = शीर्षकलेबेल और {वापसी} शीर्षकलेबल.टेक्स्टअलीगमेंट = .सेंटर}
शेडेडो

धन्यवाद। यह इतना अच्छा उपाय है।
सोपानक

मैंने पाया कि अवरोध जोड़ना आवश्यक नहीं है, बस लाइन के बाद पाठ सेट करेंमब्रोडे / टेक्स्टएलिग्नमेंट / नंबरऑफलाइन निर्धारित हैं। और ऊपर और नीचे इनसेट के लिए titleEdgeInsets भी सेट करें।
बिल चैन

@BillChan दुर्भाग्य से जो सभी मामलों में काम नहीं करता है
अमीर खोरसंडी

7

सबसे पहले, आपको इस बात की जानकारी होनी चाहिए कि UIButton के पास पहले से ही एक UILabel है। आप इसका उपयोग करके सेट कर सकते हैं –setTitle:forState:

आपके उदाहरण के साथ समस्या यह है कि आपको UILabel की numberOfLinesसंपत्ति को उसके डिफ़ॉल्ट मान के अलावा किसी अन्य चीज़ पर सेट करने की आवश्यकता है । आपको lineBreakModeसंपत्ति की समीक्षा भी करनी चाहिए ।


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

4

जो लोग Xcode 4 के स्टोरीबोर्ड का उपयोग कर रहे हैं, उनके लिए आप बटन पर क्लिक कर सकते हैं, और दाईं ओर यूटिलिटीज़ फलक में एट्रीब्यूट इंस्पेक्टर के नीचे, आपको लाइन ब्रेक का विकल्प दिखाई देगा। वर्ड रैप चुनें, और आपको जाने के लिए अच्छा होना चाहिए।


4

यहां उत्तर आपको बताते हैं कि प्रोग्रामेटिक रूप से मल्टीलाइन बटन शीर्षक कैसे प्राप्त करें।

मैं बस यह जोड़ना चाहता था कि यदि आप स्टोरीबोर्ड का उपयोग कर रहे हैं, तो आप एक बटन शीर्षक फ़ील्ड पर एक नई पंक्ति को बाध्य करने के लिए [Ctrl + Enter] टाइप कर सकते हैं।

HTH



3

शीर्षक के रूप में यूबेल शीर्षक को देखने के लिए ब्रेंट के विचार के अनुसार, यह मुझे एक बहुत अच्छा विचार नहीं लगता है। मैं यूआईबेटन के साथ बातचीत की समस्याओं के बारे में सोचता रहता हूं क्योंकि इसके स्पर्श की घटनाओं के कारण यूआईबटन के विचार नहीं मिलते हैं।

दूसरी ओर, यूआईबेटन के साथ यूआईबटन के उप-भाग के रूप में, मैं यह जानकर बहुत असहज महसूस कर रहा हूं कि स्पर्श की घटनाओं को हमेशा यूबेल के पर्यवेक्षण के लिए प्रचारित किया जाएगा।

मैंने यह तरीका अपनाया और किसी भी समस्या की सूचना नहीं दी। मैंने एक UIButton उपवर्ग के -titleRectForContentRect: -titleRectForContentRect में यह कोड जोड़ा है, लेकिन यह कोड UIButton पर्यवेक्षक के ड्राइंग रूटीन में भी रखा जा सकता है, जो उस स्थिति में आप सभी संदर्भों को UIButton के चर के साथ स्वयं में बदल देंगे।

#define TITLE_LABEL_TAG 1234

- (CGRect)titleRectForContentRect:(CGRect)rect
{   
    // define the desired title inset margins based on the whole rect and its padding
    UIEdgeInsets padding = [self titleEdgeInsets];
    CGRect titleRect = CGRectMake(rect.origin.x    + padding.left, 
                                  rect.origin.x    + padding.top, 
                                  rect.size.width  - (padding.right + padding.left), 
                                  rect.size.height - (padding.bottom + padding].top));

    // save the current title view appearance
    NSString *title = [self currentTitle];
    UIColor  *titleColor = [self currentTitleColor];
    UIColor  *titleShadowColor = [self currentTitleShadowColor];

    // we only want to add our custom label once; only 1st pass shall return nil
    UILabel  *titleLabel = (UILabel*)[self viewWithTag:TITLE_LABEL_TAG];


    if (!titleLabel) 
    {
        // no custom label found (1st pass), we will be creating & adding it as subview
        titleLabel = [[UILabel alloc] initWithFrame:titleRect];
        [titleLabel setTag:TITLE_LABEL_TAG];

        // make it multi-line
        [titleLabel setNumberOfLines:0];
        [titleLabel setLineBreakMode:UILineBreakModeWordWrap];

        // title appearance setup; be at will to modify
        [titleLabel setBackgroundColor:[UIColor clearColor]];
        [titleLabel setFont:[self font]];
        [titleLabel setShadowOffset:CGSizeMake(0, 1)];
        [titleLabel setTextAlignment:UITextAlignmentCenter];

        [self addSubview:titleLabel];
        [titleLabel release];
    }

    // finally, put our label in original title view's state
    [titleLabel setText:title];
    [titleLabel setTextColor:titleColor];
    [titleLabel setShadowColor:titleShadowColor];

    // and return empty rect so that the original title view is hidden
    return CGRectZero;
}

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


3

यदि आप iOS 6 पर ऑटो-लेआउट का उपयोग करते हैं, तो आपको preferredMaxLayoutWidthसंपत्ति सेट करने की भी आवश्यकता हो सकती है :

button.titleLabel.lineBreakMode = NSLineBreakByWordWrapping;
button.titleLabel.textAlignment = NSTextAlignmentCenter;
button.titleLabel.preferredMaxLayoutWidth = button.frame.size.width;

3

NSLineBreakByWordWrapping (या तो आईबी या कोड में) के लिए लाइनब्रीकमोड सेट करना बटन लेबल मल्टीलाइन बनाता है, लेकिन बटन के फ्रेम को प्रभावित नहीं करता है।

यदि बटन में डायनामिक शीर्षक है, तो एक तरकीब है: एक ही फॉन्ट के साथ छिपा हुआ UILabel रखो और इसे लेआउट के साथ बटन की ऊंचाई तक टाई; जब बटन और लेबल पर पाठ सेट किया जाता है और ऑटोलैयट सभी काम करेगा।

ध्यान दें

एक-लाइन बटन की आंतरिक आकार की ऊंचाई लेबल की तुलना में बड़ी है, इसलिए लेबल की ऊंचाई को कम करने के लिए इसे ऊर्ध्वाधर सामग्री को गले लगाना प्राथमिकता बटन के ऊर्ध्वाधर सामग्री संपीड़न प्रतिरोध से अधिक होना चाहिए।


3

में स्विफ्ट 5.0 और Xcode 10.2

//UIButton extension
extension UIButton {
     //UIButton properties
     func btnMultipleLines() {
         titleLabel?.numberOfLines = 0
         titleLabel?.lineBreakMode = .byWordWrapping
         titleLabel?.textAlignment = .center        
     }
}

अपने ViewController कॉल में इस तरह

button.btnMultipleLines()//This is your button

2

यह पूरी तरह से काम करता है।

Plist की तरह config फाइल के साथ इसका उपयोग करने के लिए जोड़ें, आपको इस तरह बहुस्तरीय शीर्षक लिखने के लिए CDATA का उपयोग करने की आवश्यकता है:

<string><![CDATA[Line1
Line2]]></string>

2

यदि आप ऑटो-लेआउट का उपयोग करते हैं।

button.titleLabel?.adjustsFontSizeToFitWidth = true
button.titleLabel?.numberOfLines = 2

2

तेज 4.0

btn.titleLabel?.lineBreakMode = .byWordWrapping
btn.titleLabel?.textAlignment = .center
btn.setTitle( "Line1\nLine2", for: .normal)

2

इन दिनों, यदि आपको वास्तव में केस-बाय-केस आधार पर इंटरफ़ेस बिल्डर में सुलभ होने की आवश्यकता है, तो आप इसे इस तरह से एक साधारण एक्सटेंशन के साथ कर सकते हैं:

extension UIButton {
    @IBInspectable var numberOfLines: Int {
        get { return titleLabel?.numberOfLines ?? 1 }
        set { titleLabel?.numberOfLines = newValue }
    }
}

तो आप बस किसी भी UIButton या UIButton उपवर्ग पर एक विशेषता के रूप में numberOfLines सेट कर सकते हैं जैसे कि यह एक लेबल था। वही अन्य आम तौर पर दुर्गम मूल्यों की एक पूरी मेजबानी के लिए जाता है, जैसे कि किसी दृश्य की परत के कोने त्रिज्या, या छाया की विशेषताएं जो इसे डालती हैं।


2

UIButton में मल्टी लाइन टेक्स्ट के लिए स्विफ्ट 5

  let button = UIButton()
  button.titleLabel?.lineBreakMode = .byWordWrapping
  button.titleLabel?.textAlignment = .center
  button.titleLabel?.numberOfLines = 0 // for Multi line text

0

अपना स्वयं का बटन वर्ग रोल करें। यह लंबे समय में सबसे अच्छा समाधान है। UIButton और अन्य UIKit कक्षाएं बहुत ही प्रतिबंधात्मक हैं कि आप उन्हें कैसे अनुकूलित कर सकते हैं।



0

मैं शामिल jessecurry के जवाब भीतर STAButton जो मेरे का हिस्सा है STAControls खुला स्रोत पुस्तकालय। मैं वर्तमान में उन ऐप्स में से एक का उपयोग कर रहा हूं जो मैं विकसित कर रहा हूं और यह मेरी जरूरतों के लिए काम करता है। इसे कैसे सुधारें या मुझे पुल अनुरोध भेजें, इस मुद्दे पर मुक्त महसूस करें।


0

शीर्षक लेबल की रिक्ति को बटन पर ठीक करने के लिए, सेटटाइटल से पहले titleEdgeInsets और अन्य गुण सेट करें :

    let set = UIButton()
    sut.titleLabel?.lineBreakMode = .byWordWrapping
    sut.titleLabel?.numberOfLines = 0
    sut.titleEdgeInsets = UIEdgeInsets(top: 10, left: 10, bottom: 20, right: 20)
    sut.setTitle("Dummy button with long long long long long long long long title", for: .normal)

PS मैंने टाइटलबेल सेट करने का परीक्षण किया? .टेक्स्टअलाइनमेंट आवश्यक नहीं है और शीर्षक संरेखित करता है .natural


-4

हालाँकि, किसी नियंत्रण में सबव्यू जोड़ना ठीक है, वास्तव में काम करने की कोई गारंटी नहीं है, क्योंकि नियंत्रण की उम्मीद नहीं की जा सकती है और इस प्रकार वह खराब व्यवहार कर सकता है। यदि आप इसे दूर कर सकते हैं, तो बटन के सिबलिंग दृश्य के रूप में लेबल को जोड़ें और इसके फ्रेम को सेट करें ताकि यह बटन को ओवरलैप करे; जब तक यह बटन के शीर्ष पर प्रदर्शित होने के लिए सेट है, तब तक बटन कुछ भी नहीं कर सकता है।

दूसरे शब्दों में:

[button.superview addSubview:myLabel];
myLabel.center = button.center;

2
कृपया, यदि आप इस तरह के बदसूरत दृष्टिकोण का सुझाव देते हैं तो कम से कम अपने कोड उदाहरण में गलतियां न करें :)। यदि यह एक सबव्यू है तो लेबल में बटन के समान केंद्र नहीं होना चाहिए। MyLabel.frame = button.bounds का उपयोग करें; या myLabel.center = cgPointMake (button.frame.size.with * 0.5, button.frame.size.height * 0.5)
JakubKnejzlik

1
@GrizzlyNetch मैं विशेष रूप से इसे बटन के उप-भाग के रूप में नहीं जोड़ने की सलाह दे रहा हूं । addSubview:यहां इसे buttonसुपरवाइज के लिए जोड़ा गया है , इस प्रकार यह बटन का सहोदर बनाता है, इसलिए उनके केंद्रों का मिलान सही है।
ब्रेंट रॉयल-गॉर्डन

आह, मेरी गलती! आप सही कह रहे हैं, मैंने
पर्यवेक्षण

यह बिल्कुल वैसा नहीं है जैसा कि पूछा गया है, यह समाधान प्रश्न को लागू करने का एक बुरा तरीका होगा क्योंकि तत्व बटन का शीर्षक है।
पाब्लो ब्लैंको

यह iPhone OS 2.0 में उचित सलाह थी। अब तक इसे करने के बहुत बेहतर तरीके हैं। : ^)
ब्रेंट रॉयल-गॉर्डन
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.