饥荒Mod 开发(十四)：制作屏幕弹窗

饥荒Mod 开发(十三)：木牌传送
在上一个文章里面制作了一个传送选择页面，是一个全屏的窗口，那饥荒中如何制作一个全屏的窗口，下面介绍一下如何从零开始制作一个全屏窗口

制作屏幕窗口

饥荒中的全屏窗口都有一个基类 “Screen”,我们需要从这个基类派生一个子类
在widgets 目录下新建一个 myscreen.lua 文件

下面是一个最简单的 屏幕类的实现

local Screen = require "widgets/screen" -- 引入"widgets/screen"模块
local Widget = require "widgets/widget"
local Image = require "widgets/image"
local TravelScreen = Class(Screen, function(self, homesign, traveller)
    Screen._ctor(self, "myscreen") -- 构造函数，创建一个名为"myscreen"的屏幕
     --画一个背景
     self.root = self:AddChild(Widget("ROOT"))
     self.root:SetVAnchor(ANCHOR_MIDDLE)
     self.root:SetHAnchor(ANCHOR_MIDDLE)
     self.root:SetScaleMode(SCALEMODE_PROPORTIONAL)
 
     --添加一个背景
     self.bg = self.root:AddChild(Image("images/globalpanels.xml", "panel.tex"))
     self.bg:SetSize(500, 650)
     self.bg:SetPosition(0, 25)
end)

function TravelScreen:Close()
    TheFrontEnd:PopScreen(self) -- 当取消时，弹出当前屏幕
end

return TravelScreen -- 返回TravelScreen类

测试弹出页面

监听F3 按键进入游戏 按F3 键，弹出这个页面

local myscreen = GLOBAL.require("widgets/myscreen")
GLOBAL.TheInput:AddKeyHandler(function(key, down)
    -- 检查按下的键是否是 F1 键
   if (key == GLOBAL.KEY_F3 and not down) then
        local screen = TheFrontEnd:GetActiveScreen()
        -- End if we can't find the screen name (e.g. asleep)
        if not screen or not screen.name then return true end
        -- If the hud exists, open the UI
        if screen.name:find("HUD") then
            -- We want to pass in the (clientside) player entity         
            TheFrontEnd:PushScreen(myscreen())
            return true
        else
            -- If the screen is already open, close it
            if screen.name == "myscreen" then
                screen:Close()
            end
        end
    end
end)

效果如下

增加一个关闭按钮

在myscreen.lua 文件的 ”构造函数”中 添加一个按钮

    -- 添加一个菜单，用来显示关闭
    self.menu = self.root:AddChild(Menu(nil, 200, true)) -- 在root上添加一个菜单
    self.menu:SetScale(0.6) -- 设置菜单的缩放比例
    self.menu:SetPosition(0, -225, 0) -- 设置菜单的位置
    self.cancelbutton = self.menu:AddItem("关闭", function() -- 在菜单上添加一个名为"关闭"的项，点击后执行self:Close()函数
        self:Close()
    end)

点击关闭按钮会触发 self:Close() 函数调用关闭页面