Can't position widget in center of screen. Slight error

[AlexM]

Hi

I can’t seem to completely center a widget to the screen in c++. It’s always close to the center but is offset a small amount that varies with the game resolution.

I’ve looked around all day on vairous answerhubs and forum threads and I think I’m generally doing the right thing but in PIE the widget is about 4-6 pixels off in the upper left direction and in standalone mode it’s even worse.

Here is my widget :

Here is how i position my widget in code

void ALunePlayerController::Tick(float DeltaSeconds)
{
	if (GEngine && ReticleWidget && GEngine->GetWorldFromContextObject(ReticleWidget) && GEngine->GameViewport)
	{
		FVector2D ViewportSize;
		GEngine->GameViewport->GetViewportSize(ViewportSize);
		const FVector2D ReticleSize(ReticleWidget->GetDesiredSize().X, ReticleWidget->GetDesiredSize().Y);

		const float CenterX = ViewportSize.X / 2;
		const float CenterY = ViewportSize.Y / 2;
		const float ReticleCenterX = ReticleSize.X / 2;
		const float ReticleCenterY = ReticleSize.Y / 2;

		GEngine->AddOnScreenDebugMessage(2, 1.0f, FColor::Blue, FString::Printf(TEXT("Viewport resolution X %f Y %f"), ViewportSize.X, ViewportSize.Y));
		GEngine->AddOnScreenDebugMessage(4, 1.0f, FColor::Blue, FString::Printf(TEXT("Reticle size X %f Y %f"), ReticleSize.X, ReticleSize.Y));
		GEngine->AddOnScreenDebugMessage(5, 1.0f, FColor::Blue, FString::Printf(TEXT("Final val for SetPositionInViewport X %f Y %f"), CenterX - ReticleCenterX, CenterY - ReticleCenterY));

		ReticleWidget->SetPositionInViewport(FVector2D(CenterX - ReticleCenterX, CenterY - ReticleCenterY));
		FinalX = CenterX;
				FinalY = CenterY;
	}
	TurnRateY = 0.0f;
	TurnRateZ = 0.0f;
}

Here is the bad results (PIE)

Here are worse results in the standalone version

Finally here I used an image editing program to find the center of the screen so you can see how the widget is not getting centered correctly.

[Insanto]

Here’s a umg based cheat: put the reticle in the center row/col of a 3x3 grid and anchor that grid from 0,0 to 1,1

[AlexM]

Haha nice. Thanks for the tip. I’ll have to write that down in my list of “weird UMG hacks”

[Nachtmahr]

Hey AlexM I think you forgot to include DPI Scaling in your Calculations. In your first Picture in the bottom right Corner of the Desgin View you can See “DPI Scale 1.32” that means your “real” rectangle size is actually smaller or bigger depending on the Screen Resolution. And what I can tell from your Log GetDesiredSize() always returns you the Size it wants to be but not the Size it is (DPI Scaled).

The little Hack Insanto Mentioned will do the Trick I just told you the “missing” Puzzle piece in your Calculation in case you want to stick with your Code or you hit a Calculation Problem that has the same root Problem again.

Have Fun =) Im sure you can figure out the Math.

[AlexM]

Hi Nachtmahr thanks for the info!

I do suspect that canvas vs viewport resolution issues are the issue. I did however notice that SetPositionInViewport has a parameter for setting it with DPI scaling and without. Neither version resulted in correct behavior but the version with DPI scaling did do a lot better.

My current mental logic is that if GetDesiredSize() returns non-scaled values that’s good because SetPositionInViewport performs DPI scaling unless told not to.

What I would typically do in other engines that have this concept is I would have a canvas size and a viewport size and I would divide the two to find the ratio I need to scale the images position by. Unfortunately I can’t seem to find any structure that will give me canvas resolution values.

Am I still missing something? If you look at my debug text in the screenshots the position I’m passing in is exactly what I want but the results are odd (with and without the dpi scaling bool set to true).

I think I’ll have to spin up a new project and spend some more time looking at this problem (I’m using a different method now but I just have to know what I did wrong ).

Thanks for your guidance. The DPI scale in the design view I didn’t notice. You might have indeed given me the missing piece of the puzzle to solve this problem

Thanks!

[Nachtmahr]

I´m not sure whats missing I would have to create a Dummy Project and run some numbers but yeah well… uhm… ya know Time

I did something similar in a BP Project and I remember DPI Scaling solved my math but it was a Prototype I already deleted it. Otherwise I would grab you a screenshot =(

Could it be a Parent Widget? Canvas Panel maybe? If I remeber corectly UE4 creates a default Canvas if you add a Widget without a Canvas. Widget Reflector works ingame too maybe you can spot something odd there. Worth a Shot.

[AlexM]

No worries you’ve already been very helpful . I can do some tests and see what was going on.

I am directly adding a widget so maybe that does have something to do with it. I’ll try to see if I can track down the reason why this is happening and post back.

Thanks!

[arekku255]

Set up the widget as follows:

Parent it to your main widget

Anchor it to 0.5 0.5

Set Alignment to 0.5 0.5

Set position to 0 0

Anchor 0.5 0.5 will make the center of the coordinate system the center of the screen.
Alignment to 0.5 0.5 will make the center of the widget the center of itself, therefore positioning the widget center of the widget in the center of the screen.

Position 0 0 will then translate it by nothing, leaving your widget in the center of the screen.