UIButton ที่มีข้อความสองบรรทัดในชื่อเรื่อง (numberOfLines = 2)


87

ฉันกำลังพยายามทำให้UIButtonมีข้อความสองบรรทัดใน titleLabel นี่คือรหัสที่ฉันใช้:

    UIButton *titleButton = [[UIButton alloc] initWithFrame:CGRectMake(15, 10, frame.size.width-100, 100)];
    titleButton.titleLabel.font = [UIFont boldSystemFontOfSize:24.0];
    [titleButton setTitle:@"This text is very long and should get truncated at the end of the second line" forState:UIControlStateNormal];
    titleButton.titleLabel.lineBreakMode = UILineBreakModeTailTruncation;
    titleButton.titleLabel.numberOfLines = 2;
    [self addSubview:titleButton];

เมื่อฉันลองสิ่งนี้ข้อความจะปรากฏในบรรทัดเดียวเท่านั้น ดูเหมือนว่าวิธีเดียวที่จะประสบความสำเร็จมากกว่าหนึ่งบรรทัดของข้อความในUIButton.titleLabelคือการตั้งค่าและการใช้งานnumberOfLines=0 UILineBreakModeWordWrapแต่ไม่ได้รับประกันว่าข้อความจะมีสองบรรทัด

อย่างไรก็ตามการใช้แบบธรรมดาUILabelจะได้ผล:

    UILabel *titleLabel = [[UILabel alloc] initWithFrame:CGRectMake(15, 10, frame.size.width-100, 100)];
    titleLabel.font = [UIFont boldSystemFontOfSize:24.0];
    titleLabel.text = @"This text is very long and should get truncated at the end of the second line";
    titleLabel.numberOfLines = 2;
    titleLabel.lineBreakMode = UILineBreakModeTailTruncation;
    [self addSubview:titleLabel];

ไม่มีใครรู้วิธีทำให้UIButtonงานมีสองบรรทัด? เป็นทางออกเดียวในการสร้างแยกUILabelเพื่อเก็บข้อความและเพิ่มเป็นมุมมองย่อยของปุ่มหรือไม่


1
คุณเคยเห็นสิ่งนี้หรือไม่? - stackoverflow.com/questions/604632/…
Viraj

วิราจใช่ถ้าตั้งnumberOfLines=0และใช้งานUILineBreakModeWordWrapได้หลายบรรทัด ปัญหาคืออาจให้มากกว่าสองบรรทัดหากข้อความยาวเกินไป ฉันต้องการตรงสอง lones กับ elipses ที่ท้ายบรรทัดที่สองด้วย (ถ้าข้อความยาวเกินไป)
นักการตลาด

โอ้ฉันเดาว่าการเพิ่มมุมมองย่อยอาจเป็นวิธีเดียวที่จะไป
Viraj

คำตอบ:


87

คำตอบที่อัปเดตสำหรับ iOS เวอร์ชันล่าสุด

เนื่องจากนี่เป็นคำตอบที่ได้รับการยอมรับคำตอบของ @ Sean เพิ่มที่นี่:

ตั้งค่าคุณสมบัติเหล่านี้บน titleLabel ของปุ่มของคุณ

button.titleLabel.lineBreakMode = NSLineBreakByWordWrapping;
button.titleLabel.numberOfLines = 2; // if you want unlimited number of lines put 0

Swift 3 และ 4:

button.titleLabel?.lineBreakMode = .byWordWrapping
button.titleLabel?.numberOfLines = 2 // if you want unlimited number of lines put 0

คำตอบเดิมสำหรับ iOS เวอร์ชันเก่ากว่า

หากคุณต้องการให้ข้อความ 2 บรรทัดอยู่ด้านบนของคุณUIButtonคุณควรเพิ่มข้อความUIlabelไว้ด้านบนซึ่งทำได้อย่างแม่นยำ

UILabel *titleLabel = [[UILabel alloc] initWithFrame:CGRectMake(15, 10, frame.size.width-100, 100)];
titleLabel.font = [UIFont boldSystemFontOfSize:24.0];
titleLabel.text = @"This text is very long and should get truncated at the end of the second line";
titleLabel.numberOfLines = 2;
titleLabel.lineBreakMode = UILineBreakModeTailTruncation;
[myButton addSubview:titleLabel]; //add label to button instead.

อัปเดตสำหรับโซลูชันตัวสร้างอินเทอร์เฟซ

เพิ่มคำตอบของ @Borut Tomazin เพื่อคำตอบที่สมบูรณ์ยิ่งขึ้น อัปเดตส่วนนี้อีกครั้งเนื่องจากคำตอบของ @Borut Tomazin ได้รับการปรับปรุง

คุณสามารถทำได้ง่ายกว่ามากโดยไม่ต้องใช้รหัส ใน Interface Builder ตั้งLine Breakบน UIButton Word Wrapไป คุณสามารถแทรกชื่อเรื่องได้หลายบรรทัด เพียงกดOption + Returnปุ่มเพื่อสร้างบรรทัดใหม่ คุณจะต้องเพิ่มสิ่งนี้ลงในแอตทริบิวต์รันไทม์ที่ผู้ใช้กำหนดในตัวสร้างส่วนต่อประสาน:

titleLabel.textAlignment Number [1]

5
UILineBreakModeเลิกใช้แล้วให้ใช้NSLineBreakModeแทน
guillaume

2
สิ่งนี้ไม่จำเป็นสำหรับ iOS เวอร์ชันล่าสุด ดูคำตอบของ @ sean
cbowns

146

คุณไม่จำเป็นต้องเพิ่ม UILabel ใน UIButton นั่นเป็นเพียงวัตถุพิเศษและการทำงาน

