Display various size of text block in Xcode

Question

I'm creating a questionnaire app. In the view controller, I have a question displayed as a label and then I have three answers below displayed as labels too. The problem is that if the question has multiple lines, it's being displayed in one line anyway, and if I stretch out the label, it overlaps with the answers.

What is the right way to display the question so that the answers appear just under the question, no matter how long the question is?

A screenshot

use UITextView .in UITextview add your question – Sport Feb 22 '14 at 20:10 — Sport, Feb 22 '14 at 20:10

score 1 · Answer 1 · answered Feb 22 '14 at 20:14

If you want to use UILabel you must first of all set its "numberOfLines" property to 0. The value "0" means "no limit", so the text will be broken in the right number of lines. Then you have the problem of determining the right size of the label, as the height changes depending on the length of the question. In such case you can use the function - (CGRect)boundingRectWithSize:(CGSize)size options:(NSStringDrawingOptions)options context:(NSStringDrawingContext *)context (available with iOS7 and that replaces the - (CGSize)sizeWithFont:(UIFont *)font constrainedToSize:(CGSize)size lineBreakMode:(NSLineBreakMode)lineBreakMode available before iOS7). Once you determine the height of the label you change its frame accordingly. Obviously you must change the origin of the answers labels to avoid that they conflict with the question label. Note that if both questions and answers are too long, you may end up with an overall labels height taller than the screen height. In such case you should put all these labels inside a scrollview or as cells of a table view, to allow scrolling.

score 1 · Accepted Answer · answered Feb 22 '14 at 20:19

1

Try setting the property numberOfLines to 0 for your question label, it will allow an unlimited number of lines to be displayed. Then calculate the text size using iOS 7 method boundingRectWithSize:options:context::

CGRect questionFrame = self.questionLabel.frame
CGFloat maxWidth = questionFrame.size.width;

NSString *questionText = [NSString stringWithString:@"lorem ipsum"]; // your text
UIFont *font = self.questionLabel.font; // your label font

// Temporary attributed string
NSAttributedString *attributedText = [[NSAttributedString alloc] initWithString:questionText attributes:@{ NSFontAttributeName: font }];
CGRect rect = [attributedText boundingRectWithSize:(CGSize){ maxWidth, CGFLOAT_MAX }
                                           options:NSStringDrawingUsesLineFragmentOrigin
                                           context:nil];

// Assign the new height
questionFrame.size.height = rect.size.height;
self.questionLabel.frame = questionFrame;

Then move your answers label one by one under the question label:

CGRect answerFrame = self.answerLabel1.frame;
answerFrame.origin.y = questionFrame.origin.y + questionFrame.size.height;
self.answerLabel1.frame = answerFrame;

answerFrame.origin.y = answerFrame.origin.y + answerFrame.size.height;
self.answerLabel2.frame = answerFrame;

answerFrame.origin.y = answerFrame.origin.y + answerFrame.size.height;
self.answerLabel3.frame = answerFrame;

answered Feb 22 '14 at 20:19

jbouaziz

1,484
1
12
24

will the answer labels move down automatically if the question will take more lines to display? – Domas Feb 22 '14 at 20:20
No, you need to update them one by one. I just updated my answer. Also, like @viggio24 suggested, you could place all your labels inside a `UIScrollView` in case it gets too tall and update the `contentSize` property while setting the `UILabel`'s frame. – jbouaziz Feb 22 '14 at 20:28
it kind of did @jbouaziz thank you! however, there is some bug anyway, it changes the size of label just when i load second question and it moves up a tiny bit. – Domas Feb 22 '14 at 22:45
I'm not sure of what you mean @DomasfromUK. Can you post screenshots of it? – jbouaziz Feb 23 '14 at 00:41
this is the screen when you launch the app. the question label size is not adjusted for some reason. – Domas Feb 23 '14 at 00:59
this is the second question and now question label is resized, but has jumped up about 10 pixels. http://s2.postimg.org/hmca8ni0p/Screen_Shot_2014_02_23_at_00_58_08.png – Domas Feb 23 '14 at 01:02
Since you only have 1 of reputation we can't move to a chat discussion http://chat.stackoverflow.com/faq. So we'll need to keep every comment as relevant as possible :) That being said. I don't see the problem between screenshot 1 and 2. You're maybe talking justifying the label content, you could check that link http://stackoverflow.com/a/17426363/1835155. Although I'm pretty sure that the problem with the first one is because when you set the new frame size, the `UILabel` is nil. You could try setting a breakpoint there. – jbouaziz Feb 23 '14 at 01:08

Display various size of text block in Xcode

2 Answers2