# Changing an asset's Tint Colour based on multiple inputs

**URL:** <https://forum.inductiveautomation.com/t/changing-an-assets-tint-colour-based-on-multiple-inputs/60741>\
**Category:** Ignition\
**Tags:** ignition81, vision\
**Created:** [June 14, 2022, 12:19pm UTC](https://forum.inductiveautomation.com/t/changing-an-assets-tint-colour-based-on-multiple-inputs/60741 "2022-06-14T12:19:55Z")\
**Posts on this page:** 10\
**Page:** 1

<div class="post-metadata">

**Author:** ![Ben\_Lindner](https://avatars.discourse-cdn.com/v4/letter/b/ea5d25/32.png) [@Ben\_Lindner](https://forum.inductiveautomation.com/u/Ben_Lindner)\
**Post date:** [June 14, 2022, 12:19pm UTC](https://forum.inductiveautomation.com/t/changing-an-assets-tint-colour-based-on-multiple-inputs/60741/1 "2022-06-14T12:19:55Z")

</div>

Hello.

Say i have an image (its a pipe) and i want it to change tint color based on the state of different inputs how would i best go about this? Script? Expression?

Essentially when

Liquid 1 is True = Tint pipe Blue  
Liquid 2 is True = Tint pipe Brown  
Liquid 3 is True = Tint pipe grey  
Liquid 4 is True = Tint pipe Black

Only 1 will ever be true at once based on how its programmed in the PLC, if 1 is on the other 3 are off.

Using Ignition 8.1, screens in vision.

Cheers

---

<div class="post-metadata">

**Author:** ![dkhayes117](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/dkhayes117/32/68344_2.png) [@dkhayes117](https://forum.inductiveautomation.com/u/dkhayes117)\
**Post date:** [June 14, 2022, 12:26pm UTC](https://forum.inductiveautomation.com/t/changing-an-assets-tint-colour-based-on-multiple-inputs/60741/2 "2022-06-14T12:26:31Z")

</div>

Use an expression binding on the tint color property.

```auto
case(True,
	{Root Container.Liquid 1.someProperty}, color(0,102,255),
	{Root Container.Liquid 2.someProperty}, color(144,86,16),
	{Root Container.Liquid 3.someProperty}, color(170,170,170),
	{Root Container.Liquid 4.someProperty}, color(0,0,0),
	color(255,255,255)
)

```

---

<div class="post-metadata">

**Author:** ![Ben\_Lindner](https://avatars.discourse-cdn.com/v4/letter/b/ea5d25/32.png) [@Ben\_Lindner](https://forum.inductiveautomation.com/u/Ben_Lindner)\
**Post date:** [June 17, 2022, 7:09am UTC](https://forum.inductiveautomation.com/t/changing-an-assets-tint-colour-based-on-multiple-inputs/60741/3 "2022-06-17T07:09:14Z")

</div>

Thanks

Can you be a bit more specific? still learning the expression syntax.

How do i incorporate the tag bindings into this?

---

<div class="post-metadata">

**Author:** ![nminchin](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nminchin/32/6911_2.png) [@nminchin](https://forum.inductiveautomation.com/u/nminchin)\
**Post date:** [June 17, 2022, 9:01am UTC](https://forum.inductiveautomation.com/t/changing-an-assets-tint-colour-based-on-multiple-inputs/60741/4 "2022-06-17T09:01:47Z")

</div>

You will need to create custom properties on your component or root and bind your tags to these which you can then reference in your case or if statements. Alternatively, you can also read tags directly using the `tag() ` function which takes a string tag path and reads it. I’d recommend against the tag function though and use custom props / tag bindings.

---

<div class="post-metadata">

**Author:** ![Ben\_Lindner](https://avatars.discourse-cdn.com/v4/letter/b/ea5d25/32.png) [@Ben\_Lindner](https://forum.inductiveautomation.com/u/Ben_Lindner)\
**Post date:** [June 17, 2022, 9:32am UTC](https://forum.inductiveautomation.com/t/changing-an-assets-tint-colour-based-on-multiple-inputs/60741/5 "2022-06-17T09:32:41Z")

</div>

Thanks,

I have made 4 custom property’s on the asset. Colour 1, Colour 2, Colour 3, Colour 4. They are bound to the relevant tag.

Once again bit green to this but i have come up with this

```auto
case({Root Container.Container.Image 136.Colour1}=True, // this is the custom property bound to tag 1(colour1). If colour 1 = True then do below
{Root Container.Container.Image 136.tintColor}, color(0,255,0), // change it to green if true
color(213,213,213) // if not true change it to grey
)

```

Just returns 213,213,213 at the moment and cant be changed. Any tips?

---

<div class="post-metadata">

**Author:** ![nminchin](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nminchin/32/6911_2.png) [@nminchin](https://forum.inductiveautomation.com/u/nminchin)\
**Post date:** [June 17, 2022, 9:44am UTC](https://forum.inductiveautomation.com/t/changing-an-assets-tint-colour-based-on-multiple-inputs/60741/6 "2022-06-17T09:44:56Z")

</div>

Are colourX props Booleans or colours? I would have thought youd have ‘liquidX’ custom props instead of colourX, but you could also have both which would make the colours more easily defined and visible. If you’re reusing these colours throughout the project, you should look at storing the colours as strings inside of client tags for Vision, and perspective styles (or better, a custom css theme in variables which are mapped into p styles) for Perspective

---

<div class="post-metadata">

**Author:** ![Ben\_Lindner](https://avatars.discourse-cdn.com/v4/letter/b/ea5d25/32.png) [@Ben\_Lindner](https://forum.inductiveautomation.com/u/Ben_Lindner)\
**Post date:** [June 17, 2022, 10:01am UTC](https://forum.inductiveautomation.com/t/changing-an-assets-tint-colour-based-on-multiple-inputs/60741/7 "2022-06-17T10:01:01Z")

</div>

ColourX are booleans. Its a once off case and wont be used everywhere. Just changes a tank color by changing the tint based on what product is selected with an option of 4 products.

```auto
case(True, 
{Root Container.Container.Image 136.Colour1},
{Root Container.Container.Image 136.tintColor}, color(0,255,0), 
color(213,213,213)
)

```

Currently have this but doesn’t work yet, feel im getting closer. Gives a 5 argument error. Obviously only changes 1 color atm but yea

trying to follow this [case - Ignition User Manual 8.1 - Ignition Documentation](https://docs.inductiveautomation.com/display/DOC81/case)

---

<div class="post-metadata">

**Author:** ![Ben\_Lindner](https://avatars.discourse-cdn.com/v4/letter/b/ea5d25/32.png) [@Ben\_Lindner](https://forum.inductiveautomation.com/u/Ben_Lindner)\
**Post date:** [June 17, 2022, 10:58am UTC](https://forum.inductiveautomation.com/t/changing-an-assets-tint-colour-based-on-multiple-inputs/60741/8 "2022-06-17T10:58:49Z")

</div>

Figured it out, found nested IF statements the way to go

```auto
if({Root Container.Container.Image 137.Colour1} = true, // if this propery becomes true
	color (0,255,0), // turn the image to green
	 
if ({Root Container.Container.Image 137.Colour2} = true, // if this properyy becomes true
	color (255, 0, 0), // turn to red
	
if ({Root Container.Container.Image 137.Colour3} = true, // if this properyy becomes true
	color (0, 0,255), // turn to blue
	
if ({Root Container.Container.Image 137.Colour4} = true, // if this properyy becomes true
	color (255,255, 0), // turn to yellow

	color (213,213,213) // Use grey when everything is false
))))

```

For anyone reading in the future. You need to add custom property’s to the image and bind them to the tags you want to use. Then use the above expression.

---

<div class="post-metadata">

**Author:** ![dkhayes117](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/dkhayes117/32/68344_2.png) [@dkhayes117](https://forum.inductiveautomation.com/u/dkhayes117)\
**Post date:** [June 17, 2022, 12:07pm UTC](https://forum.inductiveautomation.com/t/changing-an-assets-tint-colour-based-on-multiple-inputs/60741/9 "2022-06-17T12:07:12Z")

</div>

> [@Ben\_Lindner](#):
>
> IF statements the way to go

Don't give up, you were so close. I would never use nested ifs over a case statement.  
It was giving you a 5 argument error because it expects 6 based on your setup, and you only provided 5.

```auto
case(True, 
{Root Container.Container.Image 136.Colour1}, #YOU NEED A RETURN VALUE HERE
{Root Container.Container.Image 136.tintColor}, color(0,255,0), 
color(213,213,213)
)

```

```auto
case(True, 
{Root Container.Container.Image 136.Colour1}, color(0,0,0), // Color for case 1
{Root Container.Container.Image 136.tintColor}, color(0,255,0), // Color for case 2 
color(213,213,213) // Default Color
)

```

---

<div class="post-metadata">

**Author:** ![JordanCClark](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/jordancclark/32/83362_2.png) [@JordanCClark](https://forum.inductiveautomation.com/u/JordanCClark)\
**Post date:** [June 17, 2022, 12:23pm UTC](https://forum.inductiveautomation.com/t/changing-an-assets-tint-colour-based-on-multiple-inputs/60741/10 "2022-06-17T12:23:01Z")

</div>

I would have done a [binEnum()](https://docs.inductiveautomation.com/display/DOC81/binEnum) to produce a state value, then use that state as the driving property in the Style Customizer. The style Customizer would also let you handle multiple properties, if needed.

```auto
binEnum({Root Container.Container.Image 137.Colour1},
        {Root Container.Container.Image 137.Colour2},
        {Root Container.Container.Image 137.Colour3},
        {Root Container.Container.Image 137.Colour4},
       ) // Return position of first true value

```

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/b/5/b5d6f35ff76b254135b0b12fcc51cacc581a2870.png)

Properties bound by the Style customizer will have the RGB venn icon.  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/0/9/092478f924b05961ec1fabacf6ad42762bcea4cf.png)