# imageChooser

## Description

Selects an image from user's phone storage.

## Input / Parameter

| Name     | Description             | Input Type | Default | Options | Required |
| -------- | ----------------------- | ---------- | ------- | ------- | -------- |
| multiple | The image(s) to choose. | Array/List | -       | -       | Yes      |

## Output

N/A

## Callback

### callback

The setComponentValue function will be executed to show the image chosen in the image component if it exists.

### errorCallback

The function to be executed if the image component does not exist.

## Video

Coming Soon.

## Example

The user wants to display an image from their gallery/phone storage.

### Step

1. Drag an image, label and button component. Rename the label component to 'Result' and the button component to 'Image Chooser'.

   ![](https://399701567-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwmJ1RKjM2uNFaL6fO3Xu%2Fuploads%2Fgit-blob-a1fdc4a671d20e9a14544a8cac15acffb43d7337%2FimageChooser-step-1.png?alt=media)
2. Call the function `imageChooser` in the button. Call the function `console` in the callbacks of the `imageChooser` function. Select the parameter type `input` for the `value` parameter.

   ![](https://399701567-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwmJ1RKjM2uNFaL6fO3Xu%2Fuploads%2Fgit-blob-08e036758dbc69d52f96931db27bf9aa7129c94d%2FimageChooser-step-2.png?alt=media)
3. In the callbacks, call the function `setComponentValue`. For the success callback, select the image component in the `component` parameter. For the error callback, select the label component in the `component` parameter. Set the `value` parameter type to `input`.

   ![](https://399701567-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwmJ1RKjM2uNFaL6fO3Xu%2Fuploads%2Fgit-blob-e95d2d52bb824e4a1fc1dac8e91597b93662588a%2FimageChooser-step-3.png?alt=media)

   ![](https://399701567-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwmJ1RKjM2uNFaL6fO3Xu%2Fuploads%2Fgit-blob-2811d1c3246c274fc189e4618f011c856e9be3b4%2FimageChooser-step-4.png?alt=media)

   ![](https://399701567-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwmJ1RKjM2uNFaL6fO3Xu%2Fuploads%2Fgit-blob-a5eb37dec0a3f9fbb81885af96285e0f15a9f986%2FimageChooser-step-5.png?alt=media)

### Result

The image chosen will be displayed in the image component if it exists. If image does not exist, the label component will show the error.

![](https://399701567-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwmJ1RKjM2uNFaL6fO3Xu%2Fuploads%2Fgit-blob-ffb02bec88aa048a500f92fa0c8c7d26b108b612%2FimageChooser-result-1.jpg?alt=media)

![](https://399701567-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwmJ1RKjM2uNFaL6fO3Xu%2Fuploads%2Fgit-blob-6728cf7f70972c104b8ac2dcc183ab44c2c91817%2FimageChooser-result-2.jpg?alt=media)

## Links