App designer tab groups insert a fig

I have built an app using App Designer. This App has 6 tabs. I need to create a figure window on a particular tab say tab2 and then plot onto that figure which is part of Tab2

Answer 1

[Kevin Holly]

Please see that attached app. Also see the example here. Let me know if these answer your questions.

[Gary English]

first what is "app.Plotpanel" I do not see it in my component library and i am using 2021b. using the Axis componet will not work for what i need to do. I just need a plain old figure, no visual axis. I am plotting a globe that can be rotated freely.

[Kevin Holly]

I don't know. Look at the accepted answer to the question. I attached an app. I will attach here for your convenience.

[Kevin Holly]

First app I attached:

Layout:

Code:

classdef CreateFigureonTab < matlab.apps.AppBase

    % Properties that correspond to app components
    properties (Access = public)
        UIFigure              matlab.ui.Figure
        GenerateFigureButton  matlab.ui.control.Button
        TabGroup              matlab.ui.container.TabGroup
        Tab                   matlab.ui.container.Tab
        Tab2                  matlab.ui.container.Tab
        UIAxes                matlab.ui.control.UIAxes
        Tab3                  matlab.ui.container.Tab
        Tab4                  matlab.ui.container.Tab
        Tab5                  matlab.ui.container.Tab
        Tab6                  matlab.ui.container.Tab
    end

    % Callbacks that handle component events
    methods (Access = private)

        % Button pushed function: GenerateFigureButton
        function GenerateFigureButtonPushed(app, event)
            app.UIAxes.Visible = 'on';
            plot(app.UIAxes,rand(10,1),rand(10,1))
        end
    end

    % Component initialization
    methods (Access = private)

        % Create UIFigure and components
        function createComponents(app)

            % Create UIFigure and hide until all components are created
            app.UIFigure = uifigure('Visible', 'off');
            app.UIFigure.Position = [100 100 640 480];
            app.UIFigure.Name = 'MATLAB App';

            % Create TabGroup
            app.TabGroup = uitabgroup(app.UIFigure);
            app.TabGroup.Position = [1 1 403 480];

            % Create Tab
            app.Tab = uitab(app.TabGroup);
            app.Tab.Title = 'Tab';

            % Create Tab2
            app.Tab2 = uitab(app.TabGroup);
            app.Tab2.Title = 'Tab2';

            % Create UIAxes
            app.UIAxes = uiaxes(app.Tab2);
            app.UIAxes.XTick = [];
            app.UIAxes.XTickLabel = '';
            app.UIAxes.YTick = [];
            app.UIAxes.Box = 'on';
            app.UIAxes.Visible = 'off';
            app.UIAxes.Position = [21 199 361 239];

            % Create Tab3
            app.Tab3 = uitab(app.TabGroup);
            app.Tab3.Title = 'Tab3';

            % Create Tab4
            app.Tab4 = uitab(app.TabGroup);
            app.Tab4.Title = 'Tab4';

            % Create Tab5
            app.Tab5 = uitab(app.TabGroup);
            app.Tab5.Title = 'Tab5';

            % Create Tab6
            app.Tab6 = uitab(app.TabGroup);
            app.Tab6.Title = 'Tab6';

            % Create GenerateFigureButton
            app.GenerateFigureButton = uibutton(app.UIFigure, 'push');
            app.GenerateFigureButton.ButtonPushedFcn = createCallbackFcn(app, @GenerateFigureButtonPushed, true);
            app.GenerateFigureButton.Position = [461 133 103 22];
            app.GenerateFigureButton.Text = 'Generate Figure';

            % Show the figure after all components are created
            app.UIFigure.Visible = 'on';
        end
    end

    % App creation and deletion
    methods (Access = public)

        % Construct app
        function app = CreateFigureonTab

            % Create UIFigure and components
            createComponents(app)

            % Register the app with App Designer
            registerApp(app, app.UIFigure)

            if nargout == 0
                clear app
            end
        end

        % Code that executes before app deletion
        function delete(app)

            % Delete UIFigure when app is deleted
            delete(app.UIFigure)
        end
    end
end

Second app I attached:

Start of App:

After clicking "Plot Matrix" button

This was a 2-Panel App and then a panel component was placed on the right panel. You can convert to the 2-Panel App with the convert button under the Canvas tab within App Designer's toolstrip.

Code:

