1. Home
  2. Tutorials
  3. Creating your App UX
  4. Display a Local Image Dynamically

Display a Local Image Dynamically

You can set which local image asset is displayed in an Image Element in your app when an Event occurs while the app runs, using the Set Value Action.

  1. Use the Media button at the top right of the editor to upload the images you want to display. media button
  2. Add an Image Element to a page in your app. If you want a default image to display, set it as the Image in the Properties tab on the right of the editor. image property
  3. Decide when you want the image asset to change and add an Action to the relevant Event. For example, to show a particular image when the user interacts with an Element, select the Element and open Properties > Events, clicking Add/Manage for your chosen Event, such as Tapped. button events
  4. Click the plus plus button to add an Action, and choose Set Value.
  5. Edit the Action.
    • In the first input, select the Image Element Image property using the Elements container. set image property
    • In the second input, select the image you want to display via the Static Input container, selecting UIImage and then Choose to pick one of the images you uploaded into the project. select image display

    Save the Action.

When the Event occurs, the app will dynamically display the image you selected. If you need to display remote images from a URL, use the Display Image from URL Action instead. You can also display images from URLs in API responses, including arrays.

You can set which local image asset is displayed in an Image Element in your app when an Event occurs while the app runs, using the Set Value Action.

  1. Use the Media button at the top right of the editor to upload the images you want to display. media button
  2. Add an Image Element to a page in your app. If you want a default image to display, set it as the Asset in the Properties tab on the right of the editor. image asset property
  3. Decide when you want the image asset to change and add an Action to the relevant Event. For example, to show a particular image when the user interacts with an Element, select the Element and open Properties > Events, clicking Add/Manage for your chosen Event, such as Tapped. button events
  4. Click the plus plus button to add an Action, and choose Set Value.
  5. Edit the Action.
    • In the first input, select the Image Element Asset property using the Elements container. set image asset
    • In the second input, select the image you want to display via the Static Input container, selecting Drawable and then Choose to pick one of the images you uploaded into the project. set image value

    Save the Action.

When the Event occurs, the app will dynamically display the image you selected. If you need to display remote images from a URL, use the Display Image from URL Action instead. You can also display images from URLs in API responses, including arrays.

Was this article helpful to you? Yes No

How can we help?