Добавлен , опубликован

Основы Интерфейса

Содержание:
PopupMenu (контекстное меню, с англ. popupmenu переводится как "всплывающее меню". В современном интерфейсе "всплывающее" и "контекстное" меню немного отличаются, хотя они очень похожи) - обычно если навести на объект и нажать на него ПКМ то можно вызвать контекстное меню. Это так работает пример в Windows
PopupMenu можно вызвать не только ПКМ, но например нажатием на кнопку. В варкрафте вызов меню или закрытие происходит нажатием на одну же и ту же кнопку. Таким типом близзарды использовали для определения настроек

POPUPMENU и MENU

Существует в варкрафте два типа фрейма: POPUPMENU (основное меню) и MENU (подменю).
PopupMenu - является родителем всего этого контекстного меню. В фрейме-родителе прописано и backdrop, и вызывающая меню кнопка (button) - чаще всего это кнопка переключатель: раскрыть меню/закрыть меню, и меню (Menu). Фактически группа потомков объединено в одно меню (popumenu)
Menu - чаще всего это потомок, и является списком. По своим свойствам menu очень похож на подменю. В Menu можно прописать ячейки (MenuItem). Когда вы нажимаете на кнопку, вызывается список Menu из MenuItems. В Menu прописаны настройки этих ячеек: backdrop (фон), размер итд. Вот и все.
Но иногда особой разницы между PopupMenu и Menu никакой, в некоторых fdf-files вместо Menu используют PopupMenu. Иногда возникает ощущение, что сами типы в варкрафте не имеют строгой типизации, и даже BUTTON может быть использован в качестве меню (а что мб попробовать?).

fdf - функции Menu

MenuTextHighlightColor
MenuTextHighlightColor red green blue,
MenuTextHighlightColor red green blue alpha,
Пример:
MenuTextHighlightColor 1.0 0.0 0,
текст выбранной опции (ячейки) курсором подсвечивается
MenuItemHeight
MenuItemHeight real,
Пример:
MenuItemHeight 0.014,
Высота одной опции МЕНЮ. Используемый размер шрифта должен соответствовать этому, иначе вы можете не увидеть отображаемый текст.
MenuBorder
MenuBorder 0.009,
Пример:
MenuBorder 0.009,
Аналогично, как и у фрейма EditBox с функцией EditBorderSize
Размер задает толщину невидимых границ для текста.
MenuItem
MenuItem string text, integer,
Пример:
MenuItem "COLON_GOLD", -2,
Добавляет возможность выбора в MENU / PopupMenuFrame. Число всегда -2 в fdfs Blizzards.
Пример кода:
Frame "MENU" "CustomCommandsPopupMenu" INHERITS WITHCHILDREN "EscMenuPopupMenuMenuTemplate" {
        MenuItem "COLON_GOLD",     -2,
        MenuItem "COLON_LUMBER", -2,
        MenuItem "COLON_FOOD",     -2,
}

fdf - функции Popupmenu

PopupArrowFrame (основная кнопка вызова меню)
Это кнопка вызова меню.
PopupArrowFrame FrameName,
Пример:
PopupArrowFrame "AdvancedPopupMenuArrow",
Выберите фрейм BUTTON в POPUPMENU
Эта кнопка Menu. Когда вы нажимаете на эту кнопку, то вызываете контекстное меню со своим списком. Или наоборот, сворачивает список
PopupButtonInset (оффсет)
PopupButtonInset real,
Пример:
PopupButtonInset 0.01,
-x offset for PopupArrowFrame from RIGHT of the POPUPMENU
Указывают смещение PopupArrowFrame (основная кнопка вызова меню) от правой точки POPUPMENU (меню)
PopupMenuFrame (меню)
Это меню, где указаны параметры меню со всеми кнопками выбора, фон и пр. Изначально сокрыто, но при активации основной кнопки становится вновь видимой
PopupMenuFrame FrameName,
Пример:
PopupMenuFrame "RacePopupMenuMenu",
Указывают фрейм-MENU для POPMENU. MENU содержит выбираемые параметры.
PopupTitleFrame (шаблон кнопки выбора из меню)
Это шаблонная кнопка выбора. Когда игрок кликает по кнопки вызова меню, появляется контекстное меню с несколько кнопок, игроку предстоит выбрать одну из кнопок
PopupTitleFrame FrameName,
Пример:
PopupTitleFrame "EscOptionsShadowsPopupMenuTitle",
Указывают фрейм-GLUETEXTBUTTON для PopupMenu
Чисто кнопка с текстом без фона
Text markup for the current selected Text, also can be used with a FrameEvent to know when someone starts selecting.
Большинство указанных в PopupTitleFrame кнопок-пустышек в fdf-files используют вот такие похожие шаблоны кнопки с текстом как этот. Тут указаны настройки текста:
Frame "GLUETEXTBUTTON" "EscMenuPopupMenuTitleTemplate" {  
    DecorateFileNames,
    FrameFont "EscMenuTextFont",0.011,"",
    ButtonText "EscMenuPopupMenuTitleTextTemplate",
    Frame "TEXT" "EscMenuPopupMenuTitleTextTemplate" {
        FontJustificationOffset 0.01 0.0,
        FontFlags "FIXEDSIZE",
    }
}
Короче, эти все кнопки не создают ничего кроме текста. Ни backdrops, ни HighLight. Являются описанием текста кнопки. Я думаю, что не зря используют GLUETEXTBUTTON поскольку она вызывает звук при нажатии. А некоторые используют и TEXTBUTTON
Текст кнопки меню постоянно меняется, когда выбираете одну из опции.

