将UI RectTransform移动到世界位置

问题描述

我有一个名为 Player 的GameObject和一个Canvas. HealthBar 游戏对象是Canvas (Canvas> HealthBar)的子代.我在播放器后面有一个带有脚本的HP栏.它应该跟随玩家位于其上方的固定位置，因此它位于精灵顶部附近.这是HP Follow Script的关注"部分.

I have a GameObject named Player, and a Canvas. The HealthBar GameObject is a child of the Canvas (Canvas>HealthBar). I have the HP bar following the player with a script. It is supposed to follow the player at a fixed position above it, so it sits near the top of the sprite.Here is the 'follow' part of the HP Follow Script.

        void Update ()
{
    Vector3 currentPos = transform.position;
    Vector3 playerPos = Camera.main.WorldToViewportPoint (Player.transform.position);
    transform.position = playerPos;

问题是HP条随角色移动，但移动速度却很小.例如，如果玩家移动一个单位，则小节移动0.1个单位.

The problem is that the HP bar moves with the character, but at a very small fraction of the speed of which the player is moving. For example, if the player moves one unit, the bar moves 0.1 units.

错误视频: https://streamable.com/vaz7h

推荐答案

要使UI Object(Image)跟随GameObject是SpriteRenderer或MeshRenderer.

You want to make a UI Object(Image) follow a GameObject is a SpriteRenderer or MeshRenderer.

以另一种方式，这可以描述为将世界点转换为UI点.

In another way, this can be described as converting world point to UI point.

下面的这个简单函数将世界位置转换为UI空间.它以UI的Canvas作为参数，然后是要转换为UI位置的位置，在本例中为Player.transform.position变量.

This simple function below converts world position to UI space. It takes a the Canvas of the UI as parameter then the position you want to convert to UI position which in your case is the Player.transform.position variable.

移动UI对象的关键是 RectTransformUtility.ScreenPointToLocalPointInRectangle 函数将屏幕点转换为ui矩形局部点.

The key for moving a UI object is the RectTransformUtility.ScreenPointToLocalPointInRectangle function which converts the screen point to ui rectangle local point.

public Vector3 worldToUISpace(Canvas parentCanvas, Vector3 worldPos)
{
    //Convert the world for screen point so that it can be used with ScreenPointToLocalPointInRectangle function
    Vector3 screenPos = Camera.main.WorldToScreenPoint(worldPos);
    Vector2 movePos;

    //Convert the screenpoint to ui rectangle local point
    RectTransformUtility.ScreenPointToLocalPointInRectangle(parentCanvas.transform as RectTransform, screenPos, parentCanvas.worldCamera, out movePos);
    //Convert the local point to world point
    return parentCanvas.transform.TransformPoint(movePos);
}

用法:

public GameObject Player;
public Canvas canvas;
void Update()
{
    //Convert the player's position to the UI space then apply the offset
    transform.position = worldToUISpace(canvas, Player.transform.position);
}

---

现在，假设您已经将UI定位在应该的位置，现在您希望它跟随另一个Object(Player)，您需要使用上面的代码实现一个简单的偏移量.这真的很容易.下面是它的外观:

---

Now, let's say that you have already positioned the UI to be where it is supposed to be and you now want it to follow another Object(Player), you need to implement a simple offset with the code above. This is really easy. Below is what it is supposed to look like:

public GameObject Player;
public Canvas canvas;


Vector3 Offset = Vector3.zero;

void Start()
{
    Offset = transform.position - worldToUISpace(canvas, Player.transform.position);
}

void Update()
{
    //Convert the player's position to the UI space then apply the offset
    transform.position = worldToUISpace(canvas, Player.transform.position) + Offset;
}

public Vector3 worldToUISpace(Canvas parentCanvas, Vector3 worldPos)
{
    //Convert the world for screen point so that it can be used with ScreenPointToLocalPointInRectangle function
    Vector3 screenPos = Camera.main.WorldToScreenPoint(worldPos);
    Vector2 movePos;

    //Convert the screenpoint to ui rectangle local point
    RectTransformUtility.ScreenPointToLocalPointInRectangle(parentCanvas.transform as RectTransform, screenPos, parentCanvas.worldCamera, out movePos);
    //Convert the local point to world point
    return parentCanvas.transform.TransformPoint(movePos);
}

这篇关于将UI RectTransform移动到世界位置的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！