Set background color of page in code.

Good afternoon.

The page background is blue (set with a webstyle). The client would like something different. I could just change the webstyle, but the next client (I am, perhaps, being a bit optimistic here) will likely want yet a third color. So, I would like to change the background color on the fly. This would seem to be fairly easy to do with javascript, but it’s not clear to me how to get at the page.

Much thanks.

-Bob

[quote=214507:@Bob Gordon]Good afternoon.

The page background is blue (set with a webstyle). The client would like something different. I could just change the webstyle, but the next client (I am, perhaps, being a bit optimistic here) will likely want yet a third color. So, I would like to change the background color on the fly. This would seem to be fairly easy to do with javascript, but it’s not clear to me how to get at the page.[/quote]

Here is some JavaScript slightly modified from the code in the Webpage shown event of the demo of RubberViewsWE. You can put any RGB value in there.

self.ExecuteJavaScript("var x=document.getElementById('"+self.ControlID+"'); x.style.backgroundColor= ""rgb(0,0,255)""")

You can change that value dynamically with something like

dim colour as string = "0,0,255" self.ExecuteJavaScript("var x=document.getElementById('"+self.ControlID+"'); x.style.backgroundColor= ""rgb(" + colour + ")""")

Then you can assemble the colour string in code before calling the code. That allows you to change the page backcolor at any time.

1 Like

Michel,

Ah! Thank you. Works exactly as advertised. Now all I need do is stash the client’s RGB values in the table, and I’m good to go.

By the way, you are where? I notice the English spelling of “colour”.

-Bob Gordon

[quote=214642:@Bob Gordon]Michel,

Ah! Thank you. Works exactly as advertised. Now all I need do is stash the client’s RGB values in the table, and I’m good to go.

By the way, you are where? I notice the English spelling of “colour”.

-Bob Gordon[/quote]

Ah !

I used the British spelling to avoid using “Color”, which is a reserved word.

I could have used the French “Couleur” (I’m in Paris), or “myColor”…

Web styles will work to change color on the fly too. I use it in my app to allow people to set their own color.

Problem with Web Styles is that you cannot apply an arbitrary color.

Although indeed for the OP description it may suffice.

I’m not sure what you mean. I have a color picker where the user can select any arbitrary color they want.

Then you probably did not use the out of the box webstyle. The colors have to be selected in the IDE for a particular webstyle.

How do you manage changing colors for the current web style ?

You’re right. I have a set number of colors/webstyles for the user to choose from. I could have sworn I had a color picker in there but I didn’t. Just a pop-up with a fixed set of colors…

Now you know how to apply an arbitrary color :wink:

well, you could do a popup with 16.7 million colors in it… sorry, I’m a bit punchy this morning.

There are two ‘features’ of Xojo styles that I’m not fond of:

a) they have to be created in the IDE and are immutable

b) only one style can be assigned to a control at a time

You can create subclasses of styles which is a bit of a workaround for (b) but we do miss out on some of the great flexibilities of CSS in native Xojo stuff. Yes, we can punch through Xojo and address styles directly via Javascript but it would be nice to see this feature set mature over time. I’m not sure what form it should take though…

what you really want is the ability to alter style data in a xojo condoned way :slight_smile: you can alter anything anyway via execute javascript, but that steps outside of the official supported behavior and who knows if it will still work that same way with the next release and if you have trouble with something after changing it you’re certainly not going to get support on that. So perhaps join in this feedback request:

<https://xojo.com/issue/15949>

[quote=215104:@Steve Upton]well, you could do a popup with 16.7 million colors in it… sorry, I’m a bit punchy this morning.

There are two ‘features’ of Xojo styles that I’m not fond of:

a) they have to be created in the IDE and are immutable

b) only one style can be assigned to a control at a time

You can create subclasses of styles which is a bit of a workaround for (b) but we do miss out on some of the great flexibilities of CSS in native Xojo stuff. Yes, we can punch through Xojo and address styles directly via Javascript but it would be nice to see this feature set mature over time. I’m not sure what form it should take though…[/quote]

I don’t remember where I read it, could be from a Greg’s post, that Xojo plans on improving the styles. No more details though.

In the meantime, the JavaScript method is not so bad, really. It can be put in a method and become as simple as setting the properties in Desktop.

One can also use a css style starting with a dot (ie .myStyle) in the HTMLHeader, and when an empty WebStyle of the same name without the dot (myStyle) is applied to a control, it picks the CSS.

Looking forward to see what Xojo will come up with, but it may be a while…

yeah, workarounds are good and you’re right it’s not so bad.

Just like to put in my “feedback” for visibility