IOS Multiple line Label floating around a UIButton

Question

I am trying fit an UIButton and an UILabel on the same line. If the UILabel is larger it will then wrap around the UIButton to the next line.

For example,

enter image description here

In this case, Kobe Bryant would be the UIButton which is clickable. and the rest of the text are UILabel.

The thing is that The UIButton is a variable and the width changes. I spent an entire day researching on google and stackoverflow and cannot come up with an answer.

If any of you can point me to the right direction, I'll be really appreciated

Have a look at this answer, you can change it to use the frame for the button: http://stackoverflow.com/a/20033752/2043580 — ZeMoon, Nov 04 '14 at 06:10
You should use a non-editable TextView as UILabel does not support exclusion paths — ZeMoon, Nov 04 '14 at 06:11
How do I calculate the width of the UIButton which is known only at runtime — user3081516, Nov 04 '14 at 06:14
you keep the text in the webview and give the 'kobe bryant' as link.I have faced the same issue and I spent hours same as you — Ramesh Muthe, Nov 04 '14 at 06:17
but Kobe Bryant supposes to open up another UIViewController via a segue — user3081516, Nov 04 '14 at 06:20
call the method in the delegate method and see the post of neenu — Ramesh Muthe, Nov 04 '14 at 06:22
Resolving. Trying to disable scroll view and use dynamic height. — user3081516, Nov 04 '14 at 06:31
Because the webview may end up 3 or 4 lines, I want the height to be dynamic any tips? — user3081516, Nov 04 '14 at 06:32
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/64213/discussion-between-user3081516-and-ramesh-muthe). — user3081516, Nov 04 '14 at 06:35
Try http://stackoverflow.com/questions/15293426/how-to-create-uilabel-with-clickable-first-word — Akhilrajtr, Nov 04 '14 at 06:44

Neenu · Answer 1 · 2014-11-04T06:46:19.140

It is better to use a web view instead of UIButton and UILabel (disable the scrolling ). Load the text in the webview as ,

webview.delegate=self;
[webview loadHTMLString:@"<html><head></head><body><a href=\"name_identifier\"><b>Kobe Bryant</b></a> is a very good basketball player who is coming off an serious injury.</body></html>" baseURL:nil];

Listen for the URL

- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)aRequest navigationType:(UIWebViewNavigationType)navigationType{

    if([[[aRequest URL] absoluteString] isEqual:@"name_identifier"]){

        //TODO:Do the steps to call when press on the name
        return NO;
    }

    return YES;

}

For performing the Segue action

Remove the segue from UIButton
ctrl+drag from the source UIViewController to destination UIViewController.
select "push".
Give an identifier to the segue.

And add the below line to go to the next view controller. (before return NO; in the above code)

[self performSegueWithIdentifier: @"segue_id" sender:self];

You can disable the scrolling of the web view as,

webView.scrollView.scrollEnabled = NO; 
webView.scrollView.bounces = NO;

And can calculate the dynamic height as,

CGSize maximumSize = CGSizeMake(320,568); //change as you wish

CGSize expectedLabelSize = [contentString sizeWithFont:fontUsed 
                        constrainedToSize: maximumSize 
                        lineBreakMode:NSLineBreakByCharWrapping];

Set the new height as,

[webview sizeThatFits: expectedLabelSize];

or

CGRect newFrame = webview.frame;
newFrame.size.height = expectedLabelSize.height;
webview.frame = newFrame;

Hope this may help you.

Thanks for the answer. The UIButton suppose to opens up a segue to another view controller as oppose to another webview — user3081516, Nov 04 '14 at 06:17
It is working fine. But how do I disable the scrolling and use dynamic height. Because it may be 1, 2 or more lines depending on the length of the text — user3081516, Nov 04 '14 at 06:35
Hi Neenu, thanks alot. Everything is working except the dynamic height. I believe sizeWithFont is deprecated. — user3081516, Nov 04 '14 at 06:58

Ramesh Muthe · Accepted Answer · 2014-11-04T06:43:15.857

NSString    *link = @"<a href=\"movetonextscreen\" style=\"text-decoration:none; color : #000000;\"><b>Kobe Bryant</b></a>";
NSString    *html = [NSString stringWithFormat:@"%@ your text", link];
UIWebView   *webView = [[UIWebView alloc] initWithFrame:cell.contentView.bounds];
webView.delegate = self;
[webView loadHTMLString:html baseURL:nil];

In the delegate method you do this

- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType
{
    if (navigationType == UIWebViewNavigationTypeLinkClicked)
    {
}
}

After loading the text now fix the height of webview to the content

-(void)webViewDidFinishLoad:(UIWebView *)webView {
    CGRect newBounds = <webView>.bounds;
    newBounds.size.height = <webView>.scrollView.contentSize.height;
    <webView>.bounds = newBounds;
}

Disable scrolling

self.<WebView>.scrollView.scrollEnabled=FALSE;

When I have the webView as 3 lines, after I click on the Button it shrinked to 2 lines — user3081516, Nov 04 '14 at 06:44

score 1 · Answer 3 · edited May 23 '17 at 12:13

You can UITextView with attributed String setting to do this trick for you. Check out this link for how to do this.

Another Approach :

If you want to add a weblink to textview you can use following code snippet.

NSMutableAttributedString * str = [[NSMutableAttributedString alloc] initWithString:@"Test"];
[str addAttribute: NSLinkAttributeName value: @"http://your link" range: NSMakeRange(0, str.length)];
yourTextView.attributedText = str;

To detect if a link is tapped.

Combining the ideas above you can set a custom URL say http://linktapped. When you tap this you would get a call in App delegate. You can check if it your URL and do appropriate action needed(Instead of opening safari).

IOS Multiple line Label floating around a UIButton

3 Answers3