问题
I'd like to attach a logo or change the whole background of an App Designer uifigure
. How can this be done?
回答1:
If you want to set a solid background color for the entire figure, there exists a documented way to do this, e.g.:
% When creating a new uifigure: fig = uifigure('Color',[R G B]) % if the uifigure already exists: fig.Color = [R G B];
- If you want to change the background color of just some region, you can add a
uipanel
with no title or border (uipanel(...,'BorderType','none','Title','','BackgroundColor',[R G B])
). If you want to set an image as background of the entire figure:
function q41602238a %% Turn off some warnings: warning off Matlab:structOnObject warning off Matlab:HandleGraphics:ObsoletedProperty:JavaFrame %% 0. Create a uifigure: app = uifigure(); %% 1. Get a handle to the webwindow: while true try win = struct(struct(app).Controller).Container.CEF; break catch pause(0.1); % Give the figure (webpage) some more time to load end end %% 2. Find the data_tag of the DOM element we want to edit: data_tag = char(struct(app).Controller.ProxyView.PeerNode.getId); %% 3. Manipulate the DOM via a JS command while true try win.executeJS(['dojo.style(dojo.query("[data-tag^=''' data_tag ''']")[0],"background-image","url(https://upload.wikimedia.org/wikipedia/commons/8/80/Wikipedia-logo-v2.svg")']); break catch pause(0.1); % Maybe JS is still not ready. end end
Result:
If you want to set an image as background of just some region:
function q41602238b %% Turn off some warnings: warning off Matlab:structOnObject warning off Matlab:HandleGraphics:ObsoletedProperty:JavaFrame %% 0. Create a some element: app = uifigure(); pnl = uipanel(app); %% 1. Get a handle to the webwindow: while true try win = struct(struct(app).Controller).Container.CEF; % disp(win.URL); break catch pause(0.1); % Give the figure (webpage) some more time to load end end %% 2. Find the id of the DOM element we want to edit: data_tag = char(struct(pnl).Controller.ProxyView.PeerNode.getId); widgetId = win.executeJS(['dojo.getAttr(dojo.query("[data-tag^=''' data_tag ''']")[0],"widgetid")']); %% 3. Manipulate the DOM via a JS command dojo_style_prefix = ['dojo.style(dojo.query("#' widgetId(2:end-1) '")[0],']; while true try win.executeJS([dojo_style_prefix '"background-image","url(https://upload.wikimedia.org/wikipedia/commons/8/80/Wikipedia-logo-v2.svg")']); break catch pause(0.1); % Maybe JS is still not ready. end end
Result:
Notes:
The last two examples are based on these two posts: 1, 2, and the principle of operation is adding a
background-image: "..."
entry to thestyle
property of some desired UI element (which happens to be an HTMLdiv
).A tool for programmatic manipulation of App Designer figures can be found in this GitHub repository.
The example image happens to be an
.svg
, which is interesting, because we can export "regular" MATLAB figures in this format, and later use them as backgrounds for auifigure
:)
回答2:
Unfortunately I can't comment yet, so here is another answer.
Starting at Matlab 2017a the Controller does not have a Container property anymore. This works:
warning off Matlab:structOnObject
warning off Matlab:HandleGraphics:ObsoletedProperty:JavaFrame
win = struct(struct(struct(app).Controller).PlatformHost).CEF;
data_tag = char(struct(app).Controller.ProxyView.PeerNode.getId);
win.executeJS(['dojo.style(dojo.query("[data-tag^=''' data_tag ''']")[0],"background-image","url(https://upload.wikimedia.org/wikipedia/commons/8/80/Wikipedia-logo-v2.svg")']);
There is also the possibility to find all active webwindows using
webWindows = matlab.internal.webwindowmanager.instance.findAllWebwindows();
unfortunately I did not find out yet, which window belongs to which UIFigure (you could use the Title or Position to filter, but two identical UIFigures will cause problems).
Disclaimer, Davide Miani posted that information here: https://undocumentedmatlab.com/blog/customizing-uifigures-part-1#comment-406524
来源:https://stackoverflow.com/questions/41602238/how-to-customize-the-background-of-an-app-designer-figure