UILabel - ป้ายกำกับขนาดอัตโนมัติเพื่อให้พอดีกับข้อความหรือไม่


144

เป็นไปได้หรือไม่ที่จะปรับขนาดกล่อง / ขอบเขตของ UILabel โดยอัตโนมัติเพื่อให้พอดีกับข้อความที่มีอยู่? (ฉันไม่สนใจว่ามันจะใหญ่กว่าจอแสดงผลหรือไม่)

ดังนั้นหากผู้ใช้ป้อน "hello" หรือ "ชื่อของฉันยาวจริง ๆ ฉันต้องการให้พอดีกับกล่องนี้" จะไม่ถูกตัดทอนและฉลากจะ 'กว้าง' ตามนั้นหรือไม่


ทุกคนโปรดช่วยฉันด้วยการให้รหัสที่รวดเร็ว ..
Angel F Syrus

คำตอบ:


98

โปรดตรวจสอบส่วนสำคัญของฉันที่ฉันได้ทำหมวดหมู่สำหรับUILabelสิ่งที่คล้ายกันมากหมวดหมู่ของฉันช่วยUILabelยืดความสูงให้แสดงเนื้อหาทั้งหมด: https://gist.github.com/1005520

หรือตรวจสอบโพสต์นี้: https://stackoverflow.com/a/7242981/662605

สิ่งนี้จะยืดความสูง แต่คุณสามารถเปลี่ยนได้อย่างง่ายดายเพื่อทำงานในแบบอื่นและยืดความกว้างด้วยสิ่งนี้ซึ่งฉันเชื่อว่าสิ่งที่คุณต้องการจะทำ:

@implementation UILabel (dynamicSizeMeWidth)

- (void)resizeToStretch{
    float width = [self expectedWidth];
    CGRect newFrame = [self frame];
    newFrame.size.width = width;
    [self setFrame:newFrame];
}

- (float)expectedWidth{
    [self setNumberOfLines:1];

    CGSize maximumLabelSize = CGSizeMake(CGRectGetWidth(self.bounds), CGFLOAT_MAX);

    CGSize expectedLabelSize = [[self text] sizeWithFont:[self font] 
                                            constrainedToSize:maximumLabelSize
                                            lineBreakMode:[self lineBreakMode]]; 
    return expectedLabelSize.width;
}

@end

คุณสามารถใช้sizeToFitวิธีที่มีอยู่ในUIViewคลาสได้ง่ายขึ้น แต่ตั้งค่าจำนวนบรรทัดเป็น 1 เพื่อความปลอดภัย


อัปเดต iOS 6

หากคุณใช้ AutoLayout แสดงว่าคุณมีโซลูชันในตัว โดยการตั้งค่าจำนวนบรรทัดเป็น 0 กรอบงานจะปรับขนาดป้ายกำกับของคุณอย่างเหมาะสม (เพิ่มความสูงมากขึ้น) เพื่อให้พอดีกับข้อความของคุณ


อัปเดต iOS 8

sizeWithFont:เลิกใช้แล้วให้ใช้sizeWithAttributes:แทน:

- (float)expectedWidth{
    [self setNumberOfLines:1];

    CGSize expectedLabelSize = [[self text] sizeWithAttributes:@{NSFontAttributeName:self.font}];

    return expectedLabelSize.width;
}

8
การใช้วิธีการเลย์เอาต์ iOS 6 โดยอัตโนมัติฉันลงเอยด้วยข้อจำกัดความสูงบนป้ายกำกับของฉันฉันไม่สามารถกำจัดได้ การตั้งค่าความสัมพันธ์ของข้อจำกัดความสูงเป็น 'มากกว่าหรือเท่ากับ' ทำให้ความสูงเพิ่มขึ้น
Michael Luton

2
sizeWithFont: constrainedToSize: lineBreakMode: วิธีการ depricated ใน iOS 7
Karan Alangat

1
UILabel ไม่ปรับขนาดตัวเองเมื่อข้อความมีจำนวนน้อยลง / มากกว่า ฉันใช้การจัดวางอัตโนมัติ พยายาม UILabel แต่พวกเขาจะถูกสร้างขึ้นทุกครั้ง cellForRowAtIndex จะเริ่มต้นได้ พยายามหลายสิ่งหลายอย่าง ไม่มีอะไรทำงานให้ฉัน พื้นหลังของ uilabel มีความกว้างเท่ากัน ช่วยด้วย !!!
coreDeviOS

