魔兽地图编辑器吧 关注:65,059贴子:3,836,593

【申精】UI基础教程

只看楼主收藏回复

昨日老ck托梦于我,特此诈尸,代其发布。
内容如下。


IP属地:浙江1楼2019-09-09 13:04回复
    UI变量
    1、UI的变量类型是Frame 其实就是个整数
    2、根据名称获取子Frame 每个UI创建的时候都有个名称和序号 根据名称和序号就可以获得该UI以及子UI(按Tag创建的无法获取子UI,所以要创建组合UI时就必须要fdf文件)
    常用UI类型
    创建时全部字母需要大写。
    Frame
    可以用作一个UI的皮。比如新建一个Frame,设置好坐标(大小设置为0,0避免遮盖其他互动的UI) 然后以此Frame为父Frame创建一堆子UI这些子UI会跟着父Frame的位置移动 设置显示隐藏(子Frame也可以单独设置显示隐藏 但父Frame隐藏时强制隐藏)设置透明度等
    Backdrop
    显示图片的 最常用的UI
    Text
    显示文字的 fdf里面可以设置颜色、对齐方式、字体阴影等 但是字体和大小设置好像无效
    Button
    可以捕获鼠标点击 template模板创建出来是透明空按钮
    Gluebutton
    可以捕获鼠标点击 可以设置按下/抬起 禁用状态按下/抬起4个贴图 鼠标移动上去的高亮
    Gluetextbutton
    同上 可以fdf里面加text文字控件
    Editbox
    文本输入框 fdf里可以设置输入区高度 高度0.2可以显示中文 此时frame高度需要0.6
    可以捕获文字变化(事件未知9) 可以获取frame文字 点击激活输入 需要触发取消焦点或手动按esc键才能退出输入状态 否则无法打字聊天
    Slider
    滑块 可以读取滑块当前值 fdf可以设置水平和竖直 当前无法捕获滑块变化 建议捕获鼠标点击后开启计时器判断当前值 鼠标释放后关计时器
    Model Sprite
    显示模型 动画等无法调整大小 常规模型需要缩小非常多才能显示(缩到0.8*0.6尺度) 好像无法显示粒子丝带等特效 可以显示缩放旋转等动画


    IP属地:浙江2楼2019-09-09 13:05
    回复
      UI函数功能
      只说明常用的功能 部分研究不出来 或者太简单自己测试就行

      相对位置 绝对位置
      一共9个位置 对应jass里面整数是0-8
      0 1 2
      3 4 5
      6 7 8
      相对位置是相对某个母ui的位置 会根据母ui移动 绝对位置是相对屏幕ui的位置
      UI的位置范围
      屏幕位置可以按800*600范围理解,触发里面是水平w=0.8,竖直h=0.6,相当于1000倍
      0,600800,600
      0,0800,0
      操作台h大概是在0.15 再就覆盖操作台
      设置大小
      就是0.6-0.8的大小
      设置焦点
      对于可以互动的UI有效 现在能用的就是给输入文本框取消焦点 否则激活输入状态后会阻断自带聊天功能
      设置文本
      一部分UI可以设置文本 如果没有fdf的话默认左上角
      设置贴图
      一部分UI可以设置贴图 默认拉伸覆盖
      字数限制
      输入文本框使用
      设置提示
      鼠标放在可互动的UI上就显示该提示Frame 移开后自动隐藏
      设置模型 动画 动画进度
      Model Sprite可用
      最大最小值 步进值 当前值
      Slider可用
      启用禁用
      Gluebutton之类fdf中带禁用参数的可用
      设置优先级
      优先级0时鼠标可以穿越ui点地板


      IP属地:浙江3楼2019-09-09 13:06
      收起回复
        UI相关文件Fdf文件
        声明ui定义和相关组件的文件 mpq里面一大堆建议自己全部解压来看
        一个自定义fdf的例子



        具体内容一言难尽自己多看系统自带的学习 还有很多无效的地方自己测试
        Toc文件
        自定义fdf文件需要列表进toc文件并在触发中先于创建frame读取
        一个toc文件案例

        根据老骑士的研究 最后一行引用的fdf后面必须再起一行才有效


        IP属地:浙江4楼2019-09-09 13:10
        回复
          UI的精准布局
          使用PS软件 步骤如下
          图像大小
          改为800*600 这样读数可以直接转化为触发的坐标
          UI大小的读取
          窗口打开信息页面

          首选项里面单位改成像素

          框出的区域W和H就是大小 下图实际大小就是0.073,0.066 触发输入的时候需要在自定义代码里面输入不然只有两位小数

          UI的位置读取
          选中区域后按Ctrl+T进入变形功能 上方消息的x和y就是坐标 其中y坐标需要反向处理 下图的坐标就是 中心位置0.5035,0.6-0.165

          特殊情况的修正
          如果创建一个较大的背景版面后其他UI无法对齐,可以魔兽里面截全屏 然后在ps里面按本章方法重新读取布局坐标


          IP属地:浙江6楼2019-09-09 13:15
          收起回复
            部分UI案例滑块案例

            如果自己导入的fdf文件就需要加载toc




            IP属地:浙江8楼2019-09-09 13:17
            回复
              大佬,萌新求教 高亮怎么做的,鼠标移上去了之后换贴图没用啊。。


              9楼2019-09-09 13:23
              回复
                有没大佬分享点UI异步的教程啊


                IP属地:四川10楼2019-09-09 14:10
                回复


                  IP属地:广东来自Android客户端15楼2019-09-09 15:33
                  回复
                    滚到我的收藏夹里面躺尸先


                    IP属地:广东16楼2019-09-09 15:35
                    回复
                      啊~


                      IP属地:浙江来自Android客户端17楼2019-09-09 17:44
                      回复
                        大佬请成为我QQ好友中的一名吉祥物吧


                        IP属地:广东来自Android客户端18楼2019-09-09 18:15
                        回复
                          魔兽界面毫无改变?


                          IP属地:浙江来自Android客户端19楼2019-09-09 18:20
                          回复
                            ⊙∀⊙!


                            来自Android客户端20楼2019-09-09 18:33
                            回复