classdef GenerateSubplotsFromMatrix < matlab.apps.AppBase

    % Properties that correspond to app components
    properties (Access = public)
        GenerateSubplotsfromRandomMatrixUIFigure  matlab.ui.Figure
        GridLayout             matlab.ui.container.GridLayout
        LeftPanel              matlab.ui.container.Panel
        RowsEditField          matlab.ui.control.NumericEditField
        RowsEditFieldLabel     matlab.ui.control.Label
        ColumnsEditField       matlab.ui.control.NumericEditField
        ColumnsEditFieldLabel  matlab.ui.control.Label
        PlotMatrixButton       matlab.ui.control.Button
        RightPanel             matlab.ui.container.Panel
        Panel                  matlab.ui.container.Panel
        TabGroup               matlab.ui.container.TabGroup
        Set1Tab                matlab.ui.container.Tab
    end

    % Properties that correspond to apps with auto-reflow
    properties (Access = private)
        onePanelWidth = 576;
    end

    % Callbacks that handle component events
    methods (Access = private)

        % Button pushed function: PlotMatrixButton
        function PlotMatrixButtonPushed(app, event)
            a = rand(app.RowsEditField.Value,app.ColumnsEditField.Value);
            
            delete(app.TabGroup.Children(2:end))
            delete(app.TabGroup.Children(1).Children)

            for i = 4:3:size(a,2)
                if ceil(i/3) > size(app.Panel.Children.Children)
                    uitab(app.TabGroup,'Title',['Set' num2str(ceil(i/3))])
                end
            end

            for i = 1:3:size(a,2)
                ax1 = axes(app.Panel.Children.Children(ceil(i/3)),"Position",[0.1300 0.7093 0.7750 0.2157]);
                plot(ax1,a(:,i))
                if i+1 <=size(a,2)
                    ax2 = axes(app.Panel.Children.Children(ceil(i/3)),"Position",[0.1300 0.4096 0.7750 0.2157]);
                    plot(ax2,a(:,i+1))
                end
                if i+2 <=size(a,2)
                    ax3 =axes(app.Panel.Children.Children(ceil(i/3)),"Position",[0.1300 0.1100 0.7750 0.2157]);
                    plot(ax3,a(:,i+2))
                end
            end
        end

        % Value changed function: RowsEditField
        function RowsEditFieldValueChanged(app, event)
            app.RowsEditField.Value = round(app.RowsEditField.Value);            
        end

        % Value changed function: ColumnsEditField
        function ColumnsEditFieldValueChanged(app, event)
            app.ColumnsEditField.Value = round(app.ColumnsEditField.Value);     
        end

        % Changes arrangement of the app based on UIFigure width
        function updateAppLayout(app, event)
            currentFigureWidth = app.GenerateSubplotsfromRandomMatrixUIFigure.Position(3);
            if(currentFigureWidth <= app.onePanelWidth)
                % Change to a 2x1 grid
                app.GridLayout.RowHeight = {510, 510};
                app.GridLayout.ColumnWidth = {'1x'};
                app.RightPanel.Layout.Row = 2;
                app.RightPanel.Layout.Column = 1;
            else
                % Change to a 1x2 grid
                app.GridLayout.RowHeight = {'1x'};
                app.GridLayout.ColumnWidth = {266, '1x'};
                app.RightPanel.Layout.Row = 1;
                app.RightPanel.Layout.Column = 2;
            end
        end
    end

    % Component initialization
    methods (Access = private)

        % Create UIFigure and components
        function createComponents(app)

            % Create GenerateSubplotsfromRandomMatrixUIFigure and hide until all components are created
            app.GenerateSubplotsfromRandomMatrixUIFigure = uifigure('Visible', 'off');
            app.GenerateSubplotsfromRandomMatrixUIFigure.AutoResizeChildren = 'off';
            app.GenerateSubplotsfromRandomMatrixUIFigure.Position = [100 100 773 510];
            app.GenerateSubplotsfromRandomMatrixUIFigure.Name = 'Generate Subplots from Random Matrix';
            app.GenerateSubplotsfromRandomMatrixUIFigure.SizeChangedFcn = createCallbackFcn(app, @updateAppLayout, true);

            % Create GridLayout
            app.GridLayout = uigridlayout(app.GenerateSubplotsfromRandomMatrixUIFigure);
            app.GridLayout.ColumnWidth = {266, '1x'};
            app.GridLayout.RowHeight = {'1x'};
            app.GridLayout.ColumnSpacing = 0;
            app.GridLayout.RowSpacing = 0;
            app.GridLayout.Padding = [0 0 0 0];
            app.GridLayout.Scrollable = 'on';

            % Create LeftPanel
            app.LeftPanel = uipanel(app.GridLayout);
            app.LeftPanel.Layout.Row = 1;
            app.LeftPanel.Layout.Column = 1;

            % Create PlotMatrixButton
            app.PlotMatrixButton = uibutton(app.LeftPanel, 'push');
            app.PlotMatrixButton.ButtonPushedFcn = createCallbackFcn(app, @PlotMatrixButtonPushed, true);
            app.PlotMatrixButton.FontSize = 18;
            app.PlotMatrixButton.Position = [59 126 101 30];
            app.PlotMatrixButton.Text = 'Plot Matrix';

            % Create ColumnsEditFieldLabel
            app.ColumnsEditFieldLabel = uilabel(app.LeftPanel);
            app.ColumnsEditFieldLabel.HorizontalAlignment = 'right';
            app.ColumnsEditFieldLabel.FontSize = 18;
            app.ColumnsEditFieldLabel.Position = [19 193 77 23];
            app.ColumnsEditFieldLabel.Text = 'Columns';

            % Create ColumnsEditField
            app.ColumnsEditField = uieditfield(app.LeftPanel, 'numeric');
            app.ColumnsEditField.ValueChangedFcn = createCallbackFcn(app, @ColumnsEditFieldValueChanged, true);
            app.ColumnsEditField.HorizontalAlignment = 'center';
            app.ColumnsEditField.FontSize = 18;
            app.ColumnsEditField.Position = [111 192 100 24];
            app.ColumnsEditField.Value = 9;

            % Create RowsEditFieldLabel
            app.RowsEditFieldLabel = uilabel(app.LeftPanel);
            app.RowsEditFieldLabel.HorizontalAlignment = 'right';
            app.RowsEditFieldLabel.FontSize = 18;
            app.RowsEditFieldLabel.Position = [46 230 51 23];
            app.RowsEditFieldLabel.Text = 'Rows';

            % Create RowsEditField
            app.RowsEditField = uieditfield(app.LeftPanel, 'numeric');
            app.RowsEditField.ValueChangedFcn = createCallbackFcn(app, @RowsEditFieldValueChanged, true);
            app.RowsEditField.HorizontalAlignment = 'center';
            app.RowsEditField.FontSize = 18;
            app.RowsEditField.Position = [112 229 100 24];
            app.RowsEditField.Value = 34;

            % Create RightPanel
            app.RightPanel = uipanel(app.GridLayout);
            app.RightPanel.Layout.Row = 1;
            app.RightPanel.Layout.Column = 2;

            % Create Panel
            app.Panel = uipanel(app.RightPanel);
            app.Panel.Title = 'Panel';
            app.Panel.Position = [1 57 488 428];

            % Create TabGroup
            app.TabGroup = uitabgroup(app.Panel);
            app.TabGroup.Position = [1 1 488 406];

            % Create Set1Tab
            app.Set1Tab = uitab(app.TabGroup);
            app.Set1Tab.Title = 'Set1';

            % Show the figure after all components are created
            app.GenerateSubplotsfromRandomMatrixUIFigure.Visible = 'on';
        end
    end

    % App creation and deletion
    methods (Access = public)

        % Construct app
        function app = GenerateSubplotsFromMatrix

            % Create UIFigure and components
            createComponents(app)

            % Register the app with App Designer
            registerApp(app, app.GenerateSubplotsfromRandomMatrixUIFigure)

            if nargout == 0
                clear app
            end
        end

        % Code that executes before app deletion
        function delete(app)

            % Delete UIFigure when app is deleted
            delete(app.GenerateSubplotsfromRandomMatrixUIFigure)
        end
    end
end

Answer 2

[Gary English]

ok, my matlab is located on another network here. It is on a classified network so no physical connection to the low side which is vanacular for regular internet. There is no way to transfer the .mlapp from the low side to high side if i want to stay working. The plotting panel that you used did it come from Matlab's component library? could you take a snap shot of the code in the App properties so i can see if it is a component then i can holler at the IT fokes to get an updated Matlab. This will also show up in the Initilize Component section where the Tab you used. A snippet there would also work