Where is the "Set Component Styles" function?

Has the “Set Component Style” function disappeared from the marketplace?? I can’t seem to find it.

Thanks!

That has been deprecated. No longer available.

I see. Is there another way to modify the CSS of properties in the logic flow function? Perhaps through the JavaScript function? I am a beginner so I’d appreciate if this could be explained.

Thank you!

No need to use Javascript there… Create a style for the specific view component in the “Styles” tab on the right side of the Composer. Inside of that unique style You can set many properties and You can use formulas and even variables to set the styles that You wish. Also You can set custom colors depending on different formulas in the “Custom palette” view.
There is a thread on the forum, where it is described in more detail, but I cannot find it right now.

But what if I want to change style through the logic flow function. For example, “change the background of a container on button click”?

1 Like

Add it to the style.
Add a page variable “background” let it be a text. The text could be the color hex code of the background that you want.
On button tap event add logic. Set page variable bacground to the hex color code that you want that background to be.
Then add a custom palette to the container background:

There on the “NEW PALETTE” go and choose “Formula”:

And add your page variable there with a some IF function maybe if you need further customization…

1 Like

hey @Mihaly_Toth

I run into this suggestions as I was browsing the forum, searching for a way to change component style through logic. I understand how to pull this off by using the variables, but was hopping for a more straight forward way to pull it off, like changing a style class of an element through logic (e.g. when other element is tapped), without the need to use variables as an intermediary to do it.

I’m used to web development world, where all the css properties are saved in separate classes and replacing them on any element is a straight forward thing. When transition or animation is added to the mix, all sorts of UI interactions become possible.

Is this not possible at the moment in Appgyver?

I am afraid there is no straightforward way of changing a “style” of a component.

However, if it is a unique component that You have built Yourself, You can play around with it like this:

Create component private variables and set the component styles inside of that component with the utilization of those private variables. This way You can add different logic to the canvas of the component’s logic canvas. For example component tapped event → Set private variable (tapped to true) or go ahead and use the “Set component property” inside the component. I honestly haven’t really missed the functionality that would replace a specific CSS style with another one on a button tap (which is not that tough to achieve with regular JS in a custom-coded web app).

The approach of AG and its styling helps with the ability to build for cross-platform, and I am willing to do this trade-off. But if there could be an upgrade in this that would also be amazing.