Phaser3.50 examples Camera 笔记

这里记录的是 Phaser3.50 示例中的 Camera 部分 api 的用法。详情还是看 Phaser api 文档比较好。

Camera

游戏里所有的对象都是通过摄像机看到的。摄像机大小默认和游戏一样。但可以通过 setViewport 和 setSize 调整。

16 Camera Test

class example extends Phaser.Scene {
  constructor() {
    super()
  }

  preload() {
    this.load.baseURL = globalConfig.baseUrl
    this.load.image('einstein', 'assets/pics/ra-einstein.png')
  }

  create() {
    this.image = this.add.image(200, 150, 'einstein')
    this.cameras.main.setSize(200, 150)

    for (let y = 0; y < 4; y++) {
      for (let x = 0; x < 4; x++) {
        if (x === 0 && y === 0) {
          continue
        }

        this.cameras.add(x * 200, y * 150, 200, 150)
      }
    }
  }

  update () {
    this.image.rotation += 0.01
  }
}

const config = {
  type: Phaser.AUTO,
  parent: 'demo',
  width: 800,
  height: 600,
  scene: [example]
}

const game = new Phaser.Game(config)

this.camera.main.setSize(width [, height])

默认情况下，main 摄像机就是第一个摄像机。下面设置的位置、宽高都是指摄像机的视野（viewport）

参数	说明
width	摄像机宽度
height	摄像机高度。默认为 width

this.cameras.add([x] [, y] [, width] [, height] [, makeMain] [, name])

添加摄像机。摄像机管理器最多支持 31 个不同的摄像机。

参数	说明
x	摄像机水平位置。默认 0
y	摄像机垂直位置。默认 0
width	摄像机宽度。默认游戏宽度
height	摄像机高度。默认游戏高度
makeMain	是否设置为 main 摄像机。默认 false
name	摄像机名称。默认 ”

Add Camera On Click

this.cameras.getTotal([isVisible])

获取摄像机数量。isVisible 表示是否只获取显示的摄像机。

Background Color Interpolate

new Phaser.Display.Color([red] [, green] [, blue] [, alpha])

返回颜色类，参数都为 0~255. alpha 默认 255，其余默认 0.

this.cameras.main.startFollow(target [, roundPixels] [, lerpX] [, lerpY] [, offsetX] [, offsetY])

设置摄像机追踪某个游戏对象。

参数	说明
target	游戏对象
roundPixels	摄像机位置是否取整，以避免次像素渲染。默认 false
lerpX	0~1 之间。水平方向线性插值量。值越接近 1，跟踪速度越快。默认 1
lerpY	垂直方向，同上。
offsetX	追踪时的水平偏移量。默认 0
offsetY	垂直方向。同上。

Phaser.Display.Color.Interpolate.ColorWithColor(color1, color2 [, length] [, index])

获取两种颜色指定位置的插值。（大概是这样）

参数	说明
color1	第一个颜色
color2	第二个颜色
length	两个颜色之间的距离。默认 100
index	插值位置。默认 0

this.cameras.main.setBackgroundColor([color])

设置摄像机背景。默认 rgba(0, 0, 0, 0)。

---

这种学习方式效率太慢了。笔记不记了。直接看案例查 api 吧。