iOS之UIWebView图文混排技术

摘要

今天小编跟我讲,有一个同学要利用UIWebView进行图文混排,其实图文混排的几种方式,我在之前的博客里面已经讲过,在这里就不再讲述了,如果大家需要看,请参考之前的那篇博文

iOS中不同形式的图文混排技术的实现总结

 那么今天讲什么呢,既然提到UIWebView的图文混排,今天还是给大家做一个详细的讲解.首先我们来看看整体的效果.

再正式讲之前,我想让大家先弄清楚这样几个问题:
  1. 什么是图文混排?
  2. 如何进行图文混排?
  3. 图文混排的几种方式?
  4. 用UIWebView进行图文混排有什么好处呢?

  只有弄清楚这些问题,我们才能更好去理解它和运用它,而不是糊里糊涂的去做.下面我来给大家一一进行解释这几个问题.

1. 什么是图文混排?

官方解释:图文混排是指将文字与图片混合排列,文字可在图片的四周、嵌入图片下面、浮于图片上方等。

如果大家还是不能理解,我们用一个图进行说明,大家请看图:
iOS之UIWebView图文混排技术_第1张图片

上图就是一个图文混排的例子.简单大概就是这种形式,大家可能会有疑问了?这实现不是很容易么?我用一个UILabel加上UIImageView或者自定义UIbutton不就很容易实现吗?你这样说没错,可以实现,但是我们今天讲的图文混排,并且混排方式是UIWebView,那么应该怎么实现呢?这就是我接下来要给大家讲解的如何利用UIWebView的图文混排来实现.

2如何进行图文混排?

下面就直接上代码了,大家一看就明白

大家如果看这看不清楚,我后面会上传代码,大家下来运行一下看一下效果就明白了.
下面我们来看看图文混排的几种方式.

3. 图文混排的几种方式?

1. 富文本形式
2. core Text(文字排版)
3. TextKit
4. UIWebView
  这里就不给大家一一进行介绍了,大家如果想看具体的解释,请查看文章:

http://blog.csdn.net/BaiHuaXiu123/article/details/51366008

4. UIWebView图文混排的效果显示?


iOS之UIWebView图文混排技术_第2张图片
iOS之UIWebView图文混排技术_第3张图片

4. 用UIWebView进行图文混排有什么好处呢?

如果用webview来呈现图文混排,这样内容就是多样化的,达到了图文混排的效果。如果有点击图片放大、保存这些功能也能实现,只需要和H5的同事约定要js的调用规则就行,这就就可以简单的实现图文混排.H5与OC交互也是今后APP运用比较的广泛.

5 结束

代码下载地址:
http://download.csdn.net/detail/baihuaxiu123/9532277

你可能感兴趣的:(ios,技术,UIWebView)