# ct.camera new in v1.3
This page describes the methods and parameters of
ct.camera object in a form of a reference. You can learn about techniques and usage in a more free form at the "Working with Viewport" page.
# Camera's Geometry
The real x and y coordinates of the camera. It does not have a screen shake effect applied, as well as may differ from
targetY if the camera is in transition.
The x and y coordinates of the target location. Moving it instead of just using the
y parameter will trigger the drift effect.
The resulting position of the camera in game coordinates. These have screen shake and
The width and height of the camera of the unscaled shown region. Use
ct.camera.scale to get a scaled version. To change these value, see
A value in degrees that rotate the camera.
A scalar value that scales the capturing rectangle. If compared to image viewing tools,
1 means no scaling,
0.5 will zoom in to a 200% view,
3 will zoom out and produce 33% scaling.
These represent the resulting location of a particular side of the camera in game units. Those cannot be changed manually.
ct.camera.moveTo(x, y) and
Both move the camera to a new position.
ct.camera.moveTo is useful for cutscenes and smooth transitions between objects, as it works with
ct.camera.teleportTo does not cause transitions and reset screen shake effects. It is useful for instant precise changes, e.g. when moving a camera to a distant location.
ct.camera.uiToGameCoord(x, y) and
Convert a point from one coordinate space to another. These return an array with two elements: x and y coordinates.
There are also
ct.u.gameToUiCoord, that call these methods of the current
Return an array with two elements, x and y coordinates. These are in game coordinates, and take rotation and scaling into account.
Returns a bounding box of the camera, in game coordinates. See PIXI.Rectangle (opens new window) for its properties.
# Following a Copy
If set, the camera will follow the given copy.
follow is set to a copy. Setting one of these to
false will disable automatic camera in a given direction.
follow is set to a copy. Sets the frame inside which the copy will be kept, in game pixels. Can be set to
null so the copy is set to the center of the screen.
# Screen Shake and Wobble
The current power of a screen shake effect, relative to the screen's max side (100 is 100% of screen shake). If set to 0 or less, it, disables the effect.
The current phase of screen shake oscillation.
The amount of
shake units substracted in a second. Default is 5.
The base frequency of the screen shake effect. Default is 50.
A multiplier applied to the screen shake effect. Default is 1.
The maximum possible value for the
shake property to protect players from losing their monitor, in
shake units. Default is 10.
These make camera move only inside a specific rectangle. By default, the camera can move boundlessly, unless set otherwise inside the room editor.
You can set all of these properties, or only some of them.
To unset one of these values, use, for example,
delete ct.camera.minX;, or write
ct.camera.minX = undefined;.
If set to a value between 0 and 1, it will make camera movement smoother
These displace the camera in UI units, but do not change
Realigns all the copies in a room based on new dimensions of a camera. This is useful for quick positioning of UI elements on different screens. New position is the result of interpolation based on copies'
ystart parameters, so it won't work with moving elements. You can skip the realignment for some copies if you set their
skipRealign parameter to
The method is usually applicable to fittoscreen's "Expand" and "Scaling without letterboxing" modes only.
|No ||With |
# Example: Realing UI elements in a room
On Draw code of your UI room:
Yup, that's it!
This will align all non-UI layers in the game according to the camera's transforms. This is automatically called internally, and you will hardly ever use it.
# Spawning a new instance of a camera
You can create a new camera object for your needs by calling a
const oldCamera = ct.camera; ct.camera = new Camera(0, 0, 1024, 768);