MATLAB: Does the app not resize properly for different screen resolutions in App Designer

MATLAB

The size of the GUI and all its elements does not scale with the screen size of the monitor. This leads to some problems if the designed GUI is used on smaller laptops for example. On a smaller monitor, the GUI is not useable on since some of the components are clipped off screen and not all components are visible.
The problem is, that there is no way to change this to a percentage based scaling and positioning based on the screen size. Is it possible to change the GUI and all its elements to the used screen size without changing every element and its position manually?

Best Answer

App designer utilizes UI Figures to create the figure window which contains all of the relevant components of your app. A normal MATLAB figure is able to specify its position in normalized Units, that is a percentage of the parent container for the figure, in this case the system screen resolution. Unfortunately, at this time UI Figures only support Units of pixels. Therefore, the figure is created with at a static location based on the values in the Position property specified by the user.
There are potentially two workarounds available to resize your app to the resolution of a new monitor for you to consider:
1) Change the screen resolution to be matching on both systems. The Position property of the UIFigure may need to be updated depending on if you make the larger screen have a lower resolution or the smaller screen to have a higher resolution. This workaround does not allow for much flexibility to the user's workflow but would be the simplest solution.
2) Add a startup function to your App which inspects that systems current resolution and adjusts the UIFigure position based on a percentage of that overall screen size. This workflow is in effect attempting to create our own version of normalized units. Instructions for how to add a startup function to your app can be found in the following link:
<https://www.mathworks.com/help/matlab/creating_guis/app-designer-startup-function.html#mw_692f91de-0866-4876-94a5-d956a19570f4>
Inside of that start up function, a workflow similar to the one below would need to be implemented
         function startupFcn(app)
              screenSize = get(groot,'ScreenSize');
              screenWidth = screenSize(3);
              screenHeight = screenSize(4);
              left = screenWidth*0.1;
              bottom = screenHeight*0.1;
              width = screenWidth*0.8;
              height = screenHeight*0.8;
              drawnow;
              app.UIFigure.Position = [left bottom width height]; 
          end
The percentages used in "left", "right", "bottom" and "height" would need to be adjusted to match the location and size of your GUI as the current numbers above were chosen arbitrarily. This could be calculated by finding the ratio of the screen the current GUI is occupying from the original UIFigure Position pixel values and the system resolution of which the GUI was created on.
Related Question