How do I set the container of an App Designer component?

I am working on a large app in app designer and need to move some components around. The app has 6 layered containers (i.e. tabs) that the user can select on the left. I finally figured out that I can rearrange components that are not on the default/home tab by changing the visibility of the containers. However, when I go to a different tab in the "Design View" and drag a component, it is automatically moved to a different container or tab. How can I stop this behavior?

Thanks

Answer 1

[TED MOSBY]

Hi,

Open the Component Browser and drag the component under the target container (Panel/Tab/GridLayout), When dropped, App Designer changes the parent; the tree updates to show the component nested under the new container. Hence you can verify the target container there.

Every App Designer UI component has a Parent you can set. Assign it to the destination container (panel, tab, grid, etc.). If the destination uses a GridLayout, also set the component’s Layout position.

% Example: move a button from Panel1 to Tab2
app.Button.Parent = app.Tab2;                   % re-parent

% If Tab2 contains a GridLayout:
app.Button.Parent = app.GridLayout2;            % new parent is the grid
app.Button.Layout.Row = 2;                      % place it
app.Button.Layout.Column = [1 2];

Here is some documentation for reference:

https://www.mathworks.com/matlabcentral/answers/798037-controling-tabs-in-app-designer

https://www.mathworks.com/help/matlab/ref/uitabgroup.html#mw_72df9f67-03e7-4d0e-9d79-7603cde92ba1

https://www.mathworks.com/help/matlab/ref/matlab.ui.container.tabgroup.html

Hope this helps!