上一篇:Fusion App入门

.

下载着Apoup(风铃)APP的朋友都知道,点击文章会出来一个文章详细页面。

在这个文章详细页面看完文章后返回直接就到首页不用像浏览器那样缓慢的重新加载。

这样有助于提高用户的整体体验,让交互更加的舒适流畅,现在每个APP几乎都是点击文章会出来一个文章详情的二级界面。

那么Fusion App套壳的网页怎么实现这种文章详细界面加载呢?

我们依旧用哔哩哔哩的网站作为例子,既然想要点击的文章加载到另一个界面就需要在Fusion App中创建一个子页面。

在制作的APP配置界面首页找到子页面,创建子页面同样的是4个模板选一个喜欢的就行了,然后我们给这个子页面命名为“视频页”

创建子页面后我们在APP配置首页找到网页即将加载

找到后将下面的代码配置进去。

成品图

.

if (string.find(网页链接,"https://m.bilibili.com/video/"))
then
  停止加载()
  进入子页面("视频页",{链接=网页链接})
end

这个代码的意思就是,当加载的链接中有包含https://m.bilibili.com/video/的链接将用子页面视频页加载。

可能出现的疑问?

为什么要用https://m.bilibili.com/video/这个链接?

因为哔哩哔哩的所有文章详细地址是这个样子的

https ://m.bilibili.com/video/av49470985.html?spm_id_from=333.400.b_766964656f5f32

这是一个非常复杂的链接而我们需要提炼每个文章链接中都包含的那一段链接。

经过挑选发现哔哩哔哩中每个文章链接中都包含这个链接https://m.bilibili.com/video/我们直接将这个链接填写到代码中。

总结:

①创建一个子页面,然后给他起一个固定的名字。

②将代码配置到网页即将加载中,配置匹配链接和子页面名称。

如果想加第二个匹配规则可以在end上添加第二个匹配规则,除了第一个匹配规则之外从第二开始if前面都要加上else像这样。

--浏览器即将加载新的网页时执行的事件

--接收参数
浏览器对象,网页链接=...
if (string.find(网页链接,"https://m.bilibili.com/video/"))
then
  停止加载()
  进入子页面("视频页",{链接=网页链接})

elseif (string.find(网页链接,"http://music.163.com/"))
then
  停止加载()
  进入子页面("子页面",{链接=网页链接})

  end

-Apoup杂志-

转载请标明原文链接