微信小程序吸粉游戏开发步骤详解
微信官方最初限制了不支持小程序游戏,但是开发者们百般尝试之后找到了开发小程序游戏的方法。以下就是微信小程序吸粉游戏的开发全过程,希望能对大家有所帮助。
1、下载开发工具
2、创建项目扫码后进入
选择添加小程序项目
选择无AppID,也可以开发,但不能在手机上浏览。等以后开放后再搞吧。后面的操作官方教程上面都有了,我主要分享写代码经验。 3、修改项目创建一个代码示例项目,如图
删除logs文件夹,只保留index文件夹,注意删除logs后,要更自以为是app.json
{
"pages":[
"pages/index/index"//注意删除原来的logs
],
"window":{
"backgroundTextStyle":"light",
"navigationBarBackgroundColor": "#000",
"navigationBarTextStyle":"white",
"navigationBarTitleText":"2048小游戏"
}
}
这样一个基于的项目架子就搭好了
4、编写代码代码:我已写了一个简单的,微信小程序吸粉游戏效果图如下:
5、开发中遇到的一些问题 1、没有滑动事件,又不能引入其它JS库,只能自己写一个,还好比较简单。主要利用touchstart、touchmove、touchend三个事件来解决这个问题 2、不能直接更新page.data中的数据,要使用this.setData这个函数,才能重新渲染小程序页面。其中最麻烦的更改data中的数组。
changeData : function( index,num ) {
var changedData = {};
changedData['mydata[' + index + ']'] = num;
this.setData(changedData);
}
这个一开始还不知道后面看文档才明白 3、动画处理在H5中直接更改Dom加样式就行了,在小程序中要使用animation这个类,在一开始写代码时没考虑到动画问题,所以数组结构出了点问题,所以动画做得不好。
//初始化动画
this.data.animation = wx.createAnimation({
duration: 100,
timingFunction: 'ease',
});
this.data.animation.scale(1.2,1.2).step().scale(1,1).step();
//渲染时
{{item ? item : ''}}
参照上述步骤和流程,微信小程序吸粉游戏就可以开发出来了,大家如果测试之后可以使用,就赶紧分享给朋友们吧!更多实用的小程序和相关资料就在微信小程序商店。
微信小程序开发游戏可以实现吗?
小程序游戏怎么做?小程序吸粉小游戏源码
小程序扫雷游戏怎么开发?小程序扫雷游戏开发实例
上一篇:怎么开发微信小程序播放音频功能?
下一篇:如何实现小程序动画点赞特效?