Background Color Custom Expression sample

Question

Hi.

Can anyone point me to the proper syntax and or a sample of how a custom expression would look for setting the background color in a Windows 8.1 app based on a value of a field. I'm specifically trying to set the background color of a listview. I know how to set it to data bind it to an actual field, but in this case there isn't a field that gives the color of the background. It is based on the value of a field and whether it is within a certain threshold.

For example, if Field A is > 5000 then the background should be Green, otherwise (else) is should be Red.

I've tried several SSRS type expresssions, like IIF etc, but just can't seem to get this and I can't find any reference material about it.

Thanks!

Christine

Answer 1

Hi Christine,

Basically in WinJS, all the control style are controlled by CSS, therefore change the CSS is OK.

The ListView background can be set by following CSS, you could see the blue background. 

Sorry for the ugly color, but should be a workaround.

And as your requirement, when the field A is larger than 5000, then background should be green, you could use a if-else statement to generate a color, and the apply the color to the listview background.

document.getElementById("listview").style.background="blue";

Hope this helps,

--James

---

<THE CONTENT IS PROVIDED "AS IS" WITHOUT WARRANTY OF ANY KIND, WHETHER EXPRESS OR IMPLIED>
Thanks
MSDN Community Support

Please remember to "Mark as Answer" the responses that resolved your issue. It is a common way to recognize those who have helped you, and makes it easier for other visitors to find the resolution later.

Answer 2

Hi James.

Thanks for your reply. Yes, setting it in the CSS file is yet another way, but not what I want to do. Also, I believe that the if-else statement that you suggest would style the background of the WHOLE listview. Again, not what I want/am seeking to do.

What I want to do is set the individual listview win-container background color/image based on the value in Field A. That field is not a color value (hex or RGB) so I cannot just data bind it to the background color property.

There is an option in Blend to enter a Custom Expression for the background color of the listview win-container, similar to how you can databind that property. I am looking for examples of how this custom expression should be constructed, its syntax if you were, so that maybe I can use Field A in the expression to set the background color properly.

Thanks!

Christine