Пример-1 создания PopupMenu

кратко: этот пример помогает разобраться с fdf-функциями внутри PopupMenu. Рассмотреть что они делают. Ничего более.
пример fdf-file взятого из шаблона UI/FrameDef/UI/StandardTemplates.fdf . Я немного упростил, сделал весь код читаемым.
fdf код
Frame "POPUPMENU" "MyPopupMenuTemplate" {
    Width 0.111875,
    Height 0.01875,
    PopupButtonInset 0.01, //смещение кнопки-переключателя

    //активный фон кнопки
    ControlBackdrop "MyBackdropTemplate",
    Frame "BACKDROP" "MyBackdropTemplate" {
        BackdropTileBackground,
        BackdropBackground  "UI\Widgets\Glues\GlueScreen-Button1-BackdropBackground.blp",
        BackdropCornerFlags "UL|UR|BL|BR|T|L|B|R",
        BackdropCornerSize  0.016,
        BackdropBackgroundSize  0.032,
        BackdropBackgroundInsets 0.004 0.004 0.004 0.004,
        BackdropEdgeFile  "UI\Widgets\Glues\GlueScreen-Button1-BackdropBorder.blp",
    }

    //выключенный фон кнопки
    ControlDisabledBackdrop "MyDisabledBackdropTemplate",
    Frame "BACKDROP" "MyDisabledBackdropTemplate" {
        BackdropTileBackground,
        BackdropBackground  "UI\Widgets\Glues\GlueScreen-Button1-BackdropBackground-Disabled.blp",
        BackdropCornerFlags "UL|UR|BL|BR|T|L|B|R",
        BackdropCornerSize  0.016,
        BackdropBackgroundSize  0.032,
        BackdropBackgroundInsets 0.004 0.004 0.004 0.004,
        BackdropEdgeFile  "UI\Widgets\Glues\GlueScreen-Button1-BackdropBorder-Disabled.blp",
    }

    //кнопка с текстом без фона, на нее ссылается popup menu
    PopupTitleFrame "MyPopupMenuTitle",
    Frame "TEXTBUTTON" "MyPopupMenuTitle" {  
        DecorateFileNames,
        FrameFont "MasterFont",0.011,"",
        ButtonText "StandardPopupMenuTitleTextTemplate",
        Frame "TEXT" "StandardPopupMenuTitleTextTemplate" {
            FontJustificationOffset 0.01 0.0,
            FontFlags "FIXEDSIZE",
        }
    }

    //кнопка-переключатель
    PopupArrowFrame "MyPopupMenuArrow",
    Frame "BUTTON" "MyPopupMenuArrow" {
        Height 0.011,
        Width 0.011,
        ControlBackdrop "MyMenuArrowBackdropTemplate",
        Frame "BACKDROP" "MyMenuArrowBackdropTemplate" {
            BackdropBlendAll,
            BackdropBackground "UI\Widgets\Glues\GlueScreen-Pulldown-Arrow.blp",
        }
    }


    //менюшка
    PopupMenuFrame "MyPopupMenuMenu",
    Frame "MENU" "MyPopupMenuMenu" {
        Height 0.06,
        DecorateFileNames,
        FrameFont "MasterFont",0.011,"",
        MenuTextHighlightColor 0.99 0.827 0.0705 1.0,
        MenuItemHeight 0.014,
        MenuBorder 0.009,

      
        MenuItem "TestA",     -2,
        MenuItem "TestB",     -2,
        MenuItem "TestC",     -2,
        
        //фон меню
        ControlBackdrop "MyPopupMenuMenuBackdropTemplate",
        Frame "BACKDROP" "MyPopupMenuMenuBackdropTemplate" {
            BackdropTileBackground,
            BackdropBackground  "UI\Widgets\Glues\GlueScreen-Button1-BackdropBackground.blp",
            BackdropCornerFlags "UL|UR|BL|BR|T|L|B|R",
            BackdropCornerSize  0.016,
            BackdropBackgroundSize  0.032,
            BackdropBackgroundInsets 0.004 0.004 0.004 0.004,
            BackdropEdgeFile  "UI\Widgets\Glues\GlueScreen-Button1-BorderedBackdropBorder.blp",
        
        }
    }
}
на jass создал:
код
local framehandle f = BlzCreateFrame("MyPopupMenuTemplate", BlzGetOriginFrame(ORIGIN_FRAME_GAME_UI, 0), 0, 0)
call BlzFrameSetAbsPoint(f, FRAMEPOINT_CENTER, 0.4, 0.3)
call BlzFrameSetSize(f, 0.2, 0.04)

