unity动态加载地图瓦片

效果如下：

以下为UI结构即具体设置:

PanelTest设置:

Center设置:

Scroll View设置:

Viewport设置:

Content设置:

ImageTempLate设置:

原理简图:

代码:

using Common;
using UnityEngine;
using UnityEngine.UI;

namespace Lugs
{
    /// <summary>
    /// 图形切割配置
    /// </summary>
    public class GridData
    {
        /// <summary>
        /// 原始图片的文件
        /// </summary>
        public string SrcFileName = @"D:_lugsProjectsMapCutterSourceMap.jpg";
        /// <summary>
        /// 切割后的图片输出目录
        /// </summary>
        public string OutDirectory = @"D:_lugsProjectsMapCutterRes";
        /// <summary>
        /// 图片宽度
        /// </summary>
        public int ImageWidth = 3000;
        /// <summary>
        /// 图片高度
        /// </summary>
        public int ImageHeight = 1900;
        /// <summary>
        /// 格子宽度
        /// </summary>
        public int GridWidth = 256;
        /// <summary>
        /// 格子高度
        /// </summary>
        public int GridHeight = 256;
        /// <summary>
        /// 切片文件前缀
        /// </summary>
        public string titlePrefixName = "WorldMap_";
        /// <summary>
        /// 切片文件扩展名
        /// </summary>
        public string expandedName = @".jpg";
    }

    /// <summary>
    /// UI显示的格子结构
    /// </summary>
    public class GridItem
    {
        public bool isUsed;
        public int index;
        public RawImage image;

        GridData data;
        public GridItem(RawImage itemTemplate, GridData data)
        {
            image = GameObject.Instantiate<RawImage>(itemTemplate, itemTemplate.transform.parent);
            image.enabled = true;
            image.gameObject.SetActive(true);
            this.data = data;
        }

        public void Clear()
        {
            isUsed = false;
            index = -1;
            image.enabled = false;
        }

        public void SetInfo(int index, int xGridCount)
        {
            this.index = index;
            isUsed = true;
            image.enabled = true;
            int x = index % xGridCount;
            int y = index / xGridCount;
            GameObject obj = image.gameObject;
            obj.name = string.Format("[{0},{1}]", x, y);
            int width = data.GridWidth;
            int height = data.GridHeight;
            obj.transform.localPosition = new Vector3(x * width, -y * height);
            if ((x + 1) * width > data.ImageWidth)
            {
                width = data.ImageWidth - x * width;
            }

            if ((y + 1) * height > data.ImageHeight)
            {
                height = data.ImageHeight - y * height;
            }
            image.rectTransform.sizeDelta = new Vector2(width, height);
            string imageName = "worldmap_" + (index + 1).ToString("D2");
            //Debug.Log("imageName = " + imageName);
            ImageAssetItem item = new ImageAssetItem(UIManager.Str_WorldMapTxFolderName, imageName, false, true);
            item.LoadImage(() =>
            {
                image.texture = item.TexObject;
            });
        }
    }
}

UI代码:

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;

