Hi. Sorry for the delay!
Everything is working as designed. However, it is not obvious why the design is so complicated. Let me explain.
Slate does everything in Slate Units
or su
instead of pixels. The reason for this is that display density varies, and you want to be able to write a UI once and have it work on many different display densities. Unreal will automatically change the ration of su
to pixels as you change your resolution. This should produce the appearance of the UI getting bigger or smaller along with the 3D scene (as opposed to your UI reflowing kind of like a webpage does). Both UI scaling and reflowing can be desireable though.
So, if you want to arrange elements on the screen there are many different ways of doing that. You could use layout panels (e.g. like horizontal and vertical panels) to accomplish what you want. You don’t even need to know the resolution of the game; Slate will figure it out for you. You could just do something like:
ChildSlot
.VAlign(VAlign_Fill)
.HAlign(HAlign_Fill)
[
SNew(SOverlay)
+SOverlay::Slot()
.VAlign(VAlign_Bottom)
.HAlign(HAlign_Fill)
[
SNew(SColorBlock)
.Color(FColor(0, 0, 0, 100))
.Size(FVector2D(100, 20)) // width =100, height = 20
// Note that `width` will be ignored because the parent overlay is going
// to `HAlign_Fill` all the available space with the Block inside this slot.
// The `height` will be respected. You don't need to multiply by resolution because
// this size is in `su` and will be scaled with resolution automatically.
]
];
BTW, please take a look at this doc about DPI scaling in UE4: