美文网首页
微信小程序Canvas文本加H5标签 示例之 翔球王足球答题--

微信小程序Canvas文本加H5标签 示例之 翔球王足球答题--

作者: mario89 | 来源:发表于2018-06-13 14:36 被阅读0次

    最近各种排版的微信小程序从最开始的“2018我的毒故事”到“高考”小程序,把朋友圈火了一个遍。尽管现在微信没有开放从小程序转发朋友圈的接口,但是大家为了炫耀浮夸的“自我认知”,非常愿意进行复杂的操作完成分享流程。

    无论是“毒故事”还是“高考”都是服务器或者是后端生成了图片之后,让小程序下载图片进行展示。这个好处就是完全不用考虑适配的问题,但是这完全抛弃了小程序的canvas画图api。而且机动性太差,每次添加一个素材都需要很大的维护成本。

    在这里分析一个完全用微信自带的api完成的文本展示小程序:翔球王足球答题。这名字令人印象深刻啊。。。

    他们的图是这样的:

    这些图完全是根据图片的位置以及字体的大小高度来计算摆放的。

    这个实现方式的思路倒是不复杂,只需要根据正则表达式去匹配对应的h5标签,对字体的宽和高进行计算即可实现。

    有了这个小程序的示例,也给了开发者一些信心。原来微信的自带canvas并不是一无是处!

    相关文章

      网友评论

          本文标题:微信小程序Canvas文本加H5标签 示例之 翔球王足球答题--

          本文链接:https://www.haomeiwen.com/subject/snnfsftx.html