Tabpanel Borders

[rochard]

I am trying to have no border or lines outlining a tabpanel - have tried setting the border to 0 and the same color as the background but am still getting the lines. Is it possible to have these lines not show. Thanks.

[jcompagner]

there will always be a small border even if you set the border of the tabarea and the form which you display.

What you can do is make the tabs HIDE and then do the tabswitching yourself with buttons/labels

[Harry Catharell]

Sorry can't visualise this !

Any chance of a simplistic 'two tab' solution for this ?

Harry

[Harry Catharell]

I do mean just to illustrate how this would be set up, nothing grand !

HArry

[rochard]

Thanks for your reply, Johann. In the solution I am working on, I have a master record (Project) which has x number of related records (Stages) and each of those records has x number of related records (Revision). The top section of the form has the Project details and then there is a tab panel below that which shows the Stages form with a tab panel showing the Revisions so I can see an entire record on one screen and have go to and previous record buttons allowing the user to review every stage and every revision in one place. I have no tabs themselves. While this all works and looks good, the borders around the tabpanels definitely detract from the look.

Is it a technical impossibility to have those lines not show because it would certainly make for a cleaner GUI look in some situations?

TIA

[jcompagner]

a normal tabpanel just does have a selection border.

Just set the tab orientation to HIDE and make labels buttens that set's the selected index yourself.

[Harry Catharell]

First portion of reply to Michael,

Michael, look at this link in the 'How To' forum :
http://forum.servoy.com/viewtopic.php?t=1670
There is a solution download called 'navtest' from Jan Aleman which (whilst demonstrating a shared navigation palette) has a Tab Panel on a layout which has NO BORDER !
As far as I can see, it may be that you need to also set the border of the form being displayed within that Tab Panel to be Empty,0,0,0,0
Anyway, have a look and see if it resolves your GUI issue.

Second portion to Johann,

Just set the tab orientation to HIDE and make labels buttens that set's the selected index yourself.

Sorry, Johann, but I have no idea what I need to do to 'set the selected index'

Please take pity on someone who is still learning new things each day and to whom tab panels are mysterious objects which work - but I don't know how !!

Could you give me one line of code from a method that illustrates how I would trigger a tabless tab panel to display a different form !?


Thanks
Harry

[jcompagner]

Place X tabs inside a tabpanel

set the tabpanel property tabOrientation to HIDE
give the tabpanel a name

then place a button (or more buttons) on the formpanel
then attach a method to a button

and do there something like this:
elements.tabPanel.tabIndex = elements.tabPanel.tabIndex+1;

(i have the named the tabPanel, tabPanel)

this example demonstrates one button that sets the index always one higher then before (not a real good thing to do in real of course)

[Harry Catharell]

OK - I have taken another look at what Johann suggested about indexes.

I have now discovered that, as my tab panel has a name and is recognised as an element on the form , I can access its available functions - One of which is.... 'tabIndex'

So now I understand that I can create buttons to represent the hidden tabs and have each button run a method roughly as follows :

Code: Select all

elements.tabs_70.tabIndex = 1


.....or to whatever index number the tab is positioned at !

FYI - it seems that the index number returned runs from '1' onwards and not '0'

So I have solved the mystery - not the mystery of tabpanels themselves, you understand - just how to progammatically interact with them !

Thanks
Harry

[Harry Catharell]

Hi Johan,

Thanks for your feedback, you got your reply in as I was writing mine !!

A very clear and concise explanation.......

I do appreciate your time spent in replying and I hope that you realise that there are certain things which inexperience cannot tell me instinctively and so I must ask what are perhaps fundamental questions in order to point me in the right direction.

Apologies for misspelling your name too !

Cheers
Harry

[david]

Even with tab panels set to "hide", there is a border. I agree, it would be nice get rid of the border. For now I have just taken this fact into consideration when designing interfaces.

If I could upload a .gif to this post (something is wrong with file upload to the forum), I would post a pic to show this.

In any case, I always use hidden tab panels with my own tabs so that the solution looks the same on all platforms. The only look and feel setting that will mess it up is Windows XP. Thankfully, Kunstoff is the default setting on the windows operating system and not Windows XP.

- David

[jcompagner]

then you don't have set all the borders to empty
Because i don't see any border

Set the border of the tabpanel itself to empty (0,0,0,0)
and set the border of the form you show in the tabpanel to empty
There there are no borders.

[david]

Ah, missed the part about setting the form's border to empty as well. Nice!

- David

[aron]

thank you thank you thank you thank you!

To get a true borderless tabpanel, the tabpanel AND the form's border's have to be "empty." That was puzzling me forever, and I think it's strange behavior. Would this work in Servoy styles if the following were true?

Code: Select all

tabpanel { border-style: none; }
form { border-style: none; }

Aron

[ROCLASI]

Hi Aron,

That wouldn't work. What you can use is the following:

Code: Select all

form
{
   border-style: solid;
   border-width: 0px 0px 0px 0px;
}

As for the tabpanel. It doesn't have a border when you set the tabOrientation property to 'Hide'. Something you can't set with a styleSheet.


Hope this helps.