# Multi-State Image Element

**URL:** <https://forum.inductiveautomation.com/t/multi-state-image-element/2984>\
**Category:** Ignition\
**Created:** [May 31, 2011, 2:38pm UTC](https://forum.inductiveautomation.com/t/multi-state-image-element/2984 "2011-05-31T14:38:16Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![Greg.Buehler](https://avatars.discourse-cdn.com/v4/letter/g/ecc23a/32.png) [@Greg.Buehler](https://forum.inductiveautomation.com/u/Greg.Buehler)\
**Post date:** [May 31, 2011, 2:38pm UTC](https://forum.inductiveautomation.com/t/multi-state-image-element/2984/1 "2011-05-31T14:38:16Z")

</div>

This type of functionality is probably included in the much anticipated 2D drawing feature in 7.3, but the ability to display different images instead of just changing the tint color would be great.

---

<div class="post-metadata">

**Author:** ![Travis.Cox](https://avatars.discourse-cdn.com/v4/letter/t/b9bd4f/32.png) [@Travis.Cox](https://forum.inductiveautomation.com/u/Travis.Cox)\
**Post date:** [May 31, 2011, 2:59pm UTC](https://forum.inductiveautomation.com/t/multi-state-image-element/2984/2 "2011-05-31T14:59:53Z")

</div>

You can do that right now by binding the image path property of the image to an expression or you can change the image path through the style customizer. The image path property is just a string path to some image in Ignition. You just want to change the path to different images depending on some condition.

---

<div class="post-metadata">

**Author:** ![Carl.Gould](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/carl.gould/32/7262_2.png) [@Carl.Gould](https://forum.inductiveautomation.com/u/Carl.Gould)\
**Post date:** [May 31, 2011, 6:53pm UTC](https://forum.inductiveautomation.com/t/multi-state-image-element/2984/3 "2011-05-31T18:53:09Z")

</div>

There’s an example of how you might do this on the Timer component’s user manual page: [inductiveautomation.com/supp … itimer.htm](http://www.inductiveautomation.com/support/usermanuals/ignition/index.html?misc_pmitimer.htm)

---

<div class="post-metadata">

**Author:** ![Greg.Buehler](https://avatars.discourse-cdn.com/v4/letter/g/ecc23a/32.png) [@Greg.Buehler](https://forum.inductiveautomation.com/u/Greg.Buehler)\
**Post date:** [June 2, 2011, 3:03pm UTC](https://forum.inductiveautomation.com/t/multi-state-image-element/2984/4 "2011-06-02T15:03:56Z")

</div>

Looks like scripting the image is a feasible way to accomplish what I’m trying to do! Scripting the event looks powerful, but it would be really nice to have a style customizer similar to the multistate indicator element.

For example, you could replace the “text” assignment field with a image path assignment field.

---

<div class="post-metadata">

**Author:** ![Travis.Cox](https://avatars.discourse-cdn.com/v4/letter/t/b9bd4f/32.png) [@Travis.Cox](https://forum.inductiveautomation.com/u/Travis.Cox)\
**Post date:** [June 2, 2011, 7:19pm UTC](https://forum.inductiveautomation.com/t/multi-state-image-element/2984/5 "2011-06-02T19:19:42Z")

</div>

Correct, first add a dynamic property to the image called state that is an integer. You can add dynamic properties through the right click menu on the image by selecting Customizers \> Dynamic Properties. Once you have the property you can bind it to a tag or whatever. Lastly, go to the Styles customizer and drive it on the new state property and use th image path property as a styled property.

Once you create this one time you can make a component out of it. Just right click on the component palette and create a new one. On the new tab there is an icon to capture the currently selected component as a your own. Once you do that you can use that image over and over again.
