iOS新闻类 内容界面设计思路

新闻内容页要考虑的问题

• 发布者编辑文章是什么格式？简单文本？markdown? 富文本编辑器？
  • 为了图文混排和文本的丰富性（标题，段落，加粗），建议使用markdown或者富文本编辑器。不使用简单文本。
• 如何适配多个平台？

方式1：

• 源码构建，就是图文混排了。能够使用使用较低层的YYKit异步渲染将性能优化到极致。
• 缺点：渲染引擎实现难度蛮大的。

方式2：

• 使用webView,这种方式最简单。有适配多平台的自然属性。
• 缺点：当多图时，性能较差；交互自定义程度不高。

方式3：

原生+webView配合实现。

• 核心思想：webView渲染文本，并预留图片视频等耗时资源位置。使用原生组件加载图片等资源并显示。
• 具体实现：
  • 对webView进行封装， 方便js和native调用
  • 在控制器中使用scrollView嵌入webView和tableView。webView展现内容，tableView负责展现广告，相关推荐，评论等内容。 代码控制webView，tableView的位置，高度，offset属性。
  • 将html中图片，video等替换成占位符。注意宽高。（使用js）
  • 在load加载完后，获取各item（图片，video）的数据（位置，寛高，类型，url等）
  • 使用原生组件进行替换
  • 优化原生组件（循环使用，避免内存太高）
  • gif在滑动时中止展现， 能够使用gif库

效果

Demo

github.com/hejunm/wkTe…