Skip to main content

The Image Input component for Retool Mobile

An input field to select images or take a photo with the camera.

Captured images are temporarily stored on the device for native apps and in the Retool organization for web apps.

Properties

All properties for this object with supported data types or values. You can write JavaScript almost anywhere in Retool to manipulate or read property values.

cameraOpened

Whether the camera was in use.

Type boolean
Mutability Read-only

disabled

Whether input, interaction, selection, or triggering is disabled.

Type boolean
Format True/False
Mutability
ControlUsage
Retool UI Inspector > Interaction > Disabled
MethodsetDisabled()
Default
false
Examples
true

files

A list of metadata from the selected files.

Type array
Array values object
Mutability Read-only
Array Object Properties

lastModified

The last modified date as a timestamp.

Type number
Format Timestamp
Mutability Read-only
Examples
1617024000000

name

The file name with extension.

Type string
Mutability Read-only

retoolStorageId

The file ID if uploaded to Retool Storage.

Type string
Mutability Read-only

size

The file size, in bytes.

Type string
Mutability Read-only

type

The MIME type.

Type string
Mutability Read-only

uploading

Whether the file is uploading.

Type boolean
Mutability Read-only


hidden

Whether this object is hidden from view.

Type boolean
Format True/False
Mutability
ControlUsage
Retool UI Inspector > Appearance > Hidden
MethodsetHidden()
Default
false
Examples
true

isPublic

Whether to make the file public when uploading with Retool Storage.

Type boolean
Mutability
ControlUsage
Retool UI Inspector

label

The text label to display.

Type string
Format Plain Text
Mutability
ControlUsage
Retool UI Inspector > Content > Add-ons > Label > Label
Default
null
Examples
"Label"

launchMode

The input method to use.

Type string
Mutability
ControlUsage
Retool UI Inspector
Allowed Values
ValueDescription
camera

Take photos with the device camera or select photos to upload.

cameraOnly

Take photos with the device camera only.

libraryOnly

Select photos to upload only.


libraryOpened

Whether the library was in use.

Type boolean
Mutability Read-only

maxCount

The maximum number of items to allow.

Type number
Mutability
ControlUsage
Retool UI Inspector

minCount

The minimum number of items to allow.

Type number
Mutability
ControlUsage
Retool UI Inspector

placeholder

The text to display within the input field when there is no value.

Type string
Formatstring
Mutability
ControlUsage
Retool UI Inspector > Content > Placeholder
Default
Enter a value
Examples
Enter a value

resolution

Whether to resize images to a different resolution.

Type string
Mutability
ControlUsage
Retool UI Inspector
Allowed Values
ValueDescription
original

Images retain their original resolution.

high

High resolution.

medium

Medium resolution.

low

Low resolution.


selectionType

The type of file selection.

Type string
Mutability
ControlUsage
Retool UI Inspector
Allowed Values
ValueDescription
single

Select a single file.

multiple

Select multiple files.

directory

Select a directory of files.


shouldCompress

Whether to compress images. If enabled, file size is reduced by 50% with minimal reduction in quality.

Type boolean
Mutability
ControlUsage
Retool UI Inspector

shouldOverwriteOnNameCollision

Whether to replace a file with the same name when uploading with Retool Storage.

Type boolean
Mutability
ControlUsage
Retool UI Inspector

uploadToRetoolStorage

Whether to upload a file to Retool Storage.

Type boolean
Mutability
ControlUsage
Retool UI Inspector

value

The value.

Type array
Array values string
Mutability Read-only

Methods

JavaScript API methods for this object. You can write JavaScript almost anywhere in Retool and use methods to manipulate data and property values.

imageInput.clearValue()

Clear the current values.

Definition
imageInput.clearValue()
Examples

Clear the current value of imageInput.

imageInput.clearValue();

imageInput.close()

Close the component.

Definition
imageInput.close()
Examples

Close imageInput.

imageInput.close();

imageInput.open()

Open the component.

Definition
imageInput.open()
Examples

Open imageInput.

imageInput.open();

imageInput.resetValue()

Reset the current value to the default value.

Definition
imageInput.resetValue()
Examples

Reset the current value of imageInput.

imageInput.resetValue();

imageInput.setDisabled()

Set the disabled value to toggle whether the input field is disabled. Defaults to true without a parameter.

Definition
imageInput.setDisabled(disabled)
Parameters

disabled

Whether input, interaction, selection, or triggering is disabled.

Type boolean
Format True/False
Default
false
Examples
true

Examples

Disable imageInput.

imageInput.setDisabled(true);

Enable imageInput.

imageInput.setDisabled(false);

Events

Events triggered by user interactions. You can configure event handlers in the IDE to trigger queries or other actions in response to events.

EventDescription
CaptureA value is captured.
CloseThe component or item is closed.
OpenThe component or item is opened.