The Rookie Rides Again - Tabpanels

Classic Servoy
1

Good morning (or afternoon or evening),

As some of you may know, I am in the process of converting an old Access application to Servoy. We make extensive use of tabbed interfaces in the original system, and want to make use of that in Servoy as well. I would like to create a tabpanel that has, say, 2 rows of tabs, with equal sized tabs across the tabpanel.

Currently, when I create a tabpanel, the tab size seems tied to the text on the tab, which leads to a sort of unappealing mix of tabs of all different sizes. I have found that I can control the width of the tab somewhat by adding leading and trailing spaces to the tab text, which, if I count spaces correctly, will center the text and increase the size of the tab as needed. I haven’t gotten into creating a second row of tabs yet, but it appears that this just “happens” if the tabs become larger than the width of the tabpanel and scrolling is set appropriately.

I’ve looked in Adrian McGilly’s “Servoy Beginner’s Handbook”, here on Servoy Talk, and in the Version 4 Developer’s Guide (I haven’t been able to locate a Version 5 Developer’s Guide yet, but it’s been a few days since I looked), and so far haven’t found much of any information on how to control this. I also haven’t learned about “styles” yet, and perhaps the answer is there. What I’d like to be able to do is something akin to…

  1. Give me “x” tabs in “y” rows, and have Servoy calculate the width of the tabs based on the tabpanel size.
  2. Allow me to control the order of the tabs by a “tab” value of some sort.
  3. As an alternative, at least control the width of each tab.

I’m certainly no expert on UI design, but it would seem that having a consistent size to the tabs and having a reasonable number of tabs in each row would make the overall look and fell more pleasing and usable. I understand that at some point, you’d need a different sort of interface if the number of tabs becomes to onerous, but up to say, 15 or so in total, should be ok. After that, it may be better to move to something like the interface used in the Eclipse “Preferences” form, although I’m not entirely sure how you’d implement that in Servoy. I think one of the frameworks may do something similar.

So, after all that, I’m wondering what I’ve missed. As always, any help would be greatly appreciated.

Thanks and have a good day.

Ron

2

Hi Ron, good afternoon from Gran Canaria.

You can control de order of the tabs in design mode. The tab order is set depending on the location of each form. Put them from the top-left to the bottom right, that will be the order.

You can change the tab size using your own. For example set the TabPanel property tabOrientation to HIDE and place some labels just at the top of the panel with the title of each tab. Use the onAction event of each label to change the visible tab. Take note that if you assign a method to the onAction event of a label it becomes a button, so to make it look better you must unclick the property showClick.

I hope this helps.

3

Hi Juan,

That’s very interesting information. I understood the idea of the order of the tabs, but the other information is new to me, and I appreciate you sending it. I will certainly look into that.

I had to look up Gran Canaria. It looks like a very interesting place to live. Here in Illinois in the U.S., it is mostly flat and our geography is not that interesting. We are very close to Lake Michigan, which tempers our climate to some extent, but we tend to have hot, humid summers, and cold winters (below 0 F. is not too unusual).

Thanks again for that information and have a nice afternoon.

Ron