UMG设置组件自适应居中或靠边

Posted 2020-10-11 智慧 + 毅力 = 无所不能

转自：http://aigo.iteye.com/blog/2297430

比如你的UI中有些组件需要居中显示，有些需要始终在右上角并且与上边框和右边框保持固定的距离等等，对于这种需要动态适应屏幕分辨率的UI组件，有两种设置方式：

1，直接编辑组件的属性Anchors

 

2，代码控制

 

ULoginWidget* LoginUI = NULL;   //创建UI的逻辑省略  
  
if (UImage* backImg = Cast<UImage>(LoginUI->GetWidgetFromName("ImgBackground")))  
{  
    //获取屏幕大小和中心点  
    const FVector2D ViewportSize = FVector2D(GEngine->GameViewport->Viewport->GetSizeXY());  
    const FVector2D  ViewportCenter = FVector2D(ViewportSize.X / 2, ViewportSize.Y / 2);  
  
    //假设背景图片的大小原尺寸大小是1920x1080，下面是通过高宽比来计算当前分辨率下的位置  
    int imgWidget = 1920 * ViewportSize.Y / 1080;  
    int posX = ViewportCenter.X - imgWidget / 2;  
  
    //设置背景图片的相对X、Y坐标，注意：这里假设Anchors属性默认的，即X、Y相对屏幕左上方顶点位置  
    backImg->SetRenderTranslation(FVector2D(posX, 0));  
}  

如果需要居中的UI组件很多，可以将居中的UI放在一个容器里，然后只对这一个容器进行居中即可。

这里假设直接将RootWidget居中：

LoginUI->GetRootWidget()->SetRenderTranslation(FVector2D(X, Y));  

另外，通过代码设置比例，需要在代码中考虑当前设备的分辨率，如果不想考虑，将屏幕尺寸设成固定值：

这种比较麻烦，建议还是第一种