@Daniel ฉันตั้งค่าจำนวนบรรทัด = 0 แต่ไม่ทำงาน ฉันได้ตั้งข้อ จำกัด ของศูนย์แนวนอนและแนวตั้ง สิ่งหนึ่งที่พิเศษที่ฉันทำคือทำคลาสย่อยของ UILABEL และใช้สำหรับป้ายกำกับนั้น
Jasmeet

ด้วย Autolayout ทางออกที่ง่ายที่สุดคือ: (1) ตั้งค่าบรรทัดเป็น 0, (2) ตั้งค่าข้อจำกัดความกว้างเป็น "มากกว่าหรือเท่ากับ" ด้วยค่าคงที่ 0, (3) ตั้งค่าความสูง จำกัด เป็น "มากกว่าหรือเท่ากับ" กับค่าคงที่ 0, ( 4) จัดตำแหน่งตามที่คุณต้องการตัวอย่างเช่นจัดกึ่งกลางแนวนอนและแนวตั้ง
Erik van der Neut

76

การใช้ [label sizeToFit];จะได้ผลลัพธ์เหมือนกันจากหมวดหมู่ของแดเนียล

แม้ว่าฉันจะแนะนำให้ใช้การชำระอัตโนมัติและให้ฉลากปรับขนาดตัวเองตามข้อ จำกัด


3
เมื่อใช้ swift ฉันต้องเรียกใช้งานบนเธรดหลักโดยใช้ dispatch_async (dispatch_get_main_queue (), {});
Zeezer

@Zeezer คุณรู้ไหมว่าทำไม?
FurloSK

13
@FurloSK การเปลี่ยนแปลงใด ๆ บน UI ต้องทำในเธรดหลัก
Guilherme Torres Castro

32

ถ้าเราต้องการที่UILabelจะลดขนาดและขยายตามขนาดตัวอักษรกระดานเรื่องราวพร้อมการเลื่อนอัตโนมัติเป็นตัวเลือกที่ดีที่สุด ด้านล่างนี้เป็นขั้นตอนในการบรรลุเป้าหมายนี้

ขั้นตอน

  1. วาง UILabel ในมุมมองคอนโทรลเลอร์และวางไว้ทุกที่ที่คุณต้องการ ยังใส่0สำหรับทรัพย์สินของnumberOfLinesUILabel

  2. ให้ข้อ จำกัด พินพื้นที่ด้านบนชั้นนำและต่อท้าย

ป้อนคำอธิบายรูปภาพที่นี่

  1. ตอนนี้มันจะให้คำเตือนคลิกที่ลูกศรสีเหลือง

ป้อนคำอธิบายรูปภาพที่นี่

  1. คลิกที่และคลิกที่Update Frame Fix Misplacementตอนนี้ UILabel นี้จะลดขนาดลงหากข้อความมีขนาดเล็กลงและขยายได้ถ้ามีข้อความมากกว่า

1
ฉันไม่ได้ทดสอบการโลคัลไลซ์เซชัน แต่มันก็ใช้ได้ดีเช่นกัน
Yogesh Suthar

2
ฉันไม่สามารถทำให้มันทำงานกับโครงการที่มีอยู่ได้จนกว่าจะยกเลิกการเลือกช่องทำเครื่องหมาย "ความกว้างที่ต้องการ" "ชัดเจน" แล้วทั้งหมดก็ใช้ได้ดี
zorro2b

25

มันไม่ซับซ้อนเหมือนคำตอบอื่น ๆ

ป้อนคำอธิบายรูปภาพที่นี่

ตรึงขอบซ้ายและขอบบน

เพียงใช้เลย์เอาต์อัตโนมัติเพื่อเพิ่มข้อ จำกัด เพื่อปักหมุดด้านซ้ายและด้านบนของฉลาก

ป้อนคำอธิบายรูปภาพที่นี่

หลังจากนั้นมันจะปรับขนาดโดยอัตโนมัติ

