马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。
您需要 登录 才可以下载或查看,没有帐号?立即注册
x
推荐大家使用 VsCode - War3插件 函数翻译,自动补全
VsCode 商店搜索War3Fdf,支持fdf文件 自动补全,语法高亮,自动化模板,悬停提示
演示图环境:1.27(T) 基于Tag类型创建方便演示
Fdf通用1.27 ~ 1.32
BACKDROP 背景是否响应鼠标事件: No
演示 - 创建一个平铺的背景不带边框 宽100 高50
代码
- //创建一个平铺的背景不带边框 宽100 高50
- Frame "BACKDROP" "Demo_NoneBack"
- {
- Width 0.0625,
- Height 0.03125,
-
- BackdropTileBackground,
- BackdropBackground "ReplaceableTextures\TeamColor\TeamColor04.blp",
- BackdropBlendAll,
- }
- ————————————————
- 版权声明:本文为CSDN博主「CarlosX」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明。
复制代码
演示 - 创建一个固定大小的背景 宽64 高64
代码 - //创建一个固定大小的背景 宽64 高64
- Frame "BACKDROP" "Demo_SizeBack"
- {
- Width 0.04,
- Height 0.04,
-
- BackdropBackground "ReplaceableTextures\CommandButtons\BTNOrbOfDarkness.blp",
- BackdropBlendAll,
- }
- ————————————————
- 版权声明:本文为CSDN博主「CarlosX」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明。
复制代码
演示 - 创建一个带边框的背景 宽100 高50
代码 - //创建一个带边框的背景 宽100 高50
- Frame "BACKDROP" "Demo_BorderBack"
- {
- Width 0.0745,
- Height 0.04325,
-
- BackdropTileBackground,
- BackdropBackground "UI\Widgets\ToolTips\Human\human-tooltip-background.blp",
- BackdropCornerFlags "UL|UR|BL|BR|T|L|B|R",
- BackdropCornerSize 0.012,
- BackdropBackgroundSize 0.032,
- BackdropBackgroundInsets 0.004f 0.004f 0.004f 0.004f,
- BackdropEdgeFile "UI\Widgets\ToolTips\Human\human-tooltip-border.blp",
- BackdropBlendAll,
- }
- ————————————————
- 版权声明:本文为CSDN博主「CarlosX」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明。
复制代码
BUTTON 按钮同类控件 TEXTBUTTON
GLUETEXTBUTTON GLUEBUTTON(带声音)
代码很长,没关系,后面会用到继承,复用会方便很多
是否响应鼠标事件: Yes
演示 - 创建一个普通技能按钮 带有悬停高亮,按下,禁用,选中状态 宽64 高64
代码
- //创建一个普通技能按钮 带有悬停高亮,按下,禁用,选中状态 宽64 高64
- Frame "BUTTON" "Demo_Button"
- {
- Width 0.04,
- Height 0.04,
- //设置样式 悬停高亮 可获取鼠标焦点 HIGHLTGHTONFOCUS
- ControlStyle "AUTOTRACK|HIGHLIGHTONMOUSEOVER",
-
- //设置正常状态背景
- ControlBackdrop "Demo_ButtonBack",
- Frame "BACKDROP" "Demo_ButtonBack"
- {
- BackdropBackground "ReplaceableTextures\CommandButtons\BTN3M1.blp",
- BackdropBlendAll,
- }
- //设置禁用状态下背景
- ControlDisabledBackdrop "Demo_ButtonDisBack",
- Frame "BACKDROP" "Demo_ButtonDisBack"
- {
- BackdropBackground "ReplaceableTextures\PassiveButtons\PASBTNEnvenomedSpear.blp",
- BackdropBlendAll,
- }
- //设置按下状态下背景
- ControlPushedBackdrop "Demo_ButtonPushedBack",
- Frame "Backdrop" "Demo_ButtonPushedBack" {
- BackdropBackground "ReplaceableTextures\CommandButtonsDisabled\DISBTN3M1.blp",
- BackdropBlendAll,
- }
- //悬停鼠标高亮
- ControlMouseOverHighlight "Demo_ButtonHig",
- Frame "HIGHLIGHT" "Demo_ButtonHig" {
- HighlightType "FILETEXTURE",
- HighlightAlphaFile "UI\Widgets\EscMenu\Human\quest-button-highlight.blp",
- HighlightAlphaMode "ADD",
- /*LayerStyle "IGNORETRACKEVENTS", 用rgba创建一个颜色高亮蒙版
- HighlightColor 0.0 0.0 1.0 0.1,
- HighlightType "SHADE",*/
- }
- /*//鼠标焦点
- ControlFocusHighlight "Demo_ButtonFocusHig",
- Frame "HIGHLIGHT" "Demo_ButtonFocusHig"{
- HighlightType "FILETEXTURE",
- HighlightAlphaFile "UI\Widgets\Glues\GlueScreen-CampaignButton-KeyboardHighlight.blp",
- HighlightAlphaMode "ADD",
- }*/
-
-
- }
- ————————————————
- 版权声明:本文为CSDN博主「CarlosX」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明。
复制代码
演示TEXTBUTTON - 创建一个文本居右下按钮 带有悬停高亮,按下,禁用 宽64 高64
- //创建一个文本居右下按钮 带有悬停高亮,按下,禁用 宽64 高64
- Frame "TEXTBUTTON" "Demo_TextButton"
- {
- Width 0.04,
- Height 0.04,
-
- //设置样式 悬停高亮 可获取鼠标焦点 HIGHLTGHTONFOCUS
- ControlStyle "AUTOTRACK|HIGHLIGHTONMOUSEOVER",
-
- //设置正常状态背景
- ControlBackdrop "Demo_ButtonBack",
- Frame "BACKDROP" "Demo_ButtonBack"
-
- {
- BackdropBackground "ReplaceableTextures\CommandButtons\BTN3M1.blp",
- BackdropBlendAll,
- }
- //设置禁用状态下背景
- ControlDisabledBackdrop "Demo_ButtonDisBack",
- Frame "BACKDROP" "Demo_ButtonDisBack"
- {
- BackdropBackground "ReplaceableTextures\PassiveButtons\PASBTNEnvenomedSpear.blp",
- BackdropBlendAll,
- }
- //设置按下状态下背景
- ControlPushedBackdrop "Demo_ButtonPushedBack",
- Frame "Backdrop" "Demo_ButtonPushedBack" {
- BackdropBackground "ReplaceableTextures\CommandButtonsDisabled\DISBTN3M1.blp",
- BackdropBlendAll,
- }
- //悬停鼠标高亮
- ControlMouseOverHighlight "Demo_ButtonHig",
- Frame "HIGHLIGHT" "Demo_ButtonHig" {
- HighlightType "FILETEXTURE",
- HighlightAlphaFile "UI\Widgets\EscMenu\Human\quest-button-highlight.blp",
- HighlightAlphaMode "ADD",
- }
- //文本
- ButtonText "Demo_ButtonText",
- Frame "TEXT" "Demo_ButtonText"{
- DecorateFileNames,
- FrameFont "MasterFont", 0.015, "",
- //设置文本对齐右下
- FontJustificationH JUSTIFYRIGHT,
- FontJustificationV JUSTIFYBOTTOM,
- FontFlags "FIXEDSIZE",
- FontColor 1.0 1.0 1.0 1.0,
- FontHighlightColor 1.0 1.0 1.0 1.0,
- FontDisabledColor 0.2 0.2 0.2 1.0,
- FontShadowColor 0.0 0.0 0.0 0.9,
- FontShadowOffset 0.001 -0.001,
- Text "W",
- }
- }
- ————————————————
- 版权声明:本文为CSDN博主「CarlosX」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明。
复制代码
EDITBOX 输入框是否响应事件: Yes 演示 - 创建一个输入框 限制字数20
代码 - //创建一个输入框 限制字数20
- Frame "EDITBOX" "Demo_EditBox"
- {
- Width 0.18,
- Height 0.04,
- EditBorderSize 0.007,//设置边框大小
- EditCursorColor 1.0 1.0 1.0,//设置光标颜色
-
- ControlBackdrop "Demo_EditBoxBack",
- Frame "BACKDROP" "Demo_EditBoxBack" {
- BackdropTileBackground,
- BackdropBackground "UI\Widgets\BattleNet\bnet-inputbox-back.blp",
- BackdropCornerFlags "UL|UR|BL|BR|T|L|B|R",
- BackdropCornerSize 0.032,
- BackdropBackgroundInsets 0.004 0.004 0.004 0.004,
- BackdropEdgeFile "UI\Widgets\BattleNet\bnet-inputbox-border.blp",
- BackdropBlendAll,
- }
- }
- ————————————————
- 版权声明:本文为CSDN博主「CarlosX」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明。
复制代码
SPRITE 模型
是否响应事件: No 同类控件 MODEL
这里用2D模型演示,支持3d模型需要修改模型为无阴影,缩放大小,修改角度为平面角度 演示 - 创建一个2d模型
- //创建一个2d模型
- Frame "SPRITE" "Demo_Sprite"
- {
- BackgroundArt "UI\Glues\BattleNet\ProgressBar\BattlenetProgressBar.mdl",
- }
复制代码
SLIDER 滚动条同类控件 SCROLLBAR
是否响应事件: Yes 演示 - 创建一个水平滚动条
- //创建一个水平滚动条
- Frame "SLIDER" "Demo_Slider" {
- Height 0.01,
- Width 0.23725,
-
- SliderMinValue 0,
- SliderMaxValue 1,
- SliderInitialValue 0,
- SliderStepSize 0.01,
- SliderLayoutHorizontal, //SliderLayoutVertical 设置为垂直滚动条
-
- //设置滚动条背景
- ControlBackdrop "Demo_SliderBackdrop",
- Frame "BACKDROP" "Demo_SliderBackdrop" {
- BackdropTileBackground,
- BackdropBackground "UI\Widgets\Glues\GlueScreen-Slider-BackdropBackground.blp",
- BackdropCornerFlags "UL|UR|BL|BR|T|L|B|R",
- BackdropCornerSize 0.008,
- BackdropBackgroundInsets 0.004 0.004 0.004 0.004,
- BackdropEdgeFile "UI\Widgets\Glues\GlueScreen-Slider-BackdropBorder.blp",
- BackdropBlendAll,
- }
- //设置滚动条按钮
- SliderThumbButtonFrame "DemoSlider_Button",
- Frame "BUTTON" "DemoSlider_Button" {
- Width 0.016,
- Height 0.016,
-
- ControlBackdrop "DemoSlider_ButtonBackdrop",
- Frame "BACKDROP" "DemoSlider_ButtonBackdrop" {
- BackdropBlendAll,
- BackdropBackground "UI\Widgets\Glues\SinglePlayerSkirmish-ScrollBarKnob.blp",
- }
-
- ControlDisabledBackdrop "DemoSlider_ButtonDisabledBackdrop",
- Frame "BACKDROP" "DemoSlider_ButtonDisabledBackdrop" {
- BackdropBlendAll,
- BackdropBackground "UI\Widgets\Glues\SinglePlayerSkirmish-ScrollBarKnobDisabled.blp",
- }
- }
- }
- ————————————————
- 版权声明:本文为CSDN博主「CarlosX」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明。
复制代码 小技巧
获取原生控件
原生控件可以通过获取控件名字进行修改
通过控件名字和ID,下面我就简单的演示一下
其余原生控件也是这个技巧,比如攻击图标,护甲图标等
演示 - 控件类型(SIMPLEFRAME)隐藏单位面板 SimpleInfoPanelUnitDetail ID:0 文件路径:UI\SimpleInfoPanel.fdf
演示 - 控件类型(SIMPLEFRAME)隐藏训练单位面板 SimpleInfoPanelBuildingDetail ID:1
文件路径:UI\SimpleInfoPanel.fdf
自适应Tips
这个技巧必须固定宽,不算很大的缺点,原生Tips就是这样.
演示 具体实现在演示图
代码
- //tips模板 背景模板
- Frame "BACKDROP" "Demo_TipsBck"
- {
- BackdropTileBackground,
- BackdropBackground "UI\Widgets\ToolTips\Human\human-tooltip-background.blp",
- BackdropBlendAll,
- }
- ————————————————
- 版权声明:本文为CSDN博主「CarlosX」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明。
复制代码
这套是我之前做的TJ图,根据文本自适应宽高比上面那套更完美
演示图:
DemoCSDN.w3x
(24.12 KB, 下载次数: 461)
|