Tab Strip Swap doesn't close the previous windows, it adds the windows to the side, one after another

I'm trying not to ask questions here until I put some time in searching the videos. I'm about 50% through the videos, and I'm putting together an edge HMI that is based on a Red Lion HMI I built a while back. The PLC program is not done, so this is only the visual "shell"... the navigation, main pages, and graphics.

I'm ending the work day frustrated that I can't figure out why my Tab Menu doesn't Swap the Main Pages... it adds the new pages without closing the old ones. So the "open at start" Tab Menu (docked-left) opens on the left, with a "open at start" floating main page. I click on a new tab, and the page is added to the screen, without closing the old one. I click on another tab, and a third window is opened, so all three windows are now next to each other, to the right of the left-docked menu screen with the tabs. It seems so simple... what the heck! At this point I've tried everything I could think of. This should be so very simple. Any ideas? Can someone point me in the right direction? The tabs open the pages, but the old page doesn't close. The box for allowing the window to close is checked (true).

(I'm so new here... does it help to export the file here and add it to the post? I'll put it here just in case.)
Edge_2023-03-03_1458.zip (37.1 KB)

The problem is likely that the windows you're trying to swap between are not proper "main" windows:
https://docs.inductiveautomation.com/display/DOC81/Navigation+Strategies+in+Vision
https://docs.inductiveautomation.com/display/DOC81/Navigation+-+Tab+Strip

Note the definition of "Main Window" here - it's derived from the values of certain properties; there's nothing intrinsically different about docked vs popup vs main windows:
https://docs.inductiveautomation.com/display/DOC81/Window+Types#WindowTypes-MainWindows

Review:

https://docs.inductiveautomation.com/display/DOC81/Navigation+Strategies+in+Vision

In particular:


Last note, when you create a project, there are templates you can use, which have some of this setup for you...

Also, as you mentioned them opening to the side, do you mean in Designer? In Designer, windows open in their own independent tab. For testing, you should be launching a client.

1 Like

I mean in the client Vision application. I don't use the preview anymore.

I'm using the Tab Strip:

...so even though it's a Tab Strip, I still have to right click on it and Choose "scripting", then "Event Handler" and probably "mouse clicked", since it is a touch screen. Then Open / Swap.

It seems weird at this point because there are individual settings for each tab that ask about the page to open. I'll play around with it.

Haven't played with touchscreens much recently, does it exhibit the same behaviour if you run it on your laptop/PC and use mouse not touchscreen?

Yes, absolutely.

At this point, I'm giving up and driving home. I tried a couple of different variations. Here's one last screen shot showing my last attempt at getting a setting that makes sense... On mouse click, Swap Window. This doesn't make much sense because it doesn't seem to differentiate between the different tabs on the strip this way. It didn't work. None of the windows closed. They laid on top of each other.

I'm going to spin up your export and have a look. Have a good weekend, and when you come back Monday I'll hopefully have a definitive answer of what's going wrong.

Thank you for that!

I'll actually look at it over the weekend if it's available. This will bug me until it's resolved.

I remember seeing the example files mentioned somewhere. Where do I look for those?

Well, it's when you create a new project, but on Edge you only have one project, that is created for you I think from the install, so that might change things slightly. Pretty sure I've used the template in vision on Edge, just maybe not version 8 so that might have changed things.

Edit, so yeah it's not available on Edge, you have to download and install "full version", start a new project with the template you want, then export those resources, and import to Edge.

Alright, so I've had a look.

I think the crux of the issue is you have created all windows, including your windows with tab strips as "main windows". It's quite hard to tell in Designer in V8, when you right click to create it shows the "docked windows" with a stripe right the way across the top, but once created it looks the same as the symbol for a main window (two dots top left).

You should not be using scripting with the open/swap options. Double click the component (tab strip) and this opens the tab strip customizer. I see you've already been in here, as some of the config is there. However, some are going to "Tab 3" etc, not "Main Windows/Roll Stand Temps" etc.

So not sure if you only did a partial export, or if you just haven't created all windows yet. Another tip, place a label on each window, and enter the text as what the window is supposed to be displaying. That way, when you are changing through them for testing, you can see if they have successfully opened or not. For future help, a full GWBK (Gateway backup), may be more useful, so long as there is no confidential information in the project. To do this, go to the gateway in your web browser, config, backup/restore. Just comment what version you are using, as 8.1.25 cannot be restored into 8.1.20 etc.

nav templates

As suggested, you may want to download the full version onto another laptop, or a VM, and create a project with a template and see how it is setup. The one you want to select is "Vision Tab Nav". This uses the same tab strip component you are.

1 Like

Well, this is why I'm glad I asked. This changes my paradigm for window types. I thought a Main Window type was appropriate for windows attached to the tabs.

I downloaded the full version onto a VM, along with Designer and Vision Client. I chose the Quick Start to get the sample project to explore and dissect. And I'm VPN'd into the customer's machine PC to look at changing the windows. I'm trying not to get to far ahead of myself with the designing. I have had too many learning-curve experiences where I had to backtrack and wipe out progress because I left out something systemically important. I'm working on this project at the same time I'm taking care of all of my regular customers, so I get 2-3 days a week to focus on this... including the control wiring and PLC programming. I'm really cautious about efficient use of time. But then again, this is the really fun stuff, isn't it?! (once I get past the learning curve)

I'll change the window types and try it again. I only created 3 windows because I wanted to confirm it was right before moving forward. I only started creating windows after getting through the Vision section in the videos. I started the project after seeing the "Tab Strip" function, because I wanted to see if I could recreate what I did on the Red Lion HMI. The plant manager likes the idea of using that HMI as a template for screen design on this machine, so the operator training is quicker. I can't get the tabs to look like buttons (that's why they're called "Tabs", right?). But that's not important, as long as the layout is roughly the same. I'll throw a pic of the Main Screen of the RL HMI below for the heck of it.

Thanks for your help. I'm sure I'll be back.

If you want it to look like buttons, then you can absoulutely do that, just don't use the tab strip, create individual buttons and use the swap to script on them for changing main windows.

Here's one, albeit redacted:

The important thing about your nav sections, is when you open them, they should only be the width of the nav, not fhe full screen. When I opened yours, they were full screen width with nav left and top on the two menus.

When these are docked, you choose them as docked West or North etc. Your other main screens that are opened, occupy the rest of the space.

Hope this helps.

1 Like

It is. But your nav itself, holding the tab strip/buttons, should be docked type.

1 Like

Hmmm.... Both of my menu windows should be docked. The name (below) is the default name for that window in the Property Editor. The only thing I changed on the property editor for the Machine Menu was the size. I couldn't get all of the tabs to show at once on the screen, even though there was plenty of room. Scrolling arrows appeared near the bottom of the screen, covering up the last 2 tabs. I played around with changing the sizes until the arrows went away, and all the tabs appeared at the same time.

Hmm yes, on second look I do see you have that set right. I think you're very nearly there. Compare between the IA quick start / start a new project with a template. It's always easier to modify an existing resource than start from scratch, so you could export the windows from a blank template project and rename them to suit.