# captureImage

## Description

Activates the camera of the mobile device to capture image.

## Input / Parameter

| Name    | Description                                                                             | Input Type | Default | Options | Required                                |
| ------- | --------------------------------------------------------------------------------------- | ---------- | ------- | ------- | --------------------------------------- |
| quality | The quality of the saved image. (Ranging from 0-100, where 100 is the full resolution.) | Number     | -       | -       | Yes                                     |
| height  | The height to scale the image to, in pixels.                                            | Number     | -       | -       | Partial (Yes if 'width is provided'.)   |
| width   | The width to scale the image to, in pixels.                                             | Number     | -       | -       | Partial (Yes if 'height' is provided'.) |

## Output

N/A

## Callback

### callback

The function to be executed if the camera captures an image successfully.

### errorCallback

The function to be executed if the camera does not capture an image successfully.

## Video

Coming Soon.

## Example

The user wants to take a photo using their mobile device and view the photo in the image component.

### Steps

| No. | Description                                                                                                                                                                                                       |                                                                                                                                                                                                           |
| --- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| 1.  | ![](https://399701567-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwmJ1RKjM2uNFaL6fO3Xu%2Fuploads%2Fgit-blob-285ef8c8438bacddf342dd627c272a310ab28533%2FcaptureImage-step-1.png?alt=media) | Drag an image and a button component to a page in the mobile designer.                                                                                                                                    |
| 2.  | ![](https://399701567-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwmJ1RKjM2uNFaL6fO3Xu%2Fuploads%2Fgit-blob-82b526f58d497f629addd082a5e7d4bc36841d55%2FcaptureImage-step-2.png?alt=media) | Select the event `click` for the button and drag the function `captureImage` to the event flow.                                                                                                           |
| 3.  | ![](https://399701567-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwmJ1RKjM2uNFaL6fO3Xu%2Fuploads%2Fgit-blob-0251f7a312714683a4e3ceb5a72451d8c43ce614%2FcaptureImage-step-3.png?alt=media) | Fill in the parameters of the function.                                                                                                                                                                   |
| 4.  | ![](https://399701567-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwmJ1RKjM2uNFaL6fO3Xu%2Fuploads%2Fgit-blob-b3acd2d8f230126ff8ce062afcf9b679838a8c77%2FcaptureImage-step-4.png?alt=media) | Drag the the function to be executed if the image is captured successfully to the node below the function. In this example, we are using the `setComponentValue` to set the image to the image component. |
| 5.  | ![](https://399701567-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwmJ1RKjM2uNFaL6fO3Xu%2Fuploads%2Fgit-blob-1868bf61de7db34365ccb8d346ab9ffefbdd4205%2FcaptureImage-step-5.png?alt=media) | Fill in the parameters of the function.                                                                                                                                                                   |

### Result

The image captured will be shown in the image component.

## Links