namespace Lugs
{
    public sealed class PanelTest : MonoBehaviour
    {
        public RawImage RawImage_GridTemplate;
        public ScrollRect scrollRect;
        public Slider Slider_Scale;
        /// <summary>
        /// 视口的缩放系数，默认不缩放
        /// </summary>
        float mScreenRatio = 1.0f;
        public float ScreenRatio
        {
            get
            {
                return mScreenRatio;
            }
            set
            {
                mScreenRatio = value;
                Vector2 pos = scrollRect.normalizedPosition;
                pos.x = Mathf.Clamp01(pos.x);
                pos.y = Mathf.Clamp01(pos.y);
                scrollRect.normalizedPosition = pos;
            }
        }
        /// <summary>
        /// 可视区域的可滑动的区域大小
        /// </summary>
        Vector2 scrollRectMoveArea;
        /// <summary>
        /// 可视区域大小
        /// </summary>
        Vector2 screenSize;
        /// <summary>
        /// 扩展的可视区域大小
        /// </summary>
        Vector2 screenExtendSize;
        /// <summary>
        /// 可视区域左下角在可滑动区域内的位置
        /// </summary>
        Vector2 screenLBPosAtMoveArea;
        /// <summary>
        /// 可视区域右上角在可滑动区域内的位置
        /// </summary>
        Vector2 screenRTPosAtMoveArea;
        /// <summary>
        /// 扩展的可视区域左下角在可滑动区域内的位置
        /// </summary>
        Vector2 screenExtendLBPosAtMoveArea;
        /// <summary>
        /// 扩展的可视区域右上角在可滑动区域内的位置
        /// </summary>
        Vector2 screenExtendRTPosAtMoveArea;
        /// <summary>
        /// 实际可视区域的扩展比例
        /// </summary>
        float screenExtendRatio;
        /// <summary>
        /// 地图的尺寸
        /// </summary>
        Vector2 mapSize;
        /// <summary>
        /// 铅直方向上的格子数量
        /// </summary>
        int mYGridCount;
        /// <summary>
        /// 水平方向上的格子数量
        /// </summary>
        int mXGridCount;
        /// <summary>
        /// 格子出现的左下位置
        /// </summary>
        Vector2 gridLBPos;
        /// <summary>
        /// 格子出现的右上位置
        /// </summary>
        Vector2 gridRTPos;
        /// <summary>
        /// 使用中的UI格子
        /// </summary>
        List<GridItem> useGridList = new List<GridItem>();
        /// <summary>
        /// 未使用的UI格子
        /// </summary>
        List<GridItem> unUsedGridList = new List<GridItem>();
        /// <summary>
        /// 格子的配置数据
        /// </summary>
        GridData mGridData = new GridData();
        void Start()
        {
            Init();
            OnScrollValueChanged();
        }

        void Init()
        {
            RawImage_GridTemplate.gameObject.SetActive(false);

            mXGridCount = Mathf.CeilToInt(mGridData.ImageWidth * 1.0f / mGridData.GridWidth);
            mYGridCount = Mathf.CeilToInt(mGridData.ImageHeight * 1.0f / mGridData.GridHeight);

            mapSize = new Vector2(mGridData.ImageWidth, mGridData.ImageHeight);
            screenSize = UIManager.Instance.UIUGUIRootScene.sizeDelta;
            scrollRect.content.sizeDelta = mapSize;
            scrollRectMoveArea = mapSize - screenSize;
            screenExtendRatio = 0.1f;
            screenExtendSize = screenSize * screenExtendRatio;
            scrollRect.onValueChanged.RemoveAllListeners();
            scrollRect.onValueChanged.AddListener(OnScrollValueChanged);
        }
        void OnScrollValueChanged(Vector2 vec2)
        {
            OnScrollValueChanged();
        }

        void OnScrollValueChanged()
        {
            //ScrollRect当前在可是区域滑动的比例
            float xPox = scrollRect.horizontalNormalizedPosition;
            float yPos = scrollRect.verticalNormalizedPosition;

            //视口在可移动区域内的位置
            screenLBPosAtMoveArea.x = scrollRectMoveArea.x * xPox;
            screenLBPosAtMoveArea.y = scrollRectMoveArea.y * yPos;
            screenRTPosAtMoveArea = screenLBPosAtMoveArea + screenSize;

            //扩展视口在可移动区域内的位置
            screenExtendLBPosAtMoveArea = screenLBPosAtMoveArea - screenExtendSize;
            screenExtendRTPosAtMoveArea = screenRTPosAtMoveArea + screenExtendSize;

            //计算格子出现的位置:左下 右上
            gridLBPos.x = Mathf.FloorToInt(screenExtendLBPosAtMoveArea.x / mGridData.GridWidth);
            gridLBPos.y = Mathf.FloorToInt(screenExtendLBPosAtMoveArea.y / mGridData.GridHeight);
            gridRTPos.x = Mathf.CeilToInt(screenExtendRTPosAtMoveArea.x / mGridData.GridWidth);
            gridRTPos.y = Mathf.CeilToInt(screenExtendRTPosAtMoveArea.y / mGridData.GridHeight);

            //分别计算左下格子和右上格子的索引
            int iMin = (int)gridLBPos.x;
            int iMax = (int)gridRTPos.x;
            int jMin = (int)gridLBPos.y;
            int jMax = (int)gridRTPos.y;

            //刷新格子
            RefreshGrid(iMin, iMax, jMin, jMax);
        }

