Tab Strip: Is this kind of navigation possible?

Is the type of navigation I’ve created in Paint possible in Ignition (see attached picture)? The top tab strip would be the navigation between all the different major sections of the program. Under some tabs I’d like to have another tab strip to navigate between different sub sections of that major section. So far I just can’t figure it out. If I make the sub tab strip docked, North, when I click the “Data Lookup” tab, the main tab strip and the sub tab strip both move to the bottom of the page. I’d like them to stay at the top of the screen where they belong, and also have the page for the first sub tab displayed.

Any help would be appreciated.

Place your Top Tab and the Sub Section tabs on the same window. Turn off the navigation in the Top Tab. Set the visibility of your Sub Section tabs to be based on the selected tab of your Top Tab. Use your Sub Section tabs to do the navigation. {Root Container.TopTab.selectedTab} = "Alarms"

Ok… well I forgot to mention that some of the tabs don’t have sub tabs. The first tab, for instance, shows an overall production status dashboard that I want to go all the way up to the bottom of the tab strip. Will this still work the same way doing what you suggested?

Not exactly. Your top window contains your Main Tab and Sub Tabs, so when you select a Main Tab that doesn’t have a Sub Tab your window won’t change in size, meaning there’ll be an empty space where your Sub Tabs usually show up.

Consider changing the look of the Main Tab to look more like a web page navigation, that way when a Sub Tab isn’t show it doesn’t look out of place. Then if you have a window that doesn’t have a Sub Tab you can use the following code in the Main Tab’s propertyChange event to open that window. if event.source.selectedTab == "Dashboard": system.nav.swapTo('Dashboard')

So here’s an image of my navigation window showing the Main Tab and the Sub Tab for Water Plant 1
[attachment=1]NavExample.jpg[/attachment]
Here’s an image of the navigation window when Dashboard is selected in the Main Tab but it does not have a Sub Tab. The above code is what is used on the Main Tab to open the Dashboard window directly.
[attachment=0]NavExample2.jpg[/attachment]

So let me make sure I understand what you’re suggesting clearly. If I want each main tab to have its own set of sub tabs, I would have to layer a bunch of sub tab strips on top of each other and use visibility to display the correct one?

I really figured with a more modern program there would be better options for this kind of stuff. This is how I did things in RsView back in 1999. I remember layering up to 5 things. It can get confusing.

That's how I do it. You could try coding the opening and closing of windows in the propertyChange event of your Main Tab, but that'll probably be more work.

You can also have more than one docked-north window, and they’ll stack. So you could have certain selections on the top tab strip open your secondary tab strip docked window…

Carl, I tried that. When I click the tab on the main tab strip that opens the second tab strip, they both move to the bottom of the screen. I can’t seem to control that.

Maybe a call to tech support will be needed to figure this out, or a sample project I can look at. I’m having a hard time describing/typing what I want to see.

This seems to be working fine for me.

I made a tab strip and 3 containers with their visibility bound to the tab selected value in an expression.

Inside the 3rd container I added another tab strip and 3 more containers with visibility tied to the inner tab strips selected tab value.

Is this what you are trying to do or am I missing something?

EDIT: I see now that you are trying navigate between windows.

You know, as of 7.6 there’s a completely alternate way to do tabbed interfaces that you could also consider.

Instead of having the tab strip swap windows, you can have the tab strip on a window and a template as the main contents of the window. Simply turn off the automatic navigation on the tab strip, and bind the template’s path to the selected tab, and then make your tab names valid templates.

You’d implement your “windows” as templates, and in this way, you’d always have the same window open, and by selecting tabs, it just loads different templates into the main content area. It’s pretty slick, and would make it easy to nest tabbed interfaces just by nesting the technique.

Carl, I’m on version 7.6.4. Would it be possible for you to send me a sample project of what you’re describing? I have a lack of training at this point and attending a class in California isn’t feasible for me. I also can’t find many tutorials/training resources online besides this forum. Sample projects work great though.

EDIT: I should mention, what you’re describing does sound very slick. I think I’d like that!

You bet, check out this project. Tab 3 shows the nesting.

Very nice… very nice. I have it open now. I’m liking what I see.

Yeah, the only downside is that the templates get loaded fresh each time, which might be slightly slower than if you were swapping windows because the windows have a caching system, but, it is pretty clean to put together.

It’s certainly cleaner than doing a design where the tab contents are all on the window and only one is visible at a time (although, that works just as well, it’s just annoying to deal with in the Designer)

I’ll have to see if there are any performance issues. If there are, I’ll do it the layer/visibility way. I’ve done layering with visibility and that can get confusing real fast! I’d like to avoid that if possible.

By the way, is it possible to save all my existing windows as templates? For my first test I copied and pasted the contents of one window into a template. I have a bunch of windows and if there’s a better way, I’d love to know it.

Thanks for your help.

Sorry, no, you’ll have to copy/paste the contents

I know this discussion is a little outdated, but does anyone still have the sample project that you are talking about, Carl? I have tried using tab strip navigation where you bind the visibility to an expression, but I was hoping to find a better option for tab strip navigation that didn’t involve hiding multiple objects.

I don’t have a copy of the project referenced before, but I remember the technique was pretty simple. The idea was to have a single window that consisted of a tab strip and a template holder component. Each tab represented a template, and then the template path property of the template holder was simply bound to the selected tab in such a way that the names lined up, so as you used the tab strip, the template holder swapped out and it acted like navigation.

Thank you for responding even though it’s been quite awhile. You definitely clarified some things for me and now I have a better idea as to how the navigation will work.