Apps created with app designer are not displaying components positioned correctly

57 次查看(过去 30 天)
I replied with this issue to a Mathworks support comment on this thread:
But did not get a reply. I will briefly describe the issue here, but that post has some information also. I have been using app designer since its inception and before that had been hand coding GUIs. I have never had a problem porting apps or GUIs from one machine to another until now.
I wrte apps for classes I teach as well as in consulting work and have for past several years been writing apps on these two machines currently with MATLAB 2024b, although I have been installing new releases as they came out for years, with no troubles
  1. Dell Precision 5680 laptop running Windows 11. The app appears equally well when displayed on a connected DellUZ2715H 1920x1080 external monitor and when that monitor is disconnected and the display is the laptop display itself (1920x1200).
  2. Dell Precision Tower 5810 runing Windows 10 and a Samsung S34CG50 wide screen monitor (3440x1440).
I have been running the apps on these machines as well as in MATLAB online and some Windows PCs the university owns for which we have a site MATLAB license, but I don't right now have the specs of those machines, but they are economical machines.
This week I wanted to move my online presentation activities to another location in my home and use a machine that is there:
Dell Micro Tower Optiplex Small Form Factor Plus 7010, running Windows 11 with a Dell UZ2315H 1920x1080 monitor on which I have installed MATLAB 2024b, with all of the recommended display settings.
The genesis of the problem, with some screen shots of the simple projectile app I was trying to use, etc can be found in the linked thread. I also wound up with a workaround there in which I experimentally deliberately mis-positioned components so that they will after the app opens be repositioned so that it looks roughly like it should. Here I show what I did to display the problem. I opened up App Designer and created a dummy app by simply dragging two axes components from the component library and also dragging 8 buttons on the figure. I did nothing else. No code no boxes checked etc. Here is a screenshot of what that looked like.
Then I clicked the green "run" diamond button in the Designer tab and the app executed and created components to look like this:
\
This shows the opened app backlit by my screen background. The positions of the components have been shifted from original , with several being outside the figure. I tried one of the suggestions in the other thread, checking the "Scrollable" box under interactivity for the UIFigure and this is the result of that
In none of these cases does resizing the figures improve the component locations. In the other thread I reported that I also tried the suggested code in the startup function and that did not fix the problem either. In the apps I was trying to run, if the execute button showed and I could click it, the numerical, plotting, and table entry parts of the codes work and for the components visible disply on the app. I would very much appreciate some advice on this. As it is now this machine (and hence the new location) is unusable if I want to show apps during presentations, which I do routinely. I have never seen this problem before, peculiar to what is otherwise a relatively standard configuration computer.
  1 个评论
Frank
Frank 2025-7-4
移动:Walter Roberson 2025-7-4
Update July 4.
I ran an identical dummy app on both the Small Form Factor (SFF) machine and the Precision Tower (PT). The dummy app is the same one I displayed above, it had two axes and 8 buttons arrayed around the UIFigure. The only change I made from the version displayed above was to put in a startup function that output the positions of all the components into a .mat file. Just for completeness, I will post the dummy app text at the end of this description. I wrote the postions into an excel file for display. Here is the result of running in on the two machines.
Positions and display on execution on the Precision Tower (the display matches the appearance in app designer)
Postions and display after app execution on the SFF machine (the display does not match the appearance in the app designer):
The positions of all of the app components and the UIFigure are identical in both cases, but on the SFF the display is distorted. I would very much appreciate any idea why this could be happening and what I can do to fix it. As it is, this rather generic pc is useless for MATAB apps.
Here is the text of the dummy app for reference, apologizing for the space taken but I want to be absolutley clear.
classdef app1 < matlab.apps.AppBase
% Properties that correspond to app components
properties (Access = public)
UIFigure matlab.ui.Figure
Button8 matlab.ui.control.Button
Button7 matlab.ui.control.Button
Button6 matlab.ui.control.Button
Button5 matlab.ui.control.Button
Button4 matlab.ui.control.Button
Button3 matlab.ui.control.Button
Button2 matlab.ui.control.Button
Button matlab.ui.control.Button
UIAxes2 matlab.ui.control.UIAxes
UIAxes matlab.ui.control.UIAxes
end
% Callbacks that handle component events
methods (Access = private)
% Code that executes after component creation
function StartUp(app)
uipos = app.UIFigure.Position ;
axespos = app.UIAxes.Position;
axespos2 = app.UIAxes2.Position;
butpos = app.Button.Position;
butpos2 = app.Button2.Position;
butpos3 = app.Button3.Position;
butpos4 = app.Button4.Position;
butpos5 = app.Button5.Position;
butpos6 = app.Button6.Position;
butpos7 = app.Button7.Position;
butpos8 = app.Button8.Position;
save("app1.mat","butpos8","butpos7","butpos6","butpos5","butpos4","butpos3","butpos2",...
"butpos","uipos","axespos","axespos2");
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 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 = [116 211 300 185];
% Create UIAxes2
app.UIAxes2 = uiaxes(app.UIFigure);
title(app.UIAxes2, 'Title')
xlabel(app.UIAxes2, 'X')
ylabel(app.UIAxes2, 'Y')
zlabel(app.UIAxes2, 'Z')
app.UIAxes2.Position = [116 14 300 185];
% Create Button
app.Button = uibutton(app.UIFigure, 'push');
app.Button.Position = [433 31 100 22];
% Create Button2
app.Button2 = uibutton(app.UIFigure, 'push');
app.Button2.Position = [30 31 100 22];
app.Button2.Text = 'Button2';
% Create Button3
app.Button3 = uibutton(app.UIFigure, 'push');
app.Button3.Position = [17 161 100 22];
app.Button3.Text = 'Button3';
% Create Button4
app.Button4 = uibutton(app.UIFigure, 'push');
app.Button4.Position = [17 293 100 22];
app.Button4.Text = 'Button4';
% Create Button5
app.Button5 = uibutton(app.UIFigure, 'push');
app.Button5.Position = [17 416 100 22];
app.Button5.Text = 'Button5';
% Create Button6
app.Button6 = uibutton(app.UIFigure, 'push');
app.Button6.Position = [433 141 100 22];
app.Button6.Text = 'Button6';
% Create Button7
app.Button7 = uibutton(app.UIFigure, 'push');
app.Button7.Position = [433 273 100 22];
app.Button7.Text = 'Button7';
% Create Button8
app.Button8 = uibutton(app.UIFigure, 'push');
app.Button8.Position = [415 416 100 22];
app.Button8.Text = 'Button8';
% 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 = app1
% Create UIFigure and components
createComponents(app)
% Register the app with App Designer
registerApp(app, app.UIFigure)
% Execute the startup function
runStartupFcn(app, @StartUp)
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

请先登录,再进行评论。

采纳的回答

Image Analyst
Image Analyst 2025-7-4
Yes, what you say is very true. I've spent hours with tech support to find some solution to the App Designer layout nightmare. Tech support says that the layouts are heuristically determined at runtime so that if you do any resizing, such as setting the WindowState of the figure to be maximized (which doesn't always work but the workaround is to maximize it programmatically in the startup function), then it tries to decide how to size and position the controls on your GUI. And it usually gets it wrong. Not only wrong, but inconsistently wrong. If I simply run the same program twice in a row, it can give drastically different sizes and positions of controls, and some controls are even off the edge of the GUI or overlapping each other. A real nightmare.
I've let the App Designer managers know of this layout problem, and of 25 other problems there are with App Designer. The other problems range from annoying to fatal crashes but this layout problem is one of the worst. I don't know why they can't just follow the way Microsoft does it in VIsual Studio with their docking, anchoring, and alignment features - those seem to work well. But now we're stuck with AppDesigner for GUI layout if you want to use R2025a or later, since they don't let you edit GUIDE apps anymore.
The first thing I tried was to make the gui the exact size of my screen by typing in the width and height into the Position property of the main GUI. Then I unchecked the checkbox that says "Resize children". Then set the WindowState property to "normal". Sad to say, it didn't work.
The best workaround tech support could give me is to apply a grid layout. Go to the "Containers" section of the Component Library and drop a grid layout onto your main GUI figure. It basically snaps all your components to an invisible (at runtime, not design time) grid. It makes your design time view ugly and cluttered but it seems to consistently put most (not all) controls where you'd expect them to be at runtime. (I still have an interior text box inside a panel that is positioned so that the top of the edit box is cut off by the top of the panel.)
You should call tech support and complain about this so they know how important it is to get it right.
  3 个评论
Image Analyst
Image Analyst 2025-7-5
Even weirder than machine dependence is that the layout is not even consistent from one run to the next on the very same machine. (And my computer is only 6 months old.)
Frank
Frank 2025-7-5
I plan to submit this sometime later today or tomorrow. In the meantime I did eliminate one element. I replaced the monitor on the SFF pc that is giving me trouble with a monitor from one of the other systems that works fine. I also configured the monitor connection to the SFF pc exactly like the connection on the other system, namely from data port to HDMI, instead of data port to data port as it had been on the SFF. The only component that is now different from the systems that work is the pc itself, and it is running the same verision of Windows 11 as one of the ones that work. The result is the same bad result as I had with the SFF in its orginial configuration. All systems including the SFF are updated to current in firmware, drivers and software and show no hardware issues from diagnostics. I am not sure if this is technically a Heisenberg bug or a bad girlfriend bug, but it is definitely a pain.

请先登录,再进行评论。

更多回答(1 个)

Maddie
Maddie 2025-8-19,21:15
Hi @Frank,
Sorry for catching this so late, I just shared a response on this thread that might match the same issue here. The tl;dr is, this is likely due to a known issue (see the bug report here) where app components do not appear in the right position, due to the Accessibility Text size setting.
To confirm if this is the same issue you're experiencing, you can check that in your computer system settings. There are still options for increased text size that will avoid this unintended behavior, detailed on the bug report. Again, sorry for not sharing this sooner. I hope this answers your question.
  1 个评论
Frank
Frank 2025-8-19,22:54
Maddie, Thank you!!!! I had actually given up on moving my online presentations to the nicer location (from where it is now in my lab/workshop area), but I just checked the simple workaround and it does indeed work around the problem. After the minor setting change, I checked a handful of the apps I use and they all had no appearance issues. Just in time too, my classes are about to start up for the fall term. Thanks so much for thinking to look for other sufferers. Mathworks is still the best...because the best people work with it and for it.

请先登录,再进行评论。

类别

Help CenterFile Exchange 中查找有关 Develop Apps Using App Designer 的更多信息

产品


版本

R2024b

Community Treasure Hunt

Find the treasures in MATLAB Central and discover how the community can help you!

Start Hunting!

Translated by