Use CSS in Servoy

[martinh]

Hi,

I tried to make my first steps using CSS. I succeeded to get parts of my form designed the way I want it. My CSS is very simple:

Code: Select all

form
{
   border-style: solid;
   border-width: 0px 0px 0px 0px;
   background-color:#f0f0f0;
}

field
{
   background-color:#FFFFFF;
   border-style: solid;
   border-width: 1px 0px 0px 1px;
   border-color: #999999 #ffffff #ffffff #999999;
   font-family: Arial;
   font-size: 11pt;
   color: #000000;
   text-align: left;
   margin: 0px 0px 0px 2px;
   vertical-align: top;
   font-weight: normal;
}



label
{
   font-family: Arial;
   font-weight: bold;
   font-size: 11pt;
   color: #000000;
   text-align: left;
   border-color: #ffffff;
   border-style: solid;
   border-width: 0px 0px 0px 0px;
}

So this looks very simple. But when I have comboboxes and they are readonly, then these comboboxes are getting some gray background. When I remove form.ReadOnly = false, then the combobox becomes like I want it. The combobox doesn't have a specific styleclass.

I looked at some other example Style files, where I see sometimes entries like:

Code: Select all

field.readonly
{
   background-color:#eeeeee;
   color: #808080;
}

This assumes that when this field is readonly, that (back)ground color is changing, but that doesn't work in my case.

My questions:

1) Is there some default CSS-file which is used by default by Servoy where is defined that all items have a default CSS-setting if no specific setting is defined. If that is the case, where do I find this? Somewhere there must be a setting that says that readonly comboboxes must become gray.

2) Is there some way, where you can enter a default behavior for certain displaytypes (for example combobox, radios) without using a styleclass. Or is there some way where I can register that for displaytype 'Combobox' that the styleclass 'field.combobox' must be used without the need to register that for each combobox on each form.

3) Is there some way, where the CSS-setting changes in a certain situation, like on form readonly. Or was the example with field.readonly used in an application. Perhaps in readonly mode all fields on the form are dynamically attached to field.readonly and the moment that readonly becomes false, that all fields are resetted again to styleclass 'field'.

The Servoy documentation is not extended concerning this subject.

Hope someone can help me with this.

Thanks

Martin

Servoy Developer
Version 3.5.1-build 514
Java version 1.6.0_03-b05 (Windows XP)

[IT2Be]

1) Is there some default CSS-file which is used by default by Servoy where is defined that all items have a default CSS-setting if no specific setting is defined. If that is the case, where do I find this? Somewhere there must be a setting that says that readonly comboboxes must become gray.

Not a css but yes this is default behaviour

2) Is there some way, where you can enter a default behavior for certain displaytypes (for example combobox, radios) without using a styleclass. Or is there some way where I can register that for displaytype 'Combobox' that the styleclass 'field.combobox' must be used without the need to register that for each combobox on each form.

Yes, you can use the properties and do this per element (not type)

3) Is there some way, where the CSS-setting changes in a certain situation, like on form readonly. Or was the example with field.readonly used in an application. Perhaps in readonly mode all fields on the form are dynamically attached to field.readonly and the moment that readonly becomes false, that all fields are resetted again to styleclass 'field'.

Uhmmm, this is a really difficult sentence (or at least for me it is) but when you ask if setting change under certain circumstances I am pretty sure the answer is no. I am also pretty sure I saw a remark about the readonly thing elsewhere on the forum. Don't know where anymore though. It was recent.

[fsciweb]

I can't ever get a combobox to display without greyed text / greyed background in READONLY mode - thus making in unreadable.

I set it in styles, and set the element to that class

I set it directly on the element via Properties

I set it via script

Can't make the text in a combo box readable when in readonly mode...

Using version 3.5.5

Anyone know of a way?

[Hans Nieuwenhuis]

Anyone ever succeded in avoiding the combobox graying out in readonly mode ??

Regards,

[patrick]

I don't think that this is reasonably doable. I guess that readOnly makes components disabled and the appearance of a disabled component is controlled by the L&F. In order to avoid this kind of issue, Servoy would have to create their own "readOnly" mode. I avoid readOnly forms completely partly because of this problem. Disabled components look different everywhere.

[ROCLASI]

I talked to Andrei Costescu of Servoy about this issue at ServoyWorld and he came up with an easy solution for this.

Code: Select all

application.setUIProperty("ComboBox.disabledBackground", new Packages.javax.swing.plaf.ColorUIResource(java.awt.Color.WHITE));
application.setUIProperty("ComboBox.disabledForeground", new Packages.javax.swing.plaf.ColorUIResource(java.awt.Color.BLACK));

You can choose the colors you want. But remember ALL combos in your application will be affected and for the whole session so to get the default behavior you need to restart your Servoy client/developer.
And you might want to add this code in the "onOpen" method of your solution (it can be execute at any time, but it will not be applied until the combos are repainted).

Andrei also mentioned why NOT to use this:

- the actual appearance of the combo when disabled is determined by the look and feel (even these 2 settings are only applied if the L&F chooses to use them - usually L&Fs do). The disabled appearance of combos can/will differ from L&F to L&F. So, for example if someone wants his combos to look like in Mac or Windows default look and feel when disabled he will get that by default.
- all the combos in smart client will change according to these settings - for example setting disabled background white and disabled foreground black would make even the font combos in the toolbar look like they were enabled. Not everybody might want that...

See the attached screenshots.

Hope this helps.

[maurice]

Thanx very much!