Пример-2 создания PopupMenu на lua

В Warcraft 3 PopupMenu представляет собой кнопку, при нажатии на нее под ней появляются доступные для выбора параметры. PopupMenu имеет различных функциональных Childframes. Выбираемые параметры могут быть установлены только в fdf (Warcraft 3 версии 1.31 и 1.32).
Ознакомьтесь с Fdf ниже:
«MyPopupTemplate» - это PopupMenu, в котором отсутствуют выбираемые параметры, но настройка визуальных элементов делает его хорошим наследуемым источником. «TestPopup» и «CustomCommandsPopup», наследуют его параметры.
В триггерах можно получить текущий выбранный индекс параметра с помощью BlzFrameGetValue, начиная с 0, он также может возвращать -1, когда ничего не было выбрано.
Событие FRAMEEVENT_POPUPMENU_ITEM_CHANGED срабатывает, когда изменен параметр PopupMenu. Обычно в PopupMenu можно указать один параметр, когда вы выбираете один из них, он заменяет старый параметр. BlzGetTriggerFrameValue() возвращает новое выбранное значение от нового параметра, и его можно использовать для синхронизации. Можно установить выбранное значение с помощью BlzFrameSetValue, но на это не влечет никакой реакции события FRAMEEVENT_POPUPMENU_ITEM_CHANGED. Этот fdf представляет собой настраиваемое PopupMenu с EditBox. идея состоит в том, чтобы иметь 3 выбираемых параметра на основе выбранной опции, которую игрок устанавливает, это золото / древесина / еда для изменения значения.
fdf код
IncludeFile "UI/FrameDef/UI/EscMenuTemplates.fdf",

Frame "POPUPMENU" "MyPopupTemplate" {
    Width 0.19625,
    Height 0.03,
    PopupButtonInset 0.01, // -x offset for PopupArrowFrame from RIGHT of the POPUPMENU

    // Background Enabled
    ControlBackdrop "MyPopupTemplateBackdropTemplate",
    Frame "BACKDROP" "MyPopupTemplateBackdropTemplate" INHERITS "EscMenuButtonBackdropTemplate" {
    }

    // Background Disabled
    ControlDisabledBackdrop "MyPopupTemplateDisabledBackdropTemplate",
    Frame "BACKDROP" "MyPopupTemplateDisabledBackdropTemplate" INHERITS "EscMenuButtonDisabledBackdropTemplate" {
    }

    // Text markup for the current selected Text, also can be used with a FrameEvent to know when someone starts selecting.
    PopupTitleFrame "PopupMenuTitleTemplate",
    Frame "GLUETEXTBUTTON" "PopupMenuTitleTemplate" INHERITS WITHCHILDREN "EscMenuPopupMenuTitleTemplate" {
    }

    // the Arrow at the right
    PopupArrowFrame "PopupMenuArrowTemplate",
    Frame "BUTTON" "PopupMenuArrowTemplate" INHERITS WITHCHILDREN "EscMenuPopupMenuArrowTemplate" {
    }
   
    // The Container for the selectable options
    // actulay it is smarter to not define this in the Template.
    //PopupMenuFrame "TestPopupMenu",
    //Frame "MENU" "TestPopupMenu" INHERITS WITHCHILDREN "EscMenuPopupMenuMenuTemplate" {
// 
//  }  
}

