Managing the Camera

Zappar utilises the camera feed of the device and can capture images and gifs. This article outlines Zappar's functionality for using and managing the camera.

Taking a Snapshot

Zappar can capture a photo of the screen, including any visible objects and the camera feed. Neither Zappar's toolbar, nor any operating system provided status bars or UI, are included in the snapshot.

A snapshot is taken by calling the snapshot( ) function.

Z.device.snapshot(); // Take a snapshot

After taking a snapshot the user will be presented with a preview of their image along with the option to save it to their device or share it.

Passing either a string or a SocialOptions argument to the snapshot function makes it possible to pre-fill the share window with an accompanying piece of text. Note that some share methods, such as Facebook, choose to ignore this message and present an empty dialog to the user.

// Take a snapshot with a default message to pre-fill in the share dialogue
Z.device.snapshot("Check out my cool picture!");

If you wish to prevent your users from sharing their images on social media then pass a SocialOptions interface with social set to false.

Recording a Gif

A gif is recorded by using the gif( ) function. Gifs recorded in Zappar are 90 frames long.

Z.device.gif(); // Take a 90 frame gif

As with snapshot, gif can be passed an optional string message or SocialOptions argument to pre-fill on any share dialogues. In addition it can also be passed a function to be called once the gif has finished being taken. This can be used to restore any UI you may have hidden for the gif.

// Taking the gif
Z.device.gif("Check out my gif!", returnUI);

// The function called after the gif has been taken
function returnUI(){
    // Restore the UI by activating a controller state with the UI visible.
    Z.controllers.UI.elements.visible.activate();
}

Switching Between Cameras

By default Zappar will use whichever camera the device has marked as the default camera. This is usually the rear-facing camera.

Camera switching is handled by a CameraManager node, so the first step is to create one. This is achieved by right clicking on the root node within the Hierarchy of a project and selecting New > CameraManager.

Once created the CameraManager node can be dragged from the Hierarchy into a Script node. Selecting the 'Insert as local variable' option will create a variable that can be used to access the CameraManager.

// A variable created by dragging a CameraManager node into a script node.
var cameraManager = symbol.nodes.cameraManager;

To switch to the front facing camera call the useFrontCamera( ) function on the CameraManager variable, for the rear facing camera call useRearCamera( ), and for the default camera call useDefaultCamera( ).

cameraManager.useFrontCamera(); // Switch to the front facing camera
cameraManager.useRearCamera(); // Switch to the rear facing camera
cameraManager.useDefaultCamera(); // Switch to the default camera

Note that front facing cameras are mirrored.

CameraManager emits events on switching between cameras. These events are: frontcamera and rearcamera.

Camera_Manager.on("frontcamera", () => {
// Do something when front camera is activated
});

Disabling and Enabling the Camera Feed

Zappar enables the camera feed by default but it can be disabled if not in use. Disabling the camera feed will increase the performance of your zap, and reduce battery drain.

The camera feed can be disabled by calling the enable(...) function and passing false as the argument.

// A CameraManager node variable.
var cameraManager = symbol.nodes.cameraManager;

// Disable the camera feed
cameraManager.enable(false);

Conversely, the camera feed can be re-enabled by passing true to the enable function.

cameraManager.enable(true); // Enable the camera feed
zapcode branded_zapcode i