webview - iOS今日头条详情界面实现
迷茫
迷茫 2017-04-18 09:34:42
0
4
1086

哪位大神了解或者有思路了解今日头条的详情界面是如何实现的吗?或者网易新闻的文章详情界面都是如何实现的?

迷茫
迷茫

业精于勤,荒于嬉;行成于思,毁于随。

全部回复(4)
左手右手慢动作

我没装今日头条,不过几乎所有新闻类app的正文都是webview。
以网易新闻为例,整个是一个webview,新闻正文加载进去后告诉js留白,让客户端填充下面的分享、广告、热门跟贴、相关新闻等。 或者scrollView上放显示正文的webview,下面放分享、广告、热门跟贴等等。
webview跟js的通讯方式你应该知道了,至于怎么包装webview的像客户端控件,其实都不是难事,比如获取页面总高度、获取缩略图rect、自定义menu、设置body的background透明、让客户端执行某代码比如分享比如打开跟帖界面等等。

这是总体思路,我很早前做过一个东西,跟新闻正文页差不多,不过js可以任意控制页面,支持web的和native的控件。老板希望客户端跟web应用一样,随时可以改界面,新增活动页面等等。

至于你说的传json,传json只是数据怎么传输,但是你问的是界面怎么实现。两者没有关系。

再多说一点,关于页面缓存。像新闻详情页这种高频展示的webview,一般都是要做页面缓存的,你可以制定规则来缓存html/css/js,也可以打包进app,或者两者兼有。缓存后的页面加载起来毫无压力。你能知道网易新闻正文传的是json,那你可以翻翻app bundle 和 documents/library等目录,肯定有页面缓存。

然后是数据。缓存的界面只是个空架子,只有样式没有数据。填充数据的方式很灵活,看你个人喜好和实际测试的效果来定。可以让 ajax 请求数据然后填充p,也可以在让客户端在架子页面加载完后执行js填充进去,也可以让不参加缓存的部分(比如iframe)自带数据,或者兼有。
因为打开详情页会有一个http请求,获取热门跟贴和跟贴数等数据,此时也可以把新闻正文返回给客户端,这样客户端就有了所有数据,展示页面会更快。 这只是一个优化点。

整体流程就是:
pushController -> hidden all views -> load page cache -> fill page data -> layout other native controls

左手右手慢动作

用webview加载html,详情自己可以百度

Peter_Zhu

给你篇文章看看 http://www.jianshu.com/p/1495...

左手右手慢动作

webview加载html,排版是html的工作

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板