踩坑微信开放标签wx-open-launch-app

微信开放标签拉不起App了, 百思不得其解。可是之前开发的另外一个页面可以。
因为线上环境才能验证,所以也没没法看日志。点击开放标签就一直没反应,不能拉起App。但刷新下就可以拉起App。定位很久才发现,微信分享地址和真正打开的地址是不一样的。

阅读剩余部分 ->

Cookie 能跨域读写吗?

一直对跨域共享cookie有个误区,以为只要满足了某些条件,就能让A域名的页面读取到B域名的cookie,经过一番研究,发现根本是不可能的,因为cookie遵循严格的同源策略,不管什么条件,都不能共享。

阅读剩余部分 ->

如何基于vant进行二次开发

为什么要二次开发

最重要的一个问题还是效率问题,团队需要整体的UI风格,相同的配色,相同的功能组件,如果每个人独自开发那就大大浪费人力。虽然vant已经封装的不错了,但距离业务需求还差一点距离。第二点是设计师视觉走查的时候特别耗时,扣像素级别的问题,因此避免前端开发同学多次被折磨,做成统一的完事儿,同时也提升了走查的效率。归根结底,效率是第一生产力!

阅读剩余部分 ->

iPhone手机播放audio音频的一些问题

预加载和自动播放问题

本以为预加载是一件理所应当的事情,有的音频文件这么大,不可能要等到用户点击播放按钮的时候才去加载,这肯定会存在延时问题。

Note: The preload attribute is supported in Safari 5.0 and later. Safari on iOS never preloads.

苹果官方技术文档解释:只有等到用户真正的点击页面才会去加载资源文件。用户触摸之前永远不会加载音乐文件或元数据。这是为了确保网页不会要求在移动设备上下载大量音乐或数据,这可能会占用大量移动数据。因此,无论您的代码有什么,预加载标签在移动 Safari 中基本上总是设置为“无”。

所以这里唯一的解法就是在交互上做一点处理,毕竟用户的网速不可控,在音频可播放之前显示loading状态,一直等到可播放为止。 那有什么事件说明可以播放了呢?一顿搜索,canplaythrough事件可以满足!

当终端可以播放媒体文件时触发该canplaythrough事件,估计加载足够的数据来播放媒体直到其结束,而不必停止以进一步缓冲内容。 caniuse 一查,主流大部分系统版本都支持。

当用户点击按钮后,发现还不能播放,那就loading等,一直等。如果播放播到一会儿网络卡了那么就在waiting事件监听。

神奇的currentTime

iphone手机下,如果在不恰当的时机设置currentTime(播放会跳跃到指定的位置),会导致后续设置currentTime无效。一定要在onCanPlay回调事件后设置currentTime才不会导致问题。

audio总时长

插播一个Android手机的问题,乐视手机出的一个bug

获取不到音频的总时长,以下方法没有一个能获取到

@canplay="onCanPlay"
@timeupdate="onTimeUpdate"
@loadedmetadata="onLoadedMetaData"
@ended="onEnded"
@loadstart="loadstart"
@durationchange="durationchange"
@canplaythrough="canplaythrough"
@loadeddata="loadeddata"

在用户没有主动点击播放按钮前,无论怎么样都拿不到,即使是setInterval 也不行。所以只能是在play后再显示总时长。audio的duration属性就是总时长,但产品功能上略有瑕疵,默认状态下显示不了总时长。

【Cocos Creator】游戏中如何动态创建精灵?

如果你刚接触cocos creator,可能有点摸不着头脑,尤其是对cocos 的api文档非常迷,个人觉得官方应该针对api在下方补充一些示例代码说明,不然新手容易懵逼。

本期要讲的话题是如何动态创建精灵。开发游戏可能一半的时间花在跟IDE打交道,如果对IDE有一定了解的话,cocos中节点是游戏中最基本的组成元素,那么基于这节点我们基本上可以实现所有的功能。但我建议能够用IDE拖拽出来的,就千万别用JavaScript徒手写出来,不然场面会很难看。

阅读剩余部分 ->

精通这3种游戏动画技术,月薪30000不是梦

动画是游戏中最基础的部分,所以要掌握游戏开发必须要清楚动画的一些基本常识。今天来介绍下常见的三种动画。

属性动画

大部分人对动画的印象就是位移,角色以一定的速度运动就完成了一个简单的动画效果。如下图所示

精通这3种游戏动画技术,月薪30000不是梦

每一帧将星球的Y坐标增加10个像素,这样星球就会一直向屏幕上方移动。同理,如果是改变X坐标,那么就会往屏幕左右方向移动。不仅能改变位置还能改变大小、透明度、旋转角度,这都是基于改变角色自身的属性。

阅读剩余部分 ->

可视化编程的一二事

最近两年时间都花在可视化编程上,谈谈对它的一些思考。

最近几年少儿编程正在风口,很可惜我们团队的目标并不是这个,不然也能融上一笔钱,我们自己的产品在同类来看并不会太差。国外比较知名的产品就数scratch这个产品,前些时间由于内容风控问题,被国内墙了。那么只有一家独大的编程猫,其他的机构并无太知名,做的事情也只是偏培训,而非产品本身。
可视化编程的一二事
这是我们最近两年都在做的事情,小游戏可视化制作工具。我们的目标是让不会写代码的人能够做出游戏,这个目标会比编程猫的难做的多。毕竟成品的游戏和教少儿“编程”是两件很不一样的事情。后者更注重教,需要的是课堂,课件,老师,对产品本身的要求并不会那么高。老师和学生只需要在这个平台上能够产生内容,而对内容本身的品质是不需要高要求的。但让人做出游戏这个事就远飞那么简单,希望用户能创作出作品,真实可玩的线上游戏。而游戏制作本身就是一件非常专业的事情。

阅读剩余部分 ->

《星途WeGoing》难点与技术优化

一、难点

1、iPhone X等手机适配。

标准设计稿尺寸为 750px:1334px,在iphone 6等手机上可以完美适配。但在部分长屏的手机(如iphone X,三星等部分手机)上可能会出现底部黑边。

最开始的适配是在头部和底图加上填充图片,最终用户看到的游戏尺寸还是750px:1334px。但这样看起来很丑。

后来继续优化了一版,完美适配iPhone X。算出屏幕的尺寸与设计尺寸的差值,将舞台中的元素做一下偏移,如果贴边的元素则调整场景中的其他元素,以适配整体视觉。

阅读剩余部分 ->

微信小游戏开发的基础知识

下图是Laya官方的一张介绍图片,游戏引擎涵盖的东西比较多,掌握游戏开发必须要掌握这些东西,这次讲讲一些游戏中的基本概念。

一、游戏引擎

市面上的H5游戏引擎好多,国内外比较知名的有Egret、Cocos、Laya、Phaser、Three.js等等,各引擎实现上有区别,但游戏里面的一些基本概念都差不多。触类旁通,切换引擎的成本就只在于对引擎API的熟悉。

阅读剩余部分 ->