Use the Icon color of an ENUM in the UI

[Lynfot]

Hi,
I am trying to use the color from A in the UI, however I have tried all the options in B and none of the settings sets the color of the icon to the color of the ENUM. Please help.
I have plans to use this icon many places so creating a list of conditional formatting for the color of the icon is not an option. Further I would also then need to add X amount of conditions for X amount of options in the ENUM and X amount of colors must then also be added in Themes. In addition there is no easy way to only copy the conditional formatting of an UI element, one would need to copy the entire UI element to another location and based on the context the icon value may not point to the same reference.

As marked in green from the documentation the color should be possible to use in the UI.

[isabelslorer]

Hi!

I agree that there seems to be no simple way to do this.

I have requested this feature from our platform engineering team and will try to give an update when I know more about when this feature can be expected.

Currently, it is possible to copy conditional styling to the clipboard.

Hope this helps!

[Lynfot]

Hi.
Great. Thanks for the feature request.
For the conditional styling copy tips; in my case I need to copy A and then B to the new destination of the same conditional style. Some locations I have 10 styles that must be copied. Would be nice with a copy function at location C in image below that would copy all of the conditional styles in one go.

Further please consider making Color a data type in Appfarm and more on the fly allowance for using colors without going via the Color Theme (such as using functions as ColorValueHex(), RGBA(Red, Green, Blue, Alpha ) and ColorFade( Color, FadeAmount ))

[isabelslorer]

Hi,

I understand that this is not very convenient. I have registered this as a wanted feature as well.

Have a nice day!

[Lynfot]

Thanks.
This is not very urgent in our end.
We have already implemented this in a alternative way; create base64 strings and save in an ENUM. Then use the Image UI element instead of the Icon UI element. Does pretty much the same job.

[Yassine.tebib]

Hey Lynfot

if it can help, you can keep your color code in a string and use a coded component to display what you want to have ( it can be a shape or a font or something … )

let me know if you need this

[Erik]

Hi @Yassine.tebib ,

Could you please explain how you solved this?

Erik

[Yassine.tebib]

Really Sorry i saw your message a bit late

you can deal with it by using a coded component to display your color

the idea is to store you hexcode into your DB

HTML Content

<div id="divColor"></div>

Script

function changeBackgroundColor() {
    let div = document.getElementById('divColor');
    div.style.backgroundColor = appfarm.data.hexCode.get();
}

appfarm.data.hexCode.on('change', (val) => {
    changeBackgroundColor()
})


changeBackgroundColor()

Ressources
Type : Stylesheet

#divColor {
            width: 100%;
            height: 100%;
            border: 1px solid #000;
        }

Data

Link your String variable and call it hexCode

[Olav]

Support for copying all conditional styles in one batch has been implemented in Release 113.

[lbj]

You really need to do something about the color handling in Appfarm. I want to standardize the use of colors using enums, but the only way to apply these colors is through conditional styling or coded component magic — which is a real pain. Why can’t colors be connected to data sources and enums? I recall this being an issue long before this forum. Has there been any progress on this?

[lbj]

Any news on this? I just wasted a few hours making conditional coloring of icons for a map legend panel. I even had to duplicate the effort in 3 apps as there are no way to copy the logic between the apps. The map icons can use enum colors directly. Standard icons or containers can’t. Is there really any good reason why this cant be implemented? This feature request goes back many years.

[kristian]

Hi!

When it comes to this feature (which I perfectly agree is a nice feature) it is prioritized against other feature requests, considering severity and complexity among others. Improvement of color flexibility in general needs to be carefully designed and is no quickfix. But stay tuned