开发微信小游戏步骤

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

嘿嘿！

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小游戏，并点击里面的本地调试

点击后加载完成

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

去试试吧，完。