ตั้งค่าคุณสมบัติเหล่านี้บน titleLabel ของปุ่มของคุณ

button.titleLabel.lineBreakMode = NSLineBreakByWordWrapping;
button.titleLabel.numberOfLines = 2;//if you want unlimited number of lines put 0

รวดเร็ว:

button.titleLabel!.lineBreakMode = NSLineBreakMode.ByWordWrapping
button.titleLabel!.numberOfLines = 2//if you want unlimited number of lines put 0

6
นี่คือปี 2013 และ ณ วันนี้นี่เป็นโซลูชันที่ทันสมัย
Klaas

@ Blip คุณไม่สามารถโชคร้ายและจำเป็นต้องทำในรหัส อาจคุ้มค่าที่จะยื่นรายงานข้อบกพร่องกับ Apple เพื่อขอฟังก์ชันนี้
bpapa

@bpapa ใช่ฉันเห็นด้วยสตอรี่บอร์ดควรมีความยืดหยุ่นมากกว่านี้
Blip

6
วิธีนี้ใช้ได้ผลสำหรับฉัน แต่มันทำลายพฤติกรรมเริ่มต้นของปุ่มintrinsicContentSizeซึ่งยังคงส่งคืนความสูงที่สอดคล้องกับข้อความเพียงบรรทัดเดียว ฉันแก้ไขโดยการลบล้างปุ่มintrinsicContentSizeที่ฉันตั้งค่าความสูง[self.titleLabel sizeThatFits(CGSizeMake(self.titleLabel.frame.size.width, CGFLOAT_MAX)].heightไว้
Elise

@WillVonUllrich เพราะคุณสามารถเปลี่ยนคำตอบที่ยอมรับได้ก็ต่อเมื่อมีการแก้ไข ฉันได้เพิ่มคำตอบเหล่านี้ลงในคำตอบที่ได้รับการยอมรับดังนั้นมันจะช่วยให้ผู้คนที่ไม่มองไปไกลกว่าคำตอบที่ยอมรับนั้น
Totumus Maximus

88

คุณสามารถทำได้ง่ายกว่ามากโดยไม่ต้องใช้รหัส ใน Interface Builder ตั้งLine Breakบน UIButton Word Wrapไป คุณสามารถแทรกชื่อเรื่องได้หลายบรรทัด เพียงแค่กดOption + Returnปุ่มเพื่อสร้างบรรทัดใหม่ คุณจะต้องเพิ่มสิ่งนี้ในแอตทริบิวต์รันไทม์ที่ผู้ใช้กำหนดในตัวสร้างอินเทอร์เฟซ:

titleLabel.textAlignment Number [1]

มันง่ายมาก หวังว่ามันจะช่วย ...


1
โซลูชันนี้ดีกว่า (อ็อบเจ็กต์, โค้ด) น้อยกว่าโซลูชันที่ยอมรับในปัจจุบันสำหรับกรณีทั่วไป
Jonathan Zhan

1
คุณตั้งค่าคุณสมบัติเดียวกันกับที่คุณกำหนดโดยทางโปรแกรมดังนั้นอาร์กิวเมนต์ "วัตถุน้อยกว่า" ของคุณจึงไม่ถูกต้อง รหัสอาจจะน้อยกว่า แต่น่าอ่านกว่า. เลือกของคุณ;)
Totumus Maximus

โอ้ฉันคิดไม่ชัดเจน ขอบคุณที่พยายามชี้แจง ไม่ได้กังวลมากนักกับความจริงที่ว่ามันทำใน IB vs Code เพิ่มเติมเกี่ยวกับการที่คุณไม่จำเป็นต้องเพิ่มป้ายกำกับเพิ่มเติมด้วยโซลูชันของ Borut และมันก็ทำสิ่งเดียวกันได้สำเร็จ แต่ใช่ทั้งสองอย่างทำงานได้ดี :)
Jonathan Zhan

มันยากมากที่จะต้องไปที่โค้ดด้านหลังสำหรับงานพื้นฐานดังกล่าว
Can Poyrazoğlu

3
คุณสามารถบรรลุเป้าหมายเดียวกันแบบไร้รหัส 100% โดยการเพิ่มtitleLabel.textAlignment User Defined Runtime Attributeใน Interface Builder และตั้งค่าเป็นNumber = 1 (ค่าของ NSTextAlignmentCenter)
0xced

21
 button.titleLabel.lineBreakMode = NSLineBreakByWordWrapping;

button.titleLabel.textAlignment = NSTextAlignmentCenter;

[button setTitle: @"Line1\nLine2" forState: UIControlStateNormal];

สมบูรณ์แบบ! คุณไม่จำเป็นต้องแยกภายในNSString setTitle`` WordWrapping`` กำลังทำสิ่งนี้ให้คุณ!
Alex Cio

สำหรับฉันฉันต้องแยกสตริงในชื่อชุด โดยที่มันไม่ได้ผล
user1960169

9

เพื่อหลีกเลี่ยงความจำเป็นในการแก้ไขโค้ดโดยสิ้นเชิงดังนั้นจึงจำเป็นต้องย่อยคลาสมุมมองของคุณใน Xcode5 ขึ้นไปคุณสามารถทำตามคำแนะนำของ Borut Tomazin:

ใน Interface Builder (หรือ storyboard)ตั้งค่า Line Break เป็น Word Wrap คุณสามารถแทรกชื่อเรื่องได้หลายบรรทัด เพียงกด ปุ่มOption+ Returnเพื่อสร้างบรรทัดใหม่

จากนั้นในแอตทริบิวต์รันไทม์ที่ผู้ใช้กำหนดคุณสามารถเพิ่มได้

เส้นทางสำคัญ: titleLabel.textAlignment
ประเภท: Number
ค่า:1

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


1

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

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

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.