App designer first application issue

Hi community,

I have a issue with App designer. I created my first application following a step by step tutorial. Then I ran it without editing the code generated by App designer but I noticed an annoying fact: a blank window appears before components are loaded. How can I show window when all components are created? Window visibility should be already set in some lines. This is the code:

classdef tutorialApp_exported < matlab.apps.AppBase

    % Properties that correspond to app components
    properties (Access = public)
        UIFigure              matlab.ui.Figure
        AmplitudeSliderLabel  matlab.ui.control.Label
        AmplitudeSlider       matlab.ui.control.Slider
        UIAxes                matlab.ui.control.UIAxes
    end

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

        % Value changed function: AmplitudeSlider
        function AmplitudeSliderValueChanged(app, event)
            value = app.AmplitudeSlider.Value;
            plot(app.UIAxes, value*peaks)
            app.UIAxes.YLim = [-1000 1000];
        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 AmplitudeSliderLabel
            app.AmplitudeSliderLabel = uilabel(app.UIFigure);
            app.AmplitudeSliderLabel.HorizontalAlignment = 'right';
            app.AmplitudeSliderLabel.Position = [146 208 59 22];
            app.AmplitudeSliderLabel.Text = 'Amplitude';

            % Create AmplitudeSlider
            app.AmplitudeSlider = uislider(app.UIFigure);
            app.AmplitudeSlider.ValueChangedFcn = createCallbackFcn(app, @AmplitudeSliderValueChanged, true);
            app.AmplitudeSlider.Position = [226 217 150 3];

            % Create UIAxes
            app.UIAxes = uiaxes(app.UIFigure);
            title(app.UIAxes, 'Title')
            xlabel(app.UIAxes, 'X')
            ylabel(app.UIAxes, 'Y')
            zlabel(app.UIAxes, 'Z')
            app.UIAxes.Position = [128 267 300 185];

            % 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 = tutorialApp_exported
            
            % 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

[Mario Malic]

If I understood correctly the nature of this Visibility property: The UIFigure is located in "Windows window" (I don't know the official term for it), this Visibility will only act on the UIFigure window, which is a subset of the former one. Since your app is quite simple, it might just have a grey background for a very short time and then the app will be displayed. I don't think that anything could be done regarding it.

Answer 1

[Adam Danz]

Since the figure visibility cannot be set from Design View within AppDesigner, there's no way to start the app with an invisible figure and then turn it on when ready. The figure's visibility can be set from the startup function but that's too late since the figure rendering begins before the startup function is called.

Workaround: uiprogressdlg

A workaround that I've used is to set a uiprogressdlg early in the Startup function that disables the app until the dialogue handle is deleted at the end of the startup fcn. There will still be a small gap in time between the initial appearance of the app and when it's disabled. I haven't found a way to avoid that.

% Code that executes after component creation
function startupFcn(app)
    % indicate startup
    startupUIProg = uiprogressdlg(app.UIFigure,'Title','Loading App.','Indeterminate','on');

    % Other stuff in your startupfc.
    % Use waitfor() or pause() if you need more wait-time for rendering
    
    close(startupUIProg)
end 

Workaround: uifigure position

Another workaround is to set the uifigure's position to way off of the screen from within Design View of App Designer. Then, at the end of the starutp function you can move the figure into view after it's done rendering. Use movegui to center it on the screen.

 movegui(app.UIFigure, 'center')