【Unity】实现小地图

目录

一、前言

小地图功能在很多游戏中都有,特别是RPG游戏,这篇文章介绍小地图的功能实现。

二、思路

专门创建一个顶视角的摄像机,然后摄像机有个Target Texture属性,可以将渲染的图形输出到Render Texture中,我们使用UGUI的Raw Image来显示这张Render Texture即可。

三、具体步骤

1、创建一个顶视角摄像机Camera

在需要显示小地图的场景中 创建一个Camera,保留原有的主摄像机 Main Camera

2、创建Render Texture

创建Render Texture

3、Render Texture赋值给顶视角摄像机的Target Texture

4、使用Raw Image显示

在Canvas中 创建一个RawImage

5、将RenderTexture赋值给RawImage的Texture属性

四、运行效果

运行Unity效果如下

参考文档:教你3个步骤实现Unity小地图(知识点:RenderTexture、Mask、shader)

五、进阶

1、功能需求:在已知场景大小的条件下,通过调整 小地图Camera位置 和 orthographicSize值 使得场景居中显示在RawImage中。同时,使用ui图片Image代替 某个物体(如玩家) 显示在RawImage上,随着物体的移动,ui图片在RawImage上按照一定的比例移动。

注:小地图Camera位置 和 orthographicSize值 在初始化时调整,只调整一次,小地图Camera不随着玩家移动而移动。

csharp 复制代码
using UnityEngine;
using UnityEngine.UI;

public class MiniMapController : MonoBehaviour
{
    [Header("小地图设置")]
    public Camera miniMapCamera;// 小地图专用摄像机
    public RawImage miniMapRawImage;// 显示小地图的RawImage
    public RectTransform miniMapRect;
    public RectTransform playerIcon;// 代表玩家的UI图片
    public Transform playerTransform;// 实际玩家物体

    [Header("显示设置")]
    [Range(0.1f, 1f)] public float padding = 0.95f; // 边距比例

    Vector2 sceneSize = new Vector2(100,100);// 2D场景大小

    private void Start()
    {
        miniMapRect = miniMapRawImage.GetComponent<RectTransform>();

        // 确保小地图摄像机是正交投影
        miniMapCamera.orthographic = true;

        // 计算摄像机高度(确保完整看到场景)
        float aspectRatio = miniMapRect.rect.width / miniMapRect.rect.height;
        float sceneRatio = sceneSize.x / sceneSize.y;

        // 根据宽高比调整正交大小
        if (aspectRatio > sceneRatio)
        {
            // 以高度为准
            miniMapCamera.orthographicSize = (sceneSize.y / 2) / padding;
        }
        else
        {
            // 以宽度为准
            miniMapCamera.orthographicSize = (sceneSize.x / aspectRatio / 2) / padding;
        }

        // 设置摄像机位置(在场景正上方)
        miniMapCamera.transform.position = new Vector3(sceneSize.x / 2,sceneSize.y / 2,miniMapCamera.transform.position.z);
    }

    private void Update()
    {
        if (playerTransform == null || playerIcon == null) return;

        // 将玩家的世界坐标转换为小地图摄像机的视口坐标 (0-1范围)
        Vector3 viewportPos = miniMapCamera.WorldToViewportPoint(playerTransform.position);

        // 将视口坐标转换为UI坐标
        Vector2 uiPos = new Vector2(
            viewportPos.x * miniMapRect.rect.width - miniMapRect.rect.width / 2,
            viewportPos.y * miniMapRect.rect.height - miniMapRect.rect.height / 2);

        // 设置玩家图标位置
        playerIcon.anchoredPosition = uiPos;
    }


}

2、功能需求:小地图Camera跟随玩家移动

csharp 复制代码
using UnityEngine;

/// <summary>
/// 小地图摄像机跟随
/// Auhor: linxinfa
/// </summary>
public class MiniMapCameraFollow : MonoBehaviour
{
    public Transform playerTransform;

    /// <summary>
    /// 高度
    /// </summary>
    public float distanceUp = 1.3f;

    private Transform miniMapCameraTransform;

    void Awake()
    {
        miniMapCameraTransform = transform;
    }

    void LateUpdate()
    {
        if (playerTransform == null) return;

        miniMapCameraTransform.position = playerTransform.position + Vector3.up * distanceUp; 
    }
}
相关推荐
丁小未17 小时前
基于MVVM框架的XUUI 扩展的UI管理系统教程
unity·mvvm·ui框架·xuui·ui管理器
丁小未1 天前
基于MVVM框架的XUUI HelloWorld 新手教程
unity·性能优化·c#·游戏引擎
丁小未1 天前
基于MVVM框架的XUUI MoreComplex案例
unity·c#
EQ-雪梨蛋花汤1 天前
【Unity笔记】VR 一体机画面锯齿、模型边缘闪烁、接缝抖动排查:MSAA、Mipmap、Render Scale、Z-Fighting 全流程记录
笔记·unity·vr
松树戈2 天前
【Godot4精进之路】03~Godot编辑器常用界面介绍
编辑器·游戏引擎·godot
YigAin2 天前
Unity Spine 资源出现白边的解决办法
unity·游戏引擎·spine
郝学胜-神的一滴2 天前
中级OpenGL教程 013:渲染器类架构设计与逐帧渲染流程详解
开发语言·c++·unity·游戏引擎·图形渲染·opengl·unreal
_helen_5203 天前
unreal engine 虚拟现实 + airsim
游戏引擎·vr·虚幻
真鬼1234 天前
【Unity WebGL】内嵌网页与双向通信
unity·游戏引擎·webgl
zyh______5 天前
C#语法糖(按照实用性排序)
unity·c#