Frame "POPUPMENU" "TestPopup" INHERITS WITHCHILDREN "MyPopupTemplate" {
    // The Container for the selectable options
    PopupMenuFrame "TestPopupMenu",
    Frame "MENU" "TestPopupMenu" INHERITS WITHCHILDREN "EscMenuPopupMenuMenuTemplate" {
        // the selectable options
        // they will try to load a Localized String
        MenuItem "TestA",     -2,
        MenuItem "TestB",     -2,
        MenuItem "TestC",     -2,
        MenuItem "TestD",     -2,
    }
}

Frame "POPUPMENU" "CustomCommandsPopup" INHERITS WITHCHILDREN "MyPopupTemplate" {
    PopupMenuFrame "CustomCommandsPopupMenu",
    Frame "MENU" "CustomCommandsPopupMenu" INHERITS WITHCHILDREN "EscMenuPopupMenuMenuTemplate" {
        MenuItem "COLON_GOLD",     -2,
        MenuItem "COLON_LUMBER",     -2,
        MenuItem "COLON_FOOD",     -2,
    }
}

Frame "EDITBOX" "CustomCommandsEditBox" INHERITS WITHCHILDREN "EscMenuEditBoxTemplate" {
    Width 0.15,
    Height 0.037,
    DecorateFileNames,
    FrameFont "MasterFont", 0.015, "",
    SetPoint TOPLEFT, "CustomCommandsPopup", TOPRIGHT, 0.0, 0.0,

    EditTextFrame "CustomCommandsEditBoxText",
    Frame "TEXT" "CustomCommandsEditBoxText" INHERITS "EscMenuEditBoxTextTemplate" {
    }
}
lua-код, который создает PopupMenu и EditBox:
код
do
    local real = MarkGameStarted
 function MarkGameStarted()
        real()
    BlzLoadTOCFile( "war3mapImported\\TestPop.toc" )
    local currentFrame = nil
    local popupFrame = BlzCreateFrame("CustomCommandsPopup", BlzGetOriginFrame(ORIGIN_FRAME_GAME_UI,0), 0, 0 )
    BlzFrameSetAbsPoint( popupFrame, FRAMEPOINT_TOPLEFT, 0.20, 0.30)

    local editBox = {}
    local editBoxTrigger = CreateTrigger()
    TriggerAddAction(editBoxTrigger, function()
        SetPlayerState(GetTriggerPlayer(), editBox[BlzGetTriggerFrame()], tonumber(BlzGetTriggerFrameText()))

        -- clear the box for the Active Player
        if GetLocalPlayer() == GetTriggerPlayer() then
            BlzFrameSetText(BlzGetTriggerFrame(), "")
            BlzFrameSetFocus(BlzGetTriggerFrame(), false)
        end
    end)
   
    local function add(playerState)
        local tempBox = BlzCreateFrame("CustomCommandsEditBox", popupFrame, 0, 0)
        table.insert(editBox, tempBox)
        BlzTriggerRegisterFrameEvent(editBoxTrigger, tempBox, FRAMEEVENT_EDITBOX_ENTER)
        editBox[tempBox] = playerState
        BlzFrameSetVisible(tempBox, false)
    end

    -- create 3 boxes one for Gold, Lumber and Food
    add(PLAYER_STATE_RESOURCE_GOLD)
    add(PLAYER_STATE_RESOURCE_LUMBER)
    add(PLAYER_STATE_RESOURCE_FOOD_CAP)

    add = nil

    local trigger = CreateTrigger()
    TriggerAddAction(trigger, function()
        if GetLocalPlayer() == GetTriggerPlayer() then
           -- hide current Box
           BlzFrameSetVisible(currentFrame, false)
           
           -- change current Box and show it
           currentFrame = editBox[BlzGetTriggerFrameValue() + 1]
           BlzFrameSetVisible(currentFrame, true)

           -- give that box the keyboard input focus
           BlzFrameSetFocus(currentFrame, true)
        end
    end)
    BlzTriggerRegisterFrameEvent(trigger, popupFrame, FRAMEEVENT_POPUPMENU_ITEM_CHANGED)
 end
end

Содержание
`
ОЖИДАНИЕ РЕКЛАМЫ...