        void RefreshGrid(int iMin, int iMax, int jMin, int jMax)
        {
            //先全部重置所有格子为 未使用
            for (int i = 0; i < useGridList.Count; ++i)
            {
                GridItem item = useGridList[i];
                item.isUsed = false;
                unUsedGridList.Add(item);
            }

            //整个扩展可视区域内需要的格子数量
            int needCount = 0;
            for (int i = iMin; i <= iMax; ++i)
            {
                for (int j = jMin; j <= jMax; ++j)
                {
                    if (i < 0 || i >= mXGridCount || j < 0 || j >= mYGridCount)
                    {
                        continue;
                    }

                    ++needCount;
                    //格子在可移动区域的索引
                    int index = (mYGridCount - j - 1) * mXGridCount + i;
                    for (int k = 0; k < useGridList.Count; ++k)
                    {
                        GridItem item = useGridList[k];
                        if (index == item.index)
                        {
                            unUsedGridList.Remove(item);
                            item.isUsed = true;
                            break;
                        }
                    }
                }
            }

            //不够的话补够
            for (int i = useGridList.Count; i < needCount; ++i)
            {
                GridItem item = GetItem();
                useGridList.Add(item);
            }

            //刷新格子的信息
            bool isRightInfo = false;
            GridItem firstFreeItem = null;
            for (int i = iMin; i <= iMax; ++i)
            {
                for (int j = jMin; j <= jMax; ++j)
                {
                    if (i < 0 || i >= mXGridCount || j < 0 || j >= mYGridCount)
                    {
                        continue;
                    }

                    isRightInfo = false;
                    firstFreeItem = null;
                    int index = (mYGridCount - j - 1) * mXGridCount + i;
                    for (int k = 0; k < useGridList.Count; ++k)
                    {
                        GridItem item = useGridList[k];

                        if (null == firstFreeItem && !item.isUsed)
                        {
                            firstFreeItem = item;
                        }

                        if (item.isUsed && (index == item.index))
                        {
                            isRightInfo = true;
                            break;
                        }
                    }

                    if (!isRightInfo)
                    {
                        if (null != firstFreeItem)
                        {
                            firstFreeItem.SetInfo(index, mXGridCount);
                        }
                    }
                }
            }
        }

        GridItem GetItem()
        {
            for (int i = unUsedGridList.Count - 1; i >= 0;)
            {
                GridItem tmpItem = unUsedGridList[i];
                tmpItem.Clear();
                unUsedGridList.Remove(tmpItem);
                return tmpItem;
            }

            GridItem item = new GridItem(RawImage_GridTemplate, mGridData);
            return item;
        }

        public void OnSliderValueChange()
        {
            float scale = Slider_Scale.value / Slider_Scale.maxValue;
            scrollRect.viewport.localScale = new Vector3(scale, scale, 1);
            Rect baseRect = (scrollRect.transform as RectTransform).rect;
            scrollRect.viewport.SetSizeWithCurrentAnchors(RectTransform.Axis.Horizontal, baseRect.width / scale);
            scrollRect.viewport.SetSizeWithCurrentAnchors(RectTransform.Axis.Vertical, baseRect.height / scale);
            ScreenRatio = 1 / scale;
        }
    }
}