Image
Show a picture, optionally swapping it with machine state.
A logo on a screen. The background is transparent by default, so the screen shows through around the picture.
An image displays a picture imported into the document — a logo, a diagram, a photograph of the part being made. Like a Label it can carry states, so the picture itself can change with the machine.
Adding the control
Section titled “Adding the control”- Import the picture first: open the Images panel and import it from a USB stick — see USB import & export.
- In the control palette, press Image and drag it onto the canvas.
- Choose the file in the Inspector.
Images travel inside the document, so exporting a .hmi carries them with it.
Properties
Section titled “Properties”| Property | Description | Default |
|---|---|---|
| Image | The file to show. | none |
| Display | How the picture fills the control: contain, cover, or fill. | contain |
| Background | Color behind the picture. | transparent |
| States | Conditions that swap the picture for another. | none |
Contain fits the whole picture inside the control and may leave space at the sides. Cover fills the control and crops whatever does not fit. Fill stretches the picture to the control’s exact shape, changing its proportions.
States
Section titled “States”Each state pairs a condition with a filename, and the first true one is shown. An empty condition always matches, so a state with one makes a fallback.
A picture referenced by a state but missing from the document is reported by validation rather than left as a gap on the screen.
Related
Section titled “Related”- USB import & export — getting pictures onto the controller.
- Expressions — the syntax used by state conditions.
- Label — for text that changes with state.