หมายเหตุ

  • อย่าเพิ่มข้อ จำกัด สำหรับความกว้างและความสูง ป้ายกำกับมีขนาดที่แท้จริงตามเนื้อหาข้อความ
  • ขอบคุณคำตอบนี้สำหรับความช่วยเหลือ
  • ไม่จำเป็นต้องตั้งค่าsizeToFitเมื่อใช้เลย์เอาต์อัตโนมัติ รหัสที่สมบูรณ์ของฉันสำหรับโครงการตัวอย่างอยู่ที่นี่:

    import UIKit
    class ViewController: UIViewController {
    
        @IBOutlet weak var myLabel: UILabel!
    
        @IBAction func changeTextButtonTapped(sender: UIButton) {
            myLabel.text = "my name is really long i want it to fit in this box"
        }
    }
  • หากคุณต้องการให้ label ของคุณตัดบรรทัดให้ตั้งค่าจำนวนบรรทัดเป็น 0 ใน IB และเพิ่มmyLabel.preferredMaxLayoutWidth = 150 // or whateverในโค้ด (ฉันยังตรึงปุ่มไว้ที่ด้านล่างของป้ายกำกับเพื่อที่จะเลื่อนลงเมื่อความสูงของป้ายเพิ่มขึ้น)

ป้อนคำอธิบายรูปภาพที่นี่

  • หากคุณกำลังมองหาการปรับขนาดฉลากแบบไดนามิกภายในUITableViewCellดูคำตอบนี้

ป้อนคำอธิบายรูปภาพที่นี่


สวัสดีฉันได้รับฉลากที่ปรับขนาดแล้ว แต่ฉันไม่เข้าใจวิธีการปรับขนาดความสูงของเซลล์ คุณช่วยกรุณาบอกฉันด้วยวิธีการปรับขนาดความสูงของเซลล์
Vivek

@Vivek ตราบใดที่คุณไม่มีข้อ จำกัด ใด ๆ เกี่ยวกับความสูงมันควรปรับขนาดโดยอัตโนมัติ
Suragch

ใช่ แต่มันเป็นไปได้อย่างไรเมื่อฉันใช้เซลล์ที่กำหนดเองและฉันใส่ 2 ป้ายกำกับไว้ในเซลล์ของเขา
Vivek

@Vivek ขออภัยฉันอ่านคำถามของคุณผิด คุณได้รับหนึ่งป้ายกำกับให้ทำงานโดยทำตามคำตอบนี้หรือไม่
Suragch


5

ฉันสร้างวิธีการบางอย่างตามคำตอบของ Daniel ด้านบน

-(CGFloat)heightForLabel:(UILabel *)label withText:(NSString *)text
{
    CGSize maximumLabelSize     = CGSizeMake(290, FLT_MAX);

    CGSize expectedLabelSize    = [text sizeWithFont:label.font
                                constrainedToSize:maximumLabelSize
                                    lineBreakMode:label.lineBreakMode];

    return expectedLabelSize.height;
}

-(void)resizeHeightToFitForLabel:(UILabel *)label
{
    CGRect newFrame         = label.frame;
    newFrame.size.height    = [self heightForLabel:label withText:label.text];
    label.frame             = newFrame;
}

-(void)resizeHeightToFitForLabel:(UILabel *)label withText:(NSString *)text
{
    label.text              = text;
    [self resizeHeightToFitForLabel:label];
}

5

นี่คือสิ่งที่ฉันกำลังค้นหาทำงานได้สำหรับสถานการณ์ของฉัน:

1) ความสูงของ UILabel มีข้อ จำกัด > = 0 โดยใช้ autolayout ความกว้างได้รับการแก้ไข 2) กำหนดข้อความลงใน UILabel ซึ่งมีผู้ดูแลอยู่ ณ จุดนั้น (ไม่แน่ใจว่าสำคัญแค่ไหน) 3) จากนั้นทำ:

    label.sizeToFit()
    label.layoutIfNeeded()

ความสูงของฉลากถูกตั้งค่าอย่างเหมาะสมแล้ว


3
@implementation UILabel (UILabel_Auto)

- (void)adjustHeight {

    if (self.text == nil) {
        self.frame = CGRectMake(self.frame.origin.x, self.frame.origin.y, self.bounds.size.width, 0);
        return;
    }

    CGSize aSize = self.bounds.size;
    CGSize tmpSize = CGRectInfinite.size;
    tmpSize.width = aSize.width;

    tmpSize = [self.text sizeWithFont:self.font constrainedToSize:tmpSize];

    self.frame = CGRectMake(self.frame.origin.x, self.frame.origin.y, aSize.width, tmpSize.height);
}

@end

