## **.xml或XML可視元素文件** “ UI元素”或“小部件”是構成用戶界面的所有圖形的小片段。WoW使用XML來布局您在屏幕上看到的所有內容。另外，當屏幕上的窗口小部件發生事情（稱為“事件”，還記得嗎？）時，可以調用事件處理程序（即函數）以執行所需的任何操作。不久我們將看到如何告訴WoW我們對哪些小部件感興趣以及希望由哪個事件處理程序處理哪些事件。 #### 暴雪XML格式聲明 我們聲明我們的文檔符合Blizzard模式并具有以下內容： ~~~ <Ui xmlns="http://www.blizzard.com/wow/ui/" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.blizzard.com/wow/ui/..\FrameXML\UI.xsd"> <!-- 插件的功能在這里定義 --> </Ui> ~~~ 暴雪在中定義了UI小部件`UI.xsd`。如果您提取了Blizzard接口，則可以在Interface / FrameXML / UI.xsd中找到此文件，或者 wowprogramming.com[在此處](http://wowprogramming.com/FrameXML/UI.xsd)維護在線副本。該[XML的用戶界面](https://wow.gamepedia.com/XML_user_interface "XML用戶界面")頁面有下一張好名單[的Widget元素](https://wow.gamepedia.com/XML_user_interface#Widget_Elements "XML用戶界面") ~~~ <Ui xmlns="http://www.blizzard.com/wow/ui/" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.blizzard.com/wow/ui/..\FrameXML\UI.xsd"> <!-- 表示在此處載入xxoo.lua文件（非必須的，如果沒有xml文件，我們直接在toc中放個lua文件就可以）， --> <Script File="xxoo.lua"/> <!--Frame是包含UI元素的，UIParent是最頂層的框架，所有的UI都包含在其中，他在游戲里是透明的。與之并列的是一個特殊的World Frame包括FPS、截圖，其他的ui控件都是Frame的子類--> <Frame name="eCoordinates" parent="UIParent"> <Scripts> <OnLoad function="eCoordinates_OnLoad"></OnLoad> <OnEvent function="eCoordinates_OnEvent"></OnEvent> </Scripts> </Frame> </Ui> ~~~ ``` <Frame name="名稱，唯一" inherits="myFather繼承" toplevel="true 等級" parent="UIParent 父標簽" id="編號" movable="true 可移動" enableMouse="true 允許鼠標事件" frameStrata="HIGH層級" hidden="false隱藏"> <Size> <!--大小--> <AbsDimension x="" y="" /><!--絕對尺寸--> </Size> <!--簡化方法一> <size x="" y="" /> <Anchors> <!--錨點,用來標記相對位置--> <Anchor Point="本控件的參考點" relativeTo="參考控件" relativePoint="參考控件的參考點"> <Offset> <!--偏移值--> <AbsDimension x="" y="" /> </Offset> <!--簡化寫法--> <Offset x="" y="" /> </Anchor> </Anchors> <!--背景和邊框--> <Backdrop name= "$parentBackdrop" bgFile="背景貼圖" edgeFile="邊框貼圖" tile="不知道"> <EdgeSize> <AbsValue val="18" /> <!--邊框縮放大小--> </EdgeSize> <TileSize> <Absvalue val="16" /> </TileSize> <BackgroundInsets> <AbsInset left="5" right="5" top="5" bottom="5"/> <!--背景四周留白--> </BackgroundInsets> </Backdrop> <Layers> <!--分層，主要放置貼圖材質和字符--> <Layer level="BACKGROUND"> <!--背景層--> <Texture name="$parentRed" file="貼圖" hidden="true"/> </Layer> <Layer level="ARTWORK"> <!-- 藝術層--> <FontString name="$parent名字" inherits="Font" justifyH="CENTER"/> </Layer> <Layer level="OVERLAY"> <!-- 覆蓋層--> <Texture name="$parentShine" file="貼圖" alphaMode="ADD透明模式" hidden="true"> <Anchors> <Anchor point=?,CENTER"/> </Anchors> </Texture> </Layer> </Layers> <Frames> <!--嵌入其他框架--> </Frames> <Scripts> <OnLoad>處理載入事件</OnLoad> <OnEvent>處理用RegisterEvent注冊過的事件</OnEvent> <OnUpdate>更新事件 </OnUpdate> <OnShow>顯示事件 </OnShow> <OnHide>隱藏事件 </OnHide> <OnClick>單擊事件</OnClick> <OnDoubleClick>雙擊事件</OnDoubleClick> <OnEnter>鼠標鍵入</OnEnter> <OnLeave>鼠標移出 </OnLeave> <OnDragStart>拖放開始</OnDragStart> <OnReceiveDrag>接受受拖放</OnReceiveDrag> <OnValueChanged>值改變(用于 Slider 滑塊)</OnValueChanged> </Scripts> </Frame> ``` ## inherits 和 parent 的區別 | | | | --- | --- | | inherits | 繼承，表示本控件未標明的屬性全部繼承自某控件（包括事件處理腳本） | | parent | 父控件，表示依存關系，如果父控件隱藏了那么子控件也會隱藏 | ## Anchor錨點中的定位規則 | | | | --- | --- | | Point| 自身參考點 | | relativeTo| 參考控件 | | relativePoint|參考控件參考點 比如一個正方形的按鈕：`<Anchor Point="LEFT" relatriveTo="$parent" relativePoint="Right">`的意思是：我的左邊對父控件的右邊，效果就是按鈕始終在父控件的右邊| ## **UI對象的繼承關系** * UIObject 始祖所有的ui對象都是繼承與它 * * LayoutFrame 布局框架，繼承UIObject，主要有一些布局函數（這是一個虛類不可創建實例） LayoutFrame的一些重要函數 GetParent() Setparent() GetAlpha() SetAlpha() SetWidth() SetHeight() IsShow() 是否顯示，表示一種屬性，如果父對象可見的時候是否會顯示 IsVisible() 是否可見，表示當前狀態當前對象在屏幕上有沒有顯示 * * * Farme 框架，繼承與LayoutFrame，最重要的UI對象屏幕上可見的UI對象都是他的子類，一般在它上面放置其他控件 * * * * Button 按鈕 * EditBox 可編輯文本框 * GameTooltip 鼠標提示 * ColorSelect 顏色選擇器 * MessageFrame 信息框架 * MiniMap 迷你地圖，小地圖，戰場地圖等 * Model 模型，用于顯示3D動畫 人物模型，冷卻都是Model * MovieFrame 電影框架（放電影的？） * ScrollFrame 可滾動框架 * ScrollingMEssageFrame 滾動信息框架例如聊天窗口、戰斗信息窗口 * SimpleHTML 類似網頁的可以定義圖片文字大小顏色的文本 * slider 滑塊像系統設置中的ui縮放那種滑塊 * statusbar 進度條 像是施法條，血條等等