LabVIEW Scalable Tabs to Control Separate Tasks on the Same Interface

[Drew.Rankin]

I was working on a new project this week and wanted to have a smart way to switch between the different tasks the application had to perform without having a side bar, or HMI style buttons. So here's what I came up with:

The buttons across the top are from a system tab control which is behind a single sub-panel container. When the user clicks on another tab, the application automatically switches between tasks by unloading and loading the tasks in the sub-panel.

Another feature I wanted was for the tabs to be justified across the user interface and for all the controls on the screen to be able to size with the window. The scaling of the controls is not very fluid, but when the user re-sizes the window, all the controls on the main screen scale. I will probably have to scale the sub-panel task controls as well, but that can be a function of the sub-panel task and the main application does not have to worry about what is going on in the sub-panel.

I can never remember how to set the position of the panel/pane, so I figured this was a good place to keep track of that as well. The block diagram above shows the reaction to scaling the window by the vi as well as the inserting of the initial sub vi. The methods of using sub-panels have been covered numerous times on these boards; however, I have not seen an instance where some one used tabs and sub-panels quite like I have here.

EDIT: LV 2010 Added 8 March 2012

[Ravi_Beniwal]

You don't need to worry about scaling on the top level VI. Just put the tab control in a separate pane on the top that is just high enough to show the tabs and set the tab control to fit the pane. Lock the splitter so that a user doesn't accidently move it. Put the subpanel in the lower pane and set it to fit to pane too.

If splitters and panes in the VIs that are going to be loaded in the subpanel are set properly, you should not have to write (connect) a single line (wire) to control scaling.

[Drew.Rankin]

True; however, there is no way to create a transparent splitter for the panes. This leaves me with a distinct line on the UI.

I did look at this and noticed that the scaling of the objects with the panes is similar to what I have demonstrated above. You could disable front panel updates while sizing to eliminate the choppy scaling of the objects.

So to use Ravi's suggestion is a good compromise. You don't have to handle the pane scaling directly; however, you have to find a way to create a panel splitter that will not detract from your UI.

What I was trying to do was to give the appearance of a tabbed control without the overhead of multiple sub panels. I am also preventing scrolling by purposely placing the origin of the pane and placing the controls at a specified location.

[DFGray]

You should be able to make the splitter disappear by changing it to classic mode and coloring it the same color as the background.  In edit mode, you will still see it, but when the VI is running, it will disappear.

[Olivier-JOURDAN]

We have created an object like the one you are implementing for our application Topaze --> http://sine.ni.com/nips/cds/view/p/lang/fr/nid/210425

You can see a video demo of this feature here --> http://www.dailymotion.com/video/xmtmvf_topaze-tab-navigation_tech and small demo app here --> https://decibel.ni.com/content/docs/DOC-12914

We also decided to release this object and others in a free toolkit as soon as possible, perhaps it could be useful for you.

Regards,

Olivier

[Drew.Rankin]

Olivier,

That is very nice and quite similar to what I have done. Please, tell me, do you use custom buttons to perform the functions of tabs? I have seen this behavior before with other examples on these forums with transparent tabs that a buttons. I believe it was the LabVIEW ribbon example. I had considered using that method, but was not sure if I wanted to handle the extra overhead.

Drew

[Olivier-JOURDAN]

We are not using button, because we want to be able to add dynamicaly an "unlimited" number of pages. Actually, we use a picture to draw the tabs and we use, as you do, one subpanel to display the selected tab content.

Regards,

Olivier

[Mads]

In cases where the user interface on each tab is less complex you can do without the subpanel - check out this thread.

[Technico]

Could you upload a LV 2010 version?