WoW Wotlk插件中无需外部库拼接方形图块为4:3图像

项目背景 #

作为Lua新手，我正在开发一款WoW WotLK Classic学习插件，目标是打开世界地图时显示自定义地图内容。

插件目录结构 #

core.lua
embeds.xml
Libs
|-magick
  |- build
    |- ...
    |- imagick.so
TextureMaps
|-map1
  |-map1[level]_[1-12].tga
|-map2
|-map3

其中level为1及以上的整数。

核心需求 #

游戏仅支持尺寸为2的幂次的.blp或.tga格式图像，因此我将地图拆分为256x256的方形图块，需要将12个图块拼接为4:3比例（1024x768）的完整地图（直接使用完整尺寸的图像会显示浅绿色纹理）。

遇到的问题 #

最初尝试使用ImageMagick库实现图块拼接，但WoW无法识别非.lua格式的外部库。现在需要在不依赖外部库的前提下，完成12个图块的拼接，同时避免生成带有多余透明区域的1024x1024图像（WoW插件环境支持标准math库）。

现有尝试代码 #

原拼接函数（基于ImageMagick） #

local function stitchTiles(mapName, level)
    local tileSize = 256 -- 每个图块的尺寸
    local numTiles = 12 -- 需要拼接的图块总数
    local totalWidth = tileSize * 4 -- 拼接后图像的总宽度
    local totalHeight = tileSize * 3 -- 拼接后图像的总高度
    local finalImg = magick.blankImage(totalWidth, totalHeight, "rgba(0,0,0,0)") -- 创建空白画布

    for i = 1, numTiles do
        local tileX = ((i - 1) % 3) * tileSize -- 计算当前图块的X坐标
        local tileY = math.floor((i - 1) / 3) * tileSize -- 计算当前图块的Y坐标
        local tileImg = magick.loadImage(mapName .. level .. "_" .. i .. ".tga") -- 加载图块图像
        finalImg:composite(tileImg, tileX, tileY) -- 将图块合并到画布上
    end

    return finalImg
end

原调用代码 #

-- 加载magick库
local magick = require("imagick")

-- 创建显示地图的Frame
local mapFrame = CreateFrame("Frame", nil, UIParent, "BackdropTemplate")
mapFrame:SetSize(512, 384) -- 4:3的地图比例
mapFrame:SetPoint("CENTER")
mapFrame:SetFrameLevel(1000)

-- 创建地图纹理控件
local texture = mapFrame:CreateTexture(nil, "ARTWORK")
texture:SetAllPoints(mapFrame)

-- 拼接图像并设置为纹理
texture:SetTexture(stitchTiles(dungeonName, dungeonLevel))

解决方案：通过叠加纹理控件模拟拼接 #

WoW插件环境无法在运行时直接生成新的纹理文件，但可以通过在父Frame上叠加多个独立的纹理控件来实现图块拼接效果，这是插件开发中的常规方案，不需要任何外部库。

修改后的实现代码 #

图块拼接容器创建函数

-- 创建包含拼接后地图的Frame容器
local function createStitchedMapFrame(mapName, level, parentFrame)
    local tileSize = 256
    local totalWidth = tileSize * 4
    local totalHeight = tileSize * 3

    -- 创建主容器Frame，作为所有图块纹理的父级
    local mapContainer = CreateFrame("Frame", nil, parentFrame or UIParent)
    mapContainer:SetSize(totalWidth, totalHeight)

    -- 遍历12个图块，逐个创建纹理并定位
    for i = 1, 12 do
        -- 计算图块所在的列和行：4列3行布局，对应1024x768的4:3比例
        local col = (i - 1) % 4
        local row = math.floor((i - 1) / 4)
        local tileX = col * tileSize
        local tileY = row * tileSize

        -- 创建单个图块的纹理控件
        local tileTexture = mapContainer:CreateTexture(nil, "ARTWORK")
        tileTexture:SetSize(tileSize, tileSize)
        -- 锚定到容器的对应位置（以左上角为基准偏移）
        tileTexture:SetPoint("TOPLEFT", mapContainer, "TOPLEFT", tileX, -tileY)
        -- 加载插件内的图块纹理，路径需匹配实际目录结构
        local texturePath = string.format("TextureMaps/%s/%s%d_%d.tga", mapName, mapName, level, i)
        tileTexture:SetTexture(texturePath)
    end

    return mapContainer
end

调用示例代码

-- 创建显示用的Frame（可按需求缩放尺寸）
local mapFrame = CreateFrame("Frame", nil, UIParent, "BackdropTemplate")
mapFrame:SetSize(512, 384) -- 4:3比例，为原始拼接尺寸的一半
mapFrame:SetPoint("CENTER")
mapFrame:SetFrameLevel(1000)

-- 创建拼接好的地图容器，并让它填满显示Frame（自动缩放适配）
local stitchedMap = createStitchedMapFrame("map1", 1, mapFrame)
stitchedMap:SetAllPoints(mapFrame)

关键注意事项 #

1. 路径匹配：确保texturePath的拼接逻辑与你的插件目录结构一致，比如map1的level 1第1块图块路径应为TextureMaps/map1/map11_1.tga
2. 布局修正：原代码中使用%3和/3会生成3列4行的纵向布局（768x1024），不符合4:3要求，修改为%4和/4后对应4列3行的横向布局（1024x768）
3. 纹理加载规则：WoW加载插件内纹理时，路径是相对于插件根目录的，因此TextureMaps文件夹必须放在插件根目录下
4. 透明处理：如果图块本身包含透明区域，叠加后会自动保留透明效果，无需额外处理空白背景

内容的提问来源于stack exchange，提问作者joubib