Problem using a combobox (drop down) in table view

Classic Servoy
1

Hi

I am developing a solution in Servoy 4.0.1. I am trying to use a combobox in a form that is set up to display its data in table view.

This gives me a problem because the text in the selected row of a table view form is always coloured white. Also, the background colour of a combobox is close to white, even when its in the selected row. Therefore, its difficult for users to read the contents of a combobox, when its in the selected row. The screen shot below shows what I’m talking about:
[attachment=0]combobox_problem.jpg[/attachment]

Is there any way to set either of these colours to something different, or do I need to use list view to avoid this problem?

Thanks for looking

Craig

combobox_problem.jpg
combobox_problem.jpg601×206 39 KB

2

Hi Craig,

Perhaps this post will help. I am not sure if there is a ComboBox.selectedForeground property though.

Hope this helps.

3

Marc’s wonderful documentation to the rescue (thanks Marc!)
Page 426 of the Servoy Developers Reference Guide gives the URL for the Java Swing UI Defaults:
http://www.alethis.net/reference/java/uidefaults.html

It shows 2 properties you could use:
ComboBox.selectionBackground: color
ComboBox.selectionForeground: color

Hope this helps.

4

One solution may be of using RowBGColor Calculation to set the background color with setting the Fields to transparent.

5

Hi,

Thanks for all your replies. However, none of these suggestions have solved the problem.

Changing colours, or making things transparent doesn’t effect the colours in the combobox, or in the selected row in table view. The colours in those 2 locations seem to be consistent no matter what you do. The colours simply don’t seem to be changeable.

I think I’ll just have to use list view, unless anyone else has any alternative suggestions…

Thanks again

Craig

6

Hi Craig,

I did some testing and indeed Servoy simply inverts the font color when the background color is dark.
Which makes sense for fields that show the dark background color but not for combo boxes that don’t.
I suggest you file an issue in the support system and in the mean time you can use the workaround of using a lighter selection color.
For instance I use #C6CDD7 myself.

Hope this helps.

7

Hi Rob,

You suggest using a lighter selection colour. I assume you are referring to the selection colour in the ‘table view’ table. Please can you confirm?

Where exactly do I adjust the colour you are referring to, (even if it isn’t the ‘table view’ table selection colour)? It’s just that I’ve had a good look around, but can’t find any colour adjustments that seem to help with my problem.

Thanks again

Craig

8

The background of your rows, including the selected one, can be defined by a rowBGColorCalculation.

Create a calculation, for example:

var index = arguments[0];
var selected = arguments[1];

if (selected) {
	return "#6699cc";
} else if (index % 2 == 0) {
	return "#ddeeff";
}

return "#ffffff";

and attach that to the rowBGColorCalculation-property of your form. Make sure that your fields are not “transparant”.

9

Hi Craig,

craig-c:
You suggest using a lighter selection colour. I assume you are referring to the selection colour in the ‘table view’ table. Please can you confirm?

I am indeed referring to the selection colour of the table view. And I assume you use a form with the View property set to ‘Table view’ (locked or not). Or are you using a portal or some bean ?

Where exactly do I adjust the colour you are referring to, (even if it isn’t the ‘table view’ table selection colour)? It’s just that I’ve had a good look around, but can’t find any colour adjustments that seem to help with my problem.

I assume you are using the rowBGColorCalculation property. This can take a calculation that returns the color string accordingly to the row number and/or it being selected.

Hope this helps.

Edit: I see Joas was faster than me. Just adjust the color strings to your needs.

10

Hi Guys,

This still doesn’t solve my problem. This is because the background colour of the combobox remains at off white, regardless of what colour I set with the rowBGColorCalculation property. For example look at the screen shot below. Here I’ve set the background colour of the row to red with rowBGColorCalculation. As you can see the text and the background of the combobox are still white and off white:

[attachment=0]combobox_problem2.jpg[/attachment]
It therefore looks as though I’m going to have to settle for list view for the time being. What do you think?

Craig

combobox_problem2.jpg
combobox_problem2.jpg553×205 39.2 KB

11

Hi Craig,

The text of the combobox stays white because the red is still too strong/dark.
Make it a lighter color and you will see it will stay black. Try #C6CDD7 for instance.

12

Hi,

Big thanks for that. The problem is now solved. The screen shot below shows the colours that worked for me (the background colour is ‘bbbbff’):

[attachment=0]combobox_problem3.jpg[/attachment]
Thanks again

Craig

combobox_problem3.jpg
combobox_problem3.jpg483×204 36.3 KB

13

Hi

I have a similar problem with the display of pop-ups and comboboxes in table view (and list views) but a bit more fundamental. The display of these controls look just not professional (my opinion only, of course), but I am still afraid to show them to customers (in our app under development). So the problem unfortunatly is not at all solved for us.
Usually (in Apple style apps) they are shown as normal list field with up/down arrows for a pop-up or a down arrow for a combobox.
If one has a table view with many columns with pop-ups and comboboxes, the display of these controls is also very distracting.

Has Servoy really no influence in the display of these controls, i. e. it’s really only a Java problem?

Regards, Robert

PS: I am talking of the display on Macs (have to check it on Windows)

craig-c:
Hi,

Big thanks for that. The problem is now solved. The screen shot below shows the colours that worked for me (the background colour is ‘bbbbff’):

[attachment=0]combobox_problem3.jpg[/attachment]
Thanks again

Craig

14

Hi Robert,

Robert Huber:
I have a similar problem with the display of pop-ups and comboboxes in table view (and list views) but a bit more fundamental. The display of these controls look just not professional (my opinion only, of course), but I am still afraid to show them to customers (in our app under development). So the problem unfortunatly is not at all solved for us.
Usually (in Apple style apps) they are shown as normal list field with up/down arrows for a pop-up or a down arrow for a combobox.
If one has a table view with many columns with pop-ups and comboboxes, the display of these controls is also very distracting.

In a list view you could use a label to display the value and an (up-/down arrow) image that shows a popupmenu via a method but in a table-view this would have a less desired effect because that image will be in a separate column.

Robert Huber:
Has Servoy really no influence in the display of these controls, i. e. it’s really only a Java problem?

One of the solutions could be in version 4.1 where you could use an onRecordSelect event to trigger an event to set the display type of the comboboxes. So when not selected it shows a (non-editable) field and when selected it shows a combobox.

15

Hello Robert

Thanks for your suggestions! I tried your first suggestion but that doesn’t work because as you say it “creates” a new column which is just not handable by users.
Thanks for the view into the future :D about 4.1.

Overall, I am still not so content that such a basic thing, i. e. the display of everday used elements (controls) in various form types need extra work or don’t work acceptable. Showing such forms to customers didn’t give us a great feedback, obviously. Everyone who has seen a table view full of these controls knows what I mean… But as I said, I don’t know if it’s a Java or Servoy or combined (Combobox :idea: problem.

I still hope it’s getting better, hope dies last, as we say.

Regards, Robert

ROCLASI:
Hi Robert,

Robert Huber:
I have a similar problem with the display of pop-ups and comboboxes in table view (and list views) but a bit more fundamental. The display of these controls look just not professional (my opinion only, of course), but I am still afraid to show them to customers (in our app under development). So the problem unfortunatly is not at all solved for us.
Usually (in Apple style apps) they are shown as normal list field with up/down arrows for a pop-up or a down arrow for a combobox.
If one has a table view with many columns with pop-ups and comboboxes, the display of these controls is also very distracting.

In a list view you could use a label to display the value and an (up-/down arrow) image that shows a popupmenu via a method but in a table-view this would have a less desired effect because that image will be in a separate column.

Robert Huber:
Has Servoy really no influence in the display of these controls, i. e. it’s really only a Java problem?

One of the solutions could be in version 4.1 where you could use an onRecordSelect event to trigger an event to set the display type of the comboboxes. So when not selected it shows a (non-editable) field and when selected it shows a combobox.

16

Hi Robert,

Robert Huber:
Thanks for the view into the future :D about 4.1.

I just realized that what I proposed might not work. First of all in 4.1 you can create elements and set all it’s properties via code, BUT this is done BEFORE it’s loaded, at least that is what Bob Cusick told us at ServoyWorld.
Also I know that in a listview when you change a property on a field it will change for the whole column. I don’t know if this also works the same with a table view. I know it can be done in java but I don’t know if the way Servoy implemented things will allow you.
I haven’t have yet the opportunity to use Servoy 4.1beta1 to test this assumption.
I just checked but the beta installer is not yet available. :(

17

Hi Robert (H.),

Unfortunately, it’s a combination of the OS, Java and the Look and Feel (so basically also Java) that brings these limitations.

BTW: What do you mean with popups? I understand Comboboxes, but which element is a Popup?

Paul

18

Hi Robert,

I found one way to get what you want in a table view. Should even work in older versions of Servoy.
I used the following ‘ingredients’ :

  • image with popup arrows
  • calculation that shows the dataprovider value and the image in an HTML table
  • form in table view
  • label with calculation as dataprovider
  • label has an onAction method that builts a popup menu and shows it
  • method that sets the choosen value from the popup menu

Which results in this:

Only downside is that the table width have to hardcoded in the HTML to match the field width.
But I think this is what you want right ?

19

Hi Paul

A combobox is a combination box (therefor the name) of a field and a pop-up (the field part on the left and the pop-up part on the right, marked with a graphic (blue an down arrow on the Mac).
The user can in a combobox either select from the pop-up or enter something not available in the pop-up. In a pop-up control, the user has to select something from the pop-up. Often there is also a -none- selection in a pop-up possible, if the database value (i. e. the entity attribute) is optional.

Best regards, Robert

pbakker:
Hi Robert (H.),

Unfortunately, it’s a combination of the OS, Java and the Look and Feel (so basically also Java) that brings these limitations.

BTW: What do you mean with popups? I understand Comboboxes, but which element is a Popup?

Paul

20

ah, you mean just the difference between an editable and not editable ComboBox, in Servoy terms that is.

On Windows, both are displayed exactly the same afaik and since I’m not on Mac, I never noticed a difference there.

Tnx for the clarification.

Paul