===== Image and Layout Graphics =====

This section documents More Layout graphics used to display image resources in an MIStudio application.

These graphics are commonly used when an application needs to show one image or display different images based on logic, values, or configuration.

==== Graphics in This Group ====

^ Graphic ^ Description ^
| [[mistudio:design_editor:more_layout:image_layout:imagebean|ImageBean]] | Image display graphic used to show a selected project image resource. |
| [[mistudio:design_editor:more_layout:image_layout:multiimagebean|MultiImageBean]] | Image display graphic used to display image content received from logic or configured image mapping behavior. |

==== Common Uses ====

Image and layout graphics are commonly used to:

  * Display project image resources
  * Add visual reference images to an application
  * Show equipment, diagrams, icons, or process images
  * Change displayed images based on logic or values
  * Build more visual application screens

==== Input Behavior ====

Image graphics may use input behavior to update the displayed image or image selection.

The exact input behavior is documented on each individual graphic page.

==== Logic Behavior ====

Image graphics can appear in the Logic Editor when they need to be updated from logic or connected values.

The default logic ports are documented on each individual graphic page.

==== Notes ====

Images used by these graphics should be added to the project image resources when required by the selected graphic.

ImageBean and MultiImageBean are documented separately because ImageBean displays a selected static project image, while MultiImageBean can receive image content from logic and also includes image mapping behavior.

For general graphic behavior, see [[mistudio:design_editor:active_graphic|Active Graphic]].

==== Related Pages ====

  * [[mistudio:design_editor:start|MIStudio Design Editor]]
  * [[mistudio:design_editor:more_layout:start|More Layout]]
  * [[mistudio:design_editor:more_layout:image_layout:imagebean|ImageBean]]
  * [[mistudio:design_editor:more_layout:image_layout:multiimagebean|MultiImageBean]]
  * [[mistudio:design_editor:active_graphic|Active Graphic]]
  * [[mistudio:getting_started:add_graphics|Adding Graphics to an Application]]
  * [[mistudio:getting_started:edit_graphic_properties|Editing Graphic Properties]]
  * [[mistudio:getting_started:connect_data_source_to_graphic|Connecting a Data Source to a Graphic]]