How to change tab group order in AppDesigner

I'm creating an application using App Designer in 2016b, I'm finishing up the project just to realize that I can't simply drag and drop tabs in a tab group to change the order. After looking through tab group documentation there doesn't seem to be a parameter that changes the tab order. Also I cannot find any tab order variables/methods in the setup portion of the code. I am most likely missing something obvious, so any insight is much appreciated.

Answer 1

[Sally Al Khamees]

The ability to reorder tabs in a tab group is not currently available using the App Designer graphical interface; however, it is possible to do this programmatically. The "Children" property of a Tab Group object is an array that contains the Tab objects inside the Tab Group, and the order of the Tab objects within this array corresponds to the order that the tabs are displayed in the GUI. Therefore, if you reorder the Tab objects within the "Children" property, this will change the order in which the tabs are displayed.

[James Ryan]

I have the same problem.

I can order the tabs at run time with the sort of ugly code below, but they stay out of order in the App Designer gui. If I could just drag and drop 3 lines of the greyed-out code in Code View everything would be okay. I see that the mlapp file is not in plain text, presumably to save me from the sin of hand-editing it.

Is there any way to get the gui to show the right thing?

              tabs = app.TabGroup.Children;
              ttab = tabs(5);
              tabs(5) = tabs(4);
              tabs(4) = ttab;
              app.TabGroup.Children = tabs;

Answer 2

[Palmi Thor Thorbergsson]

Hi! I just ran into this problem when adding a new tab that I wanted to appear in the second spot. My solution (using the app-designer GUI) was to first create the new tab, then cut and paste the already existing tabs that I wanted to move to the right of the new tab. Seems to work just fine. I guess the only risk with this solution is that you might accidentally put something else in the clipboard before pasting a tab that you just cut. However, if you happen to do that, you can undo the cutting in the GUI. /Palmi

[Palmi Thor Thorbergsson]

Just a little update: I just found out that the callback associations disappeared when doing the above. The callbacks are still defined, so if you know which callback should be associated with each element, this can easily be recovered. /Palmi

Answer 3

[Melissa Williams]

Hello, In R2017b interactively dragging and dropping to reorder tabs is now supported in App Designer.

[Michael Amonson]

I'm running R2017b and I still can't drag and drop in the Component Browser or the Code Browser to reorder the callbacks. Are you running some sort of beta version of R2017b? I can't believe this is so difficult! This is a huge oversight. There should be an easy way of allowing the user to reorder the callbacks. Please provide some insight/guidance as to what I can do to organize the callbacks.

Answer 4

[BAHADI Zouhair]

In fact you can do it easily by copying the tabs to which you want to change the order and then you paste them in the right place. Then you remove the tabs that are not in their place and then you go to the tab that you moved you right click on the bontons to which you have already made the callback and then you put select existing callback and you associate it with the good callback that you have already written and here everything should work after that .

Answer 5

[Jessica Hiscocks]

A better approach in 2016b: create a second tab group off to the side. Without copy/paste, drag the components to the dummy tab. Delete/rename the empty original tabs to get the order you want. Drag everything back. If you do this, callbacks seem to be preserved.