นี่คือวิธีหมวดหมู่ คุณต้องตั้งค่าข้อความก่อนเรียกวิธีนี้เพื่อปรับความสูงของ UILabel


2

คุณสามารถปรับขนาดป้ายกำกับของคุณตามข้อความและตัวควบคุมอื่น ๆ ที่เกี่ยวข้องโดยใช้สองวิธี

  1. สำหรับ iOS 7.0 ขึ้นไป

    CGSize labelTextSize = [labelText boundingRectWithSize:CGSizeMake(labelsWidth, MAXFLOAT)
                                              options:NSStringDrawingUsesLineFragmentOrigin
                                           attributes:@{
                                                        NSFontAttributeName : labelFont
                                                        }
                                              context:nil].size;

ก่อน iOS 7.0 นี้สามารถใช้ในการคำนวณขนาดฉลาก

CGSize labelTextSize = [label.text sizeWithFont:label.font 
                            constrainedToSize:CGSizeMake(label.frame.size.width, MAXFLOAT)  
                                lineBreakMode:NSLineBreakByWordWrapping];

// reframe ส่วนควบคุมอื่น ๆ ตาม labelTextHeight

CGFloat labelTextHeight = labelTextSize.height;
  1. ถ้าคุณไม่ต้องการคำนวณขนาดของข้อความของฉลากมากกว่าที่คุณสามารถใช้ -sizeToFit ในอินสแตนซ์ของ UILabel เป็น -

    [label setNumberOfLines:0]; // for multiline label
    [label setText:@"label text to set"];
    [label sizeToFit];// call this to fit size of the label according to text

// หลังจากนี้คุณจะได้รับกรอบป้ายกำกับเพื่อควบคุมการควบคุมที่เกี่ยวข้องอื่น ๆ


2
  1. เพิ่มข้อ จำกัด ที่ขาดหายไปในกระดานเรื่องราว
  2. เลือก UILabel ในกระดานเรื่องราวและตั้งค่าแอตทริบิวต์ "Line" เป็น 0
  3. อ้างอิง UILabel ไปยัง Controller.h ด้วย id: label
  4. Controller.m และเพิ่ม[label sizeToFit];ใน viewDidLoad

1

ฉันมีปัญหาใหญ่กับเลย์เอาต์อัตโนมัติ เรามีสองตู้คอนเทนเนอร์ภายในเซลล์ของตาราง คอนเทนเนอร์ที่สองถูกปรับขนาดขึ้นอยู่กับคำอธิบายรายการ (0 - 1,000 chars) และแถวควรถูกปรับขนาดตามพวกเขา

ส่วนผสมที่ขาดหายไปคือข้อ จำกัด ด้านล่างสำหรับคำอธิบาย

ฉันได้เปลี่ยนข้อ จำกัด ด้านล่างขององค์ประกอบแบบไดนามิกจาก= 0ไป> = 0


สิ่งนี้ช่วยชีวิตฉันได้ หากคุณพยายามที่จะปฏิบัติตาม: github.com/honghaoz/…นี่คือคำตอบที่ถูกต้อง
Justin Fyles

0

เหมาะกับทุกครั้ง! :)

    name.text = @"Hi this the text I want to fit to"
    UIFont * font = 14.0f;
    CGSize size = [name.text sizeWithAttributes:@{NSFontAttributeName: font}];
    nameOfAssessment.frame = CGRectMake(400, 0, size.width, 44);
    nameOfAssessment.font = [UIFont systemFontOfSize:font];

0

คุณสามารถแสดงเอาต์พุตหนึ่งบรรทัดจากนั้นตั้งค่าคุณสมบัติLine = 0และแสดงเอาต์พุตหลายบรรทัดจากนั้นตั้งค่าคุณสมบัติLine = 1 และอื่น ๆ

[self.yourLableName sizeToFit];

-1

นอกจากนี้ยังมีวิธีการนี้:

[self.myLabel changeTextWithAutoHeight:self.myStringToAssignToLabel width:180.0f];

มันไม่ได้ผมที่ downvoted คำตอบนี้ แต่ฉันแค่อยากจะชี้ให้เห็นว่าฉันไม่สามารถดูวิธีการได้ที่changeTextWithAutoHeight:width: UILabelคุณสามารถให้ลิงค์โปรดไปที่ที่ในเอกสาร UIKit วิธีนี้สามารถพบได้
Adil Hussain
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.