开发微信小游戏步骤

一句代码带你体验微信小游戏。

嘿嘿!

1.打开工具

2.建立自己的小游戏

选择小游戏,并点击" + ":

AppID:

打开微信公众平台,按以下步骤找到AppID,后端服务,自己初试建议选择" 不使用云服务 ",自己写并不需要太多,只需要了解就行,所以建议选择" 不使用云服务 ",应个人情况来定。选择后并选择一个模板,可以选择第一个,看看效果,由于小科是编程,所以选择上图中第二个3D;

正常打开如下:

打开后如果一直处于以下状态,请下载最新版" 微信开发者工具 ";

3.开发游戏

(1).创建一个模型----以方形为例

右键点击" Main Camera ",依次点击下图方框里面的内容

完成后如下图:

出现这样,可以鼠标放在白色区域滚动鼠标,就可以看见图像,也可以双击" Cube_1 "如下显示:

(2).让方形动

首先,点击图中标记 " Inspector "

点击后如下,找到" Transform3D --> position " 在 " z "表示的框里面填 " 5 ",方便小程序运行起来观察

完成后按" ctrl + s " 保存,会出现下图所示,图中" 文件名称 "自定义,完成后点击" 确定 "

完成后会在下图中生成一个以" .scene "为后缀的文件文件名称就是上图自定义的文件名称。

右键点击下图中" assets ":

新建一个" script ",我们这里是用typescript去让控制方形动。

把新建的typescript文件进行绑定

直接把图中" xiaoke.ts "文件托到" Cube_1 "处,并按" ctrl + s " 保存

查看是否绑定成功

点击" Cube_1 "看" Inspeector " 中下滑看是否有下图中标出位置内容,如果有,表示绑定成功,如果没有,表示绑定不成功。则需要重新绑定;

编写" xiaoke.ts "文件,右键点击,选择 内置编辑器 进行编辑;

打开后,若没有打开文件,则需要找到文件路径

文件路径如下图

文件名称对应文件

找到后找到对应的文件名称并打开。

文件内容如下:


import engine from "engine";
@engine.decorators.serialize("xiaoke")
export default class xiaoke extends engine.Script {
  @engine.decorators.property({
    type: engine.TypeNames.String
  })
  public name: string = "myname"
  
  public onAwake() {

  }
  public onUpdate(dt) {

  }
  public onDestroy() {

  }
}

在 " public onUpdate(dt)() " 输入以下代码,保存后,关闭编辑器,回到页面后再保存一下; 

this.entity.transform.rotate(engine.Vector3.createFromNumber(15*dt,30*dt,45*dt),true,false)

保存好后,点击" xiaoke.ts " 在" Inspector " 中图中所框处有输入的代码则表示保存成功;

完成上一步后,点击图中标记位置( 播放 )

点击后就可以动了

点击停止后回到编辑页面。

(3).在手机或者电脑运行

点击" 编译构建 ":

选择" 构建工程 "

注意:构建工程打开位置可能不一样。

打开后点击选择任务,选择相对应的进行实现,这里以h5为例:

选择任务 ---> H5小游戏

选好后点击  开始构建

点击后出现以下选择

选择完后一直点确定,等加载完

下图是加载完后的成功图,点击确定

找到构建过程

找到H5小游戏,并点击里面的本地调试

点击后加载完成

完成后会跳转到网页,如下图则成功。

去试试吧,完。

  • 8
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

小科先生

感谢大哥送的小钱钱

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值