Combining WebStyles

I’m wondering if there is a way to “combine” webstyles. Something similar to the way VB allows combination of attributes (I realize VB is not web centric but for the purpose of my question, it is irrelevant).

For example, consider the following defined “styles”

vbBold, vbUnderline, vbAlignLeft, vbAlignRight, vbAlignCenter

Now, if I wanted a text field to be right aligned and bold, I could do something like style = vbBold+vbAlignRight. In WE, I’d have to create 25 WebStyles to cover all combinations of the 5 styles listed above. I have played around with inheritance which would cut the number of combinations slightly but doesn’t quite do the job 100%.

So my question is…How would I accomplish this in WE?

TextField1.Style = TXTRight + TXTBold + TXTUnderline?

This gives a “You have used an operator that is not compatible with the data types specified” error.

You can’t combine them, but keep in mind that you can subclass them, so you could create a style that’s got your favorite font called MainFontStyle and then subclasses for MainFontStyleBold, MainFontStyleItalic, etc… so that changing the font is just a matter of changing MainFontStyle.

If you would like the ability to combine styles like that, please file a feature request in Feedback.

Web Custom Controls will do what you want.

Thanks for the mention Brandon! Just to clarify:

  • Web Custom Controls includes a new class, WebStyleTD, which can be created, modified, and combined at runtime. So you can define 5 WebStyleTD styles and combine (or later remove) any of them on a single control. They can also be shared across controls and even across sessions. WebStyleTD does not inherit from WebStyle so you can’t use the IDE GUI editor or the Style property (there are methods for applying/removing).

  • Web Custom Controls lets you edit Xojo WebStyles at runtime, but not combine them. If you want to combine styles, they have to be WebStyleTD styles.

  • Web Custom Controls also lets you apply styling directly to a control. This typically adds to or overrides any underlying styling from a WebStyle or WebStyleTD.

  • The styling related code includes direct support for Google fonts. And in all cases you can set and use pretty much any CSS property.

Keep in mind that there may be CSS combinations that break functionality. I’m not aware of any, other then obvious ones like making a control invisible and then not being able to see it. But if you ever go crazy with styling and a control doesn’t work right, clear the styling just to be sure. And if you do run into a CSS conflict or other wcc error, contact me directly.