开发者

iOS wrapping text around an image

I've got a few short paragraphs of text that I'd like to place wrapped around an image in my app's view. 开发者_开发技巧Typically, the image will be on the left side of the text and the text would flow as you normally expect. The image has varying height and width and size-wise, 4-30kb png files. The text has varying length and can be anywhere between 2 sentences to a few paragraphs. There's markup with text so different lines can be formatted accordingly.

I've been using UIWebView within my UIView to do this in the quickest manner but what I've noticed is that even though my text and images are local, there's a noticeable delay in when the UIWebView loads and shows the image and text. Basically, you see the view area blank and then a short moment later, you see the image load. Most of the time, the text is shown as loaded before the image.

I'm using UIWebView's 'loadHTMLString' to load the local html text and images.

What I want to achieve would look like:

| [     ] | Some text starts here and is long enough to fil until the end of the line. Then
| [image] | the text continues so it wraps around a few more lines to fit the entire
| [     ] | height of the image.
Eventually, we'll show the text below the image, just like you see in a newspaper.
The content would continue at variable length for the rest of the screen.

Is there a better way to display formatted text with images? If there's something better than UIWebView, I'd love to move to that.


I think your basic strategy should be (1) try to get the performance of UIWebView to an acceptable level and (2) if that fails, and it's really important, roll your own text layout code.

Some ideas:

  • Try to load content into the UIWebView class as early as possible, before it is displayed on screen.
  • See if using inline styles (instead of a linked stylesheet) improves load time.
  • See if using inline images (by using <img src="data:...") improves load time.

If none of that works, and you want to roll your own, you're going to have to write your own text layout code. You could probably do this by using NSString's UIKit additions: split the text into words, compute the size of each word (using sizeWithFont:), and lay out the text line by line. You should probably compute on a word-by-word basis, but actually draw a whole line at a time, that should perform better. Or you might be able to make a new string with newlines inserted at the right places and draw the whole thing in one go.

Good luck!


Try the following .This is without CoreText and Html

UIBezierPath * imgRect = [UIBezierPath bezierPathWithRect:CGRectMake(0, 0, 100, 100)];

UIImageView *imageView= [[UIImageView alloc]initWithFrame:CGRectMake(0, 0, 100, 100)];
imageView.image=[UIImage imageNamed:@"defaultImage"];
[self.textView addSubview:imageView];
self.textView.textContainer.exclusionPaths = @[imgRect];
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