No image for buttons shows in Build

[D-007]

Hi, I am having problems with my UI. For some reason the image component part of buttons is not showing when the game is built (the text shows). It shows fine in the editor, but when i build out the game no background image of the buttons is showing, and i cant figure out why. Does anyone possibly have an idea. Ive tried changing the aspect ratio, changed out the type of canvas renderer mode, added more buttons and ui images, but yet nothing shows. Any help would be appreciated

Last image is from the build

[Kurt-Dekker]

First guess is anchoring / scaling.

Here are the official docs on how to make your UI handle various resolutions and aspect ratios cleanly:

Unity - Manual: Designing UI for Multiple Resolutions

Here are some notes on UI Anchoring, Scaling, CanvasScaler, etc:

Inconsistent game object placement/size between two people

It can be very fiddly but it is super-powerful once you reach comfort with the UI. Building upon Praetor’s great post above, let me suggest this approach: make a quick first draft of your UI. in the Unity game window change the shape / dimensions of your Game window (you can even make your own resolutions) see what happens to your UI in this new shape window iterate and fix your anchors and scalings and whatnot Make sure you do not overlook the Canvas Scaler settings. Personally I (almost) …

SOLVED: Game UI Button Size problem

That seems excessive… What is the text of the actual complaint from them? Make something like this with a fixed aspect ratio (in this case 2:1, maybe you need 3:1 or whatever suits your buttons), and ALL your buttons anchored inside it to never move within that box: [7337383--891847--fixed_aspect_ratio_box.png] then anchor that fixed against the bottom center (red dot below). On the ipad it looks like: [7337383--891850--ipad.png] on the iPhone it looks like: [7337383--891853--iphonex.pn…

Usually you need to choose a suitable ScaleMode and MatchMode in the Canvas Scaler and stick with it 100%. Generally if you change those settings you will often need to redo your UI entirely.

Here’s some more fit-inside-UI-content notes:

https://docs.unity3d.com/Packages/com.unity.ugui@1.0/manual/HOWTO-UIFitContentSize.html

I also use this CanvasScalerOrientationDriver utility to make sharing UI for Landscape / Portrait easier. Read what it does carefully.

https://gist.github.com/kurtdekker/8802b1b6c708637398f8c9167641efd3

[D-007]

I have set the anchoring up a way that it should always show on screen. For testing I even just made a massive button and anchored to the middle of the screen. and still only the text has shown. I think though, it might have something to do with what is being used as the image part of the button, I have a sprite that is set to 2d and UI, and that shows fine as the button, but another sprite (2d and UI) that i have doesnt show as the button. So I am more confused now at what the issue might be.

[Kurt-Dekker]

@D-007

anchored to the middle of the screen.

Anchoring is more than just position. It also indicates stretch. Read the above links.

@D-007

So I am more confused now at what the issue might be.

Start debugging! As already linked above, get the runtime resolution, set it up in editor, see what it looks like.

[D-007]

Well I got it to work but dont think its the correct solution, seems very strange. I need to set the imported image i am using, that is set to sprite (2d ui) to have read/write enabled.

I dont know if this points to a bigger issue in my project, as when i tried to build yesterday none of my materials on the objects were shown, and they had to be set to read/write, however i thought because they were using custom shaders that was the cause. But the button is using just a simple image that i imported, so not being effected by any of my shaders etc.