MATLAB: Uicontrols do not resize with figure window in the app

MATLABnormalizedpixelsrescaleresizeuicontroluifigureunits

I have an app with a pushbutton contained in a uipanel. When I run the app then resize the figure window, the panels do not change size. How do I get my panels to auto-scale as expected?

The reason I am resizing the window is because I have users with different screen sizes and screen resolutions. Thus, the app appears too large on some machines and too small on others, and thus needs to be resized.

Best Answer

A UIPanel or TabGroup will only resize if the components within that panel or tab group resize and thus force the panel or tab group to expand. For example, if you place an Axes inside a UIPanel, the axes will re-scale as the figure window is expanded, so the panel will expand too. However, if you place only a pushbutton inside the panel, no resizing will occur, since uicontrols do not automatically resize. Thus, the real issue here is that your uicontrols are not resizing.

To make your panels with uicontrols scale better, try the following:

1) Change the position "units" of each uicontrol to "normalized". For example,

f = uifigure;

pb = uicontrol('Style','pushbutton','String','Push Me');

pb.Units = "normalized";

A pushbutton will now scale properly when shrinking/expanding the figure window.

2) Simply make the figure larger in the Design View of App Designer by clicking and dragging on the lower right corner of the window canvas. Then resize the rest of the components appropriately (before running the app).

3) Make the figure appear the same relative size across computer screens with different resolution / dimensions. In a normal figures, this can be achieved with "normalized" units. However, a uifigure is currently limited to units of "pixels", which means that the figure window will have a different relative size on, say, a large 4k monitor than a small laptop. To imitate the behavior of "normalized" units, follow the method outlined in the MATLAB Answers post below:

https://www.mathworks.com/matlabcentral/answers/395508-why-does-the-app-not-resize-properly-for-different-screen-resolutions-in-app-designer

If the figure window has the same relative size across different machines, there should be little need to resize the window in the first place.

Related Solutions

MATLAB: Does overlapping panels in GUIDE seem to lock their ‘visible’ property in MATLAB 7.9 (R2009b)

GUIDE will make any UI component, which is positioned within or over a panel, a child of that panel. This includes other panels.

Thus, the above behavior is expected because, when a panel's visibility is set to 'off', any components that are a child of that panel should also not be visible.

The solution is to make sure that your panels are all direct children of the figure window, rather than nested within each other. You can do this with additional code in the Opening Function. For example, you could add similar code to this:

% Ensure uipanels are parented by the figure
panel_handles = findobj(handles.figure1,'type','uipanel')
set( panel_handles, 'parent', handles.figure1)

MATLAB: Are some components missing or partially obscured in the apps in MATLAB R2014b

Axes, uicontrols or uitables might appear to be missing in the new graphics system because they are obscured by other components.

In R2014a and earlier, the order of components listed in the Children property matches the order in which they are created. However, this order does not necessarily match the front-to-back positioning (or the stacking order) of the components on the screen.

In R2014a and earlier, uicontrols always display on top of uipanels and uibuttongroups. Previous releases also allow an axes to display on top of a uipanel without being a child of the uipanel.

Starting in R2014b, the order of components listed in the Children property matches the stacking order of child components on the screen. You might need to update your code if your GUI contains a uipanel or uibuttongroup:

Relative positioning is not sufficient to display an axes, uicontrol, or uitable on top of a uipanel or uibuttongroup. To place a component on top of another, set its Parent property to be the component you want to appear beneath it.
Uipanels and uibuttongroups have the same stacking order behavior on the screen as uicontrols and uitables.

The new behavior reflects changes to MATLAB® that provide more consistent behavior.

This code creates a figure with a top panel containing an axes and a bottom panel containing a push button and pop-up menu.

hf = figure;
hb = uicontrol('Style','PushButton',...
               'String','Plot',...
               'Position',[175, 40, 60, 25]);
hpulabel = uicontrol('Style','text',...
                     'String', 'Plot Type',...
                     'Position', [300, 65, 60, 20]);
hpu = uicontrol('Style', 'popupmenu',...
                'String', {'bar', 'plot', 'stem'},...
                'Position',[310, 40, 60, 25]);
topp = uipanel('Title', 'Plot',...
               'Position',[0 .25 1 .75]);
ah = axes('Position', [.10, .35 .80 .60]);
bottomp = uipanel('Title','Plotting Options',...
                  'Position',[0 0 1 .25]);

Running the code in R2014a and earlier produces the figure on the left. However, running this function in the new graphics system produces the figure on the right.

To ensure there are no components hidden behind containers, set the Parent property of each component to make it a child of the container. For example, the following code restores the appearance of the original GUI.

hf = figure;
topph = uipanel('Parent', hf,'Title', 'Plot',...
                'Position',[0 .25 1 .75]);
axes('Parent', topph, 'Position', [.10, .35 .80 .60]);
bottomph = uipanel('Parent', hf,'Title','Plotting Options',...
                   'Position',[0 0 1 .25])
hpulabel = uicontrol('Parent', bottomph, 'Style','text',...
                     'String', 'Plot Type',...
                     'Position', [300, 65, 60, 20]);
hb = uicontrol('Parent', bottomph, 'Style','PushButton',...
               'String','Plot',...
               'Position',[175, 40, 60, 25]);
hpu = uicontrol('Parent', bottomph, 'Style', 'popupmenu',...
                'String', {'bar', 'plot', 'stem'},...
                'Position',[310, 40, 60, 25]);
<<http://www.mathworks.com/matlabcentral/answers/uploaded_files/54903/0f1d474b8f509e31c9f43c5a798f86b1.png>>

Restoring the layout of a GUIDE GUI requires two separate steps:

Fix the layout in GUIDE.
Fix the child order of the components.

To fix the layout in GUIDE, open the fig-file in GUIDE and use the Send to back option to rearrange the stacking. For example, to move the panel in this GUI behind all other components, right-click the panel and select Send to back.

To fix the child order of the components, so that the GUI displays them as they appear in GUIDE, select View > Object Browser. Then, select a component and move it slightly within the panel or button group. For example, selecting and moving this Start button slightly while it is on the panel makes it a child of the panel.

Child components display on top of their parent, so this Start button displays on top of the panel when the GUI runs.

Best Answer

Related Solutions

MATLAB: Does overlapping panels in GUIDE seem to lock their ‘visible’ property in MATLAB 7.9 (R2009b)

MATLAB: Are some components missing or partially obscured in the apps in MATLAB R2014b

Related Question