fix:修改代码块缩进、代码块、json格式

This commit is contained in:
linyuzhe
2025-06-08 11:03:20 +08:00
parent 42d4b196b9
commit 3a1bc13871
6 changed files with 1056 additions and 946 deletions

View File

@@ -187,12 +187,12 @@ uv动画和序列帧动画都是uv起点属性的动画不同于其他属性
要表现一个属性动画需要先写一个Json数据块透明度动画举例如下相关参数会在下文详细描述
```json
{
{
"anim_type" : "alpha",
"duration" : 1.0,
"from" : 0.0,
"to" : 1.0
}
}
```
这段代码块代表一个控件在1秒钟内alpha值从0线性变化到1的属性动画为了将这个动画绑定到控件上一共有两种写法。
@@ -200,7 +200,7 @@ uv动画和序列帧动画都是uv起点属性的动画不同于其他属性
一种是将Json数据块直接赋给alpha属性
```json
{
{
"alphaImg" : {
"alpha" : {
"anim_type" : "alpha",
@@ -212,13 +212,13 @@ uv动画和序列帧动画都是uv起点属性的动画不同于其他属性
"type" : "image",
"visible" : true
}
}
}
```
另一种则是将属性动画写成自定义控件的形式写在UIjson文件的最外层在alpha属性值以 “@”+动画名 的形式进行赋值:
```json
{
{
"alphaImg" : {
"alpha" : "@show_alpha_ani",
"texture" : "textures/netease/common/image/default",
@@ -230,8 +230,8 @@ uv动画和序列帧动画都是uv起点属性的动画不同于其他属性
"duration" : 0.30,
"from" : 0.0,
"to" : 1.0
},
}
}
```
两种写法都能达成相同的效果,不同的是第二种写法能够被复用。
@@ -259,6 +259,7 @@ uv动画和序列帧动画都是uv起点属性的动画不同于其他属性
* 注2
```json
{
"alphaImg" : {
"alpha" : "@show_alpha_ani",
"texture" : "textures/netease/common/image/default",
@@ -284,8 +285,8 @@ uv动画和序列帧动画都是uv起点属性的动画不同于其他属性
"duration" : 0.30,
"from" : 1.0,
"to" : 0.0
},
}
}
```
### 透明度动画
@@ -301,6 +302,7 @@ uv动画和序列帧动画都是uv起点属性的动画不同于其他属性
![alpha动画](./picture/UIAnimation/alpha.gif)
```json
{
"alphaImg" : {
"alpha" : "@show_alpha_ani",
"texture" : "textures/netease/common/image/default",
@@ -326,8 +328,8 @@ uv动画和序列帧动画都是uv起点属性的动画不同于其他属性
"duration" : 0.30,
"from" : 1.0,
"to" : 0.0
},
}
}
```
### 裁剪动画
@@ -343,6 +345,7 @@ uv动画和序列帧动画都是uv起点属性的动画不同于其他属性
![clip动画](./picture/UIAnimation/clip.gif)
```json
{
"clipImg" : {
"clip_ratio" : {
"anim_type" : "clip",
@@ -353,8 +356,8 @@ uv动画和序列帧动画都是uv起点属性的动画不同于其他属性
"texture" : "textures/netease/common/image/default",
"type" : "image",
"visible" : true
},
}
}
```
### 颜色动画
@@ -370,6 +373,7 @@ uv动画和序列帧动画都是uv起点属性的动画不同于其他属性
![color动画](./picture/UIAnimation/color.gif)
```json
{
"colorImg" : {
"color": "@color_ani",
"texture" : "textures/netease/common/image/default",
@@ -381,8 +385,8 @@ uv动画和序列帧动画都是uv起点属性的动画不同于其他属性
"duration" : 1.0,
"from" : [1,0,0],
"to" : [0,0,1]
},
}
}
```
### 序列帧动画
@@ -402,6 +406,7 @@ uv动画和序列帧动画都是uv起点属性的动画不同于其他属性
![flipbook动画](./picture/UIAnimation/flipbook.gif)
```json
{
"flipbookImg" : {
"texture" : "textures/ui/my_eating_apple",
"type" : "image",
@@ -415,7 +420,8 @@ uv动画和序列帧动画都是uv起点属性的动画不同于其他属性
"frame_count": 36,
"fps": 10,
"reversible": false
},
}
}
```
当一个图片控件被用作序列帧的载体时,该控件的属性配置有以下规则需要遵守:
@@ -441,6 +447,7 @@ uv动画和序列帧动画都是uv起点属性的动画不同于其他属性
![offset动画](./picture/UIAnimation/offset.gif)
```json
{
"offsetImg" : {
"offset" : "@offset_ani",
"texture" : "textures/netease/common/image/default",
@@ -452,8 +459,8 @@ uv动画和序列帧动画都是uv起点属性的动画不同于其他属性
"duration" : 1.0,
"from" : [0, 0],
"to" : [0, 50]
},
}
}
```
**注**
@@ -477,6 +484,7 @@ uv动画和序列帧动画都是uv起点属性的动画不同于其他属性
![size动画](./picture/UIAnimation/size.gif)
```json
{
"sizeImg" : {
"size" : "@size_ani",
"texture" : "textures/netease/common/image/default",
@@ -488,8 +496,8 @@ uv动画和序列帧动画都是uv起点属性的动画不同于其他属性
"duration" : 1.0,
"from" : [100, 100],
"to" : [150, 150]
},
}
}
```
**注**
@@ -513,6 +521,7 @@ uv动画和序列帧动画都是uv起点属性的动画不同于其他属性
![uv动画](./picture/UIAnimation/uv.gif)
```json
{
"sizeImg" : {
"uv" : "@uv_ani",
"texture" : "textures/netease/common/image/default",
@@ -524,8 +533,8 @@ uv动画和序列帧动画都是uv起点属性的动画不同于其他属性
"duration" : 5,
"from" : [0, 0],
"to" : [2240, 0]
},
}
}
```

View File

@@ -248,13 +248,13 @@ shootButton的锚点位移XY尺寸XY的参考属性如下。按照这种
3. 然后激活(显示)对应的界面预设
```python
def InitClient(self):
def InitClient(self):
import mod.client.extraClientApi as clientApi
self.ListenForEngineEvent(UiInitFinishedEvent, self, self.OnUIInitFinished)
```
```python
def OnUIInitFinished(self, args):
def OnUIInitFinished(self, args):
import mod.client.extraClientApi as clientApi
if clientApi.GetPlatform() == 0:
uiNodePreset = self.GetParent().GetChildPresetsByName("PC版UI界面")[0]

View File

@@ -12,13 +12,12 @@ time: 分钟
* 示例中为"myUIName"
```json
myUIName.json
```html
myUIName.json
"namespace" : "myUIName"
myUIName.py
"namespace": "myUIName"
myUIName.py
```
## JSON编写说明
@@ -32,7 +31,9 @@ Json是UI界面的显示内容和绑定的集合UI是一种树状的组织结
命名空间是这个界面的名称我们规定json文件名和namespace一致。
```json
{
"namespace" : "myUIName"
}
```
### Main Screen
@@ -42,10 +43,12 @@ main是这个界面名称我们规定使用main即一个json文件是一
controls中的内容是该界面下的树状节点即子节点。
```json
{
"main@common.base_screen" : {
"controls" : [
]
}
}
```
| 变量 | 解释 |
@@ -87,6 +90,7 @@ path = "/panel0/text0"
为了适配异形屏我们可以展示screen中的内容通过引用的形式写在screen的$screen_content属性中。
```json
{
"main@common.base_screen" : {
"$screen_content":"myUIName.panel0"
},
@@ -103,6 +107,7 @@ path = "/panel0/text0"
"type" : "label",
"visible" : true
}
}
```
被$screen_content引用的内容其显示内容的范围不会被异形屏遮挡。此时text0的路径为
@@ -121,7 +126,8 @@ path = base_path + "/text0"
screen即画布控件是游戏中一个UI界面的根节点所有其他控件只有挂在画布下才能被正确显示出来。
```json
"main1" : {
{
"main1" : {
"absorbs_input" : true,
"always_accepts_input" : false,
"controls" : [
@@ -160,6 +166,7 @@ screen即画布控件是游戏中一个UI界面的根节点所有其他
"type" : "panel",
"visible" : true
}
}
```
| <div style="width:100px">变量</div> | 解释 |
@@ -251,6 +258,7 @@ absorbs_input暂时无法生效等待后续修复。
Label 是文本框控件用来显示文本信息默认的字体是MC字体如果有中文会变成中文字体格式暂时不支持换字体可以通过接口统一设置字体如果需要设置后续有介绍。
```json
{
"label0" : {
"anchor_from" : "center",
"anchor_to" : "center",
@@ -267,7 +275,8 @@ Label 是文本框控件用来显示文本信息默认的字体是MC字体
"line_padding" : 0.0,
"type" : "label",
"visible" : true
},
}
}
```
| <div style="width:150px">变量</div> | 解释 |
| :------------: | ----------------------------------------------------------- |
@@ -315,6 +324,7 @@ Label 是文本框控件用来显示文本信息默认的字体是MC字体
Image是指图片控件具有图片裁剪图片九宫格颜色叠加uv偏移旋转显示的额外属性。
```json
{
"image0" : {
"anchor_from" : "center",
"anchor_to" : "center",
@@ -338,7 +348,8 @@ Image是指图片控件具有图片裁剪图片九宫格颜色叠加
"rotate_pivot": [0.5, 0.5],
"rotate_angle": 0,
"visible" : true
},
}
}
```
| <div style="width:150px">变量</div> | 解释 |
@@ -456,6 +467,7 @@ Button 是按钮控件同时含有Image和Label。按钮有三种状态
* controls表示控制的子节点
```json
{
"button0@common.button" : {
"$default_texture" : "textures/netease/common/button/default",
"$hover_texture" : "textures/netease/common/button/hover",
@@ -550,7 +562,8 @@ Button 是按钮控件同时含有Image和Label。按钮有三种状态
"nine_slice_top" : "$nine_slice_top",
"texture" : "$pressed_texture",
"type" : "image"
},
}
}
```
| <div style="width:200px">变量</div> | 解释 |
@@ -587,6 +600,7 @@ Button 是按钮控件同时含有Image和Label。按钮有三种状态
panel为面板控件主要是用来将控件进行分类和管理类似文件夹。
```json
{
"panel" : {
"anchor_from" : "center",
"anchor_to" : "center",
@@ -596,6 +610,7 @@ panel为面板控件主要是用来将控件进行分类和管理类似文
"type" : "panel",
"visible" : true
}
}
```
| 变量 | 解释 |
@@ -609,7 +624,8 @@ panel为面板控件主要是用来将控件进行分类和管理类似文
input_panel与panel类似可以用来放置其他控件但除此之外还可以用来拖动或实现“模态框”功能。
```json
"InputPanel" : {
{
"InputPanel" : {
"anchor_from" : "top_left",
"anchor_to" : "top_left",
"button_mappings": [
@@ -628,6 +644,7 @@ input_panel与panel类似可以用来放置其他控件但除此之外还
"size" : [ 198.0, 137.0 ],
"type" : "input_panel",
"visible" : true
}
}
```
@@ -681,23 +698,28 @@ InputPanel维护着一个拖拽偏移量它代表着在整个拖拽过程中
布局面板,用于自动布局该控件的子控件
```json
"stack_panel0": {
{
"stack_panel0": {
"layer": 1,
"orientation": "horizontal",
"size": [100, 100],
"type": "stack_panel",
"controls": [{
"controls": [
{
"panel_0": {
"type": "panel",
"size": [2, 2]
}
}, {
},
{
"fill_0": {
"type": "panel",
"size": ["fill", 1]
}
}]
},
}
]
}
}
```
| 变量 | 解释 |
@@ -725,6 +747,7 @@ InputPanel维护着一个拖拽偏移量它代表着在整个拖拽过程中
TextEditBox是输入框控件用来输入文字信息可以获取输入内容设置输入框内容触发输入中和输入完成事件设置最大输入值等。下面的示例展示了一个搜索框的信息。
```json
{
"text_edit_box0@common.text_edit_box" : {
"$edit_box_default_texture" : "textures/ui/edit_box_indent",
"$edit_box_hover_texture" : "textures/ui/edit_box_indent_hover",
@@ -769,7 +792,8 @@ TextEditBox是输入框控件用来输入文字信息可以获取输入内
"nine_slice_top" : "$nine_slice_top",
"texture" : "$edit_box_hover_texture",
"type" : "image"
},
}
}
```
| <div style="width:150px">变量</div> | 解释 |
@@ -788,6 +812,11 @@ TextEditBox是输入框控件用来输入文字信息可以获取输入内
* 注1
```python
import mod.client.extraClientApi as clientApi
ViewBinder = clientApi.GetViewBinderCls()
ViewRequest = clientApi.GetViewViewRequestCls()
ScreenNode = clientApi.GetScreenNodeCls()
class TestScreen(ScreenNode):
def __init__(self, namespace, name, param):
ScreenNode.__init__(self, namespace, name, param)
@@ -803,7 +832,6 @@ class TestScreen(ScreenNode):
@ViewBinder.binding(ViewBinder.BF_BindString)
def ReturnTextString(self):
return self.text
```
* 注2
@@ -843,7 +871,8 @@ PC和IOS平台没有这个问题
该控件可以用于在ui上显示骨骼模型
```json
"paper_doll0" : {
{
"paper_doll0" : {
"anchor_from" : "center",
"anchor_to" : "center",
"animation" : "",
@@ -857,7 +886,8 @@ PC和IOS平台没有这个问题
"type" : "custom",
"visible" : true,
"enable_scissor_test" : false,
},
}
}
```
| <div style="width:100px">变量</div> | 解释 |
| :----------: | ----------------------------------------------------------- |
@@ -891,7 +921,8 @@ PC和IOS平台没有这个问题
3生物类型原版模型展示。
```json
"paper_doll0" : {
{
"paper_doll0" : {
"anchor_from" : "center",
"anchor_to" : "center",
"layer" : 22,
@@ -903,7 +934,8 @@ PC和IOS平台没有这个问题
"size" : [ 100, 100 ],
"type" : "custom",
"visible" : true,
"enable_scissor_test" : false,
"enable_scissor_test" : false
}
}
```
@@ -934,7 +966,7 @@ param = {
"init_rot_y": 60, # 初始朝向
"molang_dict": {"variable.liedownamount": 1} # molang变量dict其中key为字符串value为float类型
}
uiNode.RenderPaperDoll(path, param)
self.GetBaseUIControl(path).asNeteasePaperDoll().RenderEntity(param)
```
2渲染骨骼模型
@@ -947,7 +979,7 @@ param = {
"animation": "fengxi", # 动画名称
"animation_looped": False, # 是否循环播放
}
uiNode.RenderPaperDoll(path, param)
self.GetBaseUIControl(path).asNeteasePaperDoll().RenderSkeletonModel(param)
```
3渲染原版生物模型不需要生物实例
@@ -960,7 +992,7 @@ param = {
"init_rot_y": 60,
"molang_dict": {"variable.state": 2, "variable.liedownamount": 1} # 通过molang变量来调整渲染效果坐下的猫
}
uiNode.RenderPaperDoll(path, param)
self.GetBaseUIControl(path).asNeteasePaperDoll().RenderEntity(param)
```
使用注意事项:
@@ -981,7 +1013,8 @@ uiNode.RenderPaperDoll(path, param)
该控件可以用于在ui上显示物品
```json
"item_renderer0" : {
{
"item_renderer0" : {
"anchor_from" : "center",
"anchor_to" : "center",
"layer" : 1,
@@ -993,7 +1026,8 @@ uiNode.RenderPaperDoll(path, param)
"size" : [ 100, 100 ],
"type" : "custom",
"visible" : true
},
}
}
```
| <div style="width:100px">变量</div> | 解释 |
| :----------: | ----------------------------------------------------------- |
@@ -1026,6 +1060,7 @@ uiNode.RenderPaperDoll(path, param)
该控件是可以滑动的窗口,需要有其他控件附属。
```json
{
"scroll_view0@common.scrolling_panel" : {
"$background_nine_slice_buttom" : 0,
"$background_nine_slice_left" : 0,
@@ -1061,7 +1096,8 @@ uiNode.RenderPaperDoll(path, param)
"size" : [ 100, 80 ],
"type" : "scroll_view",
"visible" : true
},
}
}
```
|<div style="width:100px">变量</div> | 解释 |
@@ -1126,6 +1162,7 @@ mouse_path = scroll_view_path + "/scroll_mouse/scroll_view/stack_panel/backgroun
Grid组件属于网格型的排列可以依附在滚动条中用来实现背包等功能。
```json
{
"grid0" : {
"anchor_from" : "center",
"anchor_to" : "center",
@@ -1151,7 +1188,8 @@ Grid组件属于网格型的排列可以依附在滚动条中用来实现
"uv" : [ 0, 0 ],
"uv_size" : [ 107, 107 ],
"visible" : true
},
}
}
```
| <div style="width:100px">变量</div> | 解释 |
@@ -1186,6 +1224,7 @@ Grid组件属于网格型的排列可以依附在滚动条中用来实现
3. grid控件不建议使用其子控件路径对其动态生成的格子控件直接进行SetVisible等操作因为在每次界面刷新时grid控件会对所有的格子做一次数据更新更新的过程中会强制将格子可见性置True。如果有需要对格子进行操作可以使用数据绑定的方式如下代码和json。需要注意的是在数据绑定的回调函数中需要明确grid本身是否可见否则会造成grid子节点控件的可见性数据异常从而影响界面操作逻辑。
```json
{
"grid1" : {
"anchor_from" : "center",
"anchor_to" : "center",
@@ -1209,18 +1248,23 @@ Grid组件属于网格型的排列可以依附在滚动条中用来实现
}
],
"visible" : "#UIDemo.visible"
},
}
}
```
```python
import mod.client.extraClientApi as clientApi
ViewBinder = clientApi.GetViewBinderCls()
ViewRequest = clientApi.GetViewViewRequestCls()
ScreenNode = clientApi.GetScreenNodeCls()
class UIDemoScreen(ScreenNode):
def __init__(self, namespace, name, param):
ScreenNode.__init__(self, namespace, name, param)
self.demoGridControl = None
......
def Create(self):
self.demoGridControl = self.GetBaseUIControl("/grid1")
......
@ViewBinder.binding_collection(ViewBinder.BF_BindBool, "gridDemo", "#UIDemo.visible")
def GridItemVisible(self, index):
@@ -1233,6 +1277,7 @@ class UIDemoScreen(ScreenNode):
ProgressBar进度条控件用于百分比显示进度
```json
{
"progress_bar0" : {
"$clip_direction" : "left",
"$clip_ratio" : 0.0,
@@ -1281,7 +1326,8 @@ ProgressBar进度条控件用于百分比显示进度
"nine_slice_top" : "$nine_slice_top",
"texture" : "$progress_bar_filled_texture",
"type" : "image"
},
}
}
```
| <div style="width:200px">变量</div> | 解释 |
@@ -1312,7 +1358,8 @@ ProgressBar进度条控件用于百分比显示进度
开关控件,用于两个状态之间的切换
```json
"switch_toggle0@common_toggles.switch_toggle_collection" : {
{
"switch_toggle0@common_toggles.switch_toggle_collection" : {
"$default_texture" : "textures/ui/toggle_off",
"$hover_texture" : "textures/ui/toggle_on",
"$pressed_no_hover_texture" : "textures/ui/toggle_on_hover",
@@ -1333,7 +1380,8 @@ ProgressBar进度条控件用于百分比显示进度
"size" : [ 100, 100 ],
"type" : "panel",
"visible" : true
},
}
}
```
| <div style="width:200px">变量</div> | 解释 |
@@ -1348,6 +1396,11 @@ ProgressBar进度条控件用于百分比显示进度
* 注1
```python
import mod.client.extraClientApi as clientApi
ViewBinder = clientApi.GetViewBinderCls()
ViewRequest = clientApi.GetViewViewRequestCls()
ScreenNode = clientApi.GetScreenNodeCls()
class TestScreen(ScreenNode):
def __init__(self, namespace, name, param):
ScreenNode.__init__(self, namespace, name, param)
@@ -1381,10 +1434,11 @@ class TestScreen(ScreenNode):
滑动条控件,用于拖动设置进度或百分比。
```json
"slider0@common.slider": {
{
"slider0@common.slider": {
"$slider_tts_text_value": "#netease_tts_text_value",
"$slider_name": "#UIDemoScreen.OnDemoSliderChange",
"$slider_value_binding_name":"#UIDemoScreen.ReturnSliderValue",
"$slider_value_binding_name": "#UIDemoScreen.ReturnSliderValue",
"$slider_steps_binding_name": "#UIDemoScreen.ReturnSliderStep",
"$background_default_control": "common.slider_background",
"$progress_default_control": "common.slider_progress",
@@ -1397,16 +1451,17 @@ class TestScreen(ScreenNode):
"$slider_box_hover_layout": "common.slider_button_hover_layout",
"$slider_box_locked_layout": "common.slider_button_locked_layout",
"$slider_box_indent_layout": "common.slider_button_indent_layout",
"$slider_box_size": [ 10, 16 ],
"size": [ 100, 10 ],
"offset": [ 0, 0 ],
"$slider_box_size": [10, 16],
"size": [100, 10],
"offset": [0, 0],
"$slider_step_factory_control_ids": {
"slider_step": "@common.slider_step",
"slider_step_hover": "@common.slider_step_hover",
"slider_step_progress": "@common.slider_step_progress",
"slider_step_progress_hover": "@common.slider_step_progress_hover"
},
}
}
}
```
| <div style="width:200px">变量</div> | 解释 |
@@ -1436,6 +1491,11 @@ class TestScreen(ScreenNode):
* 注1
```python
import mod.client.extraClientApi as clientApi
ViewBinder = clientApi.GetViewBinderCls()
ViewRequest = clientApi.GetViewViewRequestCls()
ScreenNode = clientApi.GetScreenNodeCls()
class UIDemoScreen(ScreenNode):
def __init__(self, namespace, name, param):
ScreenNode.__init__(self, namespace, name, param)
@@ -1630,11 +1690,13 @@ hover事件的触发本质上是与鼠标悬浮相关在PC模式中当鼠
```json
{
"main" : {
"controls" : [],
"type" : "screen",
"gamepad_cursor_deflection_mode": true
},
}
}
```
@@ -1644,7 +1706,8 @@ hover事件的触发本质上是与鼠标悬浮相关在PC模式中当鼠
网易版单选下拉框,可以在给定的选项中进行选择。
```json
"comboBoxPanel@combo_box.comboBoxPanel" : {
{
"comboBoxPanel@combo_box.comboBoxPanel" : {
"$content_size":[ "100.0%+0.0px", 100 ],
"$item_size":[ "100.0%+0.0px", "10.0%x+0.0px" ],
"$title_label":"combo_box.titleLabel",
@@ -1676,6 +1739,7 @@ hover事件的触发本质上是与鼠标悬浮相关在PC模式中当鼠
"type" : "panel",
"visible" : true
}
}
```
@@ -1712,7 +1776,8 @@ UI编辑器暂时不支持编辑
其中官方封装了地图界面基类<a href="../../mcdocs/1-ModAPI/接口/自定义UI/UI界面.html#minimapbasescreen" rel="noopenner"> MiniMapBaseScreen </a>供开发者扩展。
```json
"mainPanel@mini_map.mini_map_wrapper" : {
{
"mainPanel@mini_map.mini_map_wrapper" : {
"anchor_from" : "top_right",
"anchor_to" : "top_right",
"layer" : 1,
@@ -1722,7 +1787,7 @@ UI编辑器暂时不支持编辑
"$use_default_face_icon": true,
"$face_icon_size": [4,4],
"$face_icon_bg_color": "white",
"$highest_y": 0
"$highest_y": 0,
// 如果希望小地图能够被裁剪请继承后修改controls如下:
"controls":[
{
@@ -1744,6 +1809,7 @@ UI编辑器暂时不支持编辑
"text_lbl@mini_map.text_label": {}
}
]
}
}
```
@@ -1764,12 +1830,14 @@ UI编辑器暂时不支持编辑
该控件可以用于在ui上绘制渐变颜色
```json
"gradient": {
{
"gradient": {
"color1": [1, 0, 1, 1],
"color2": [0, 0, 1, 1],
"gradient_direction": "vertical",
"renderer": "gradient_renderer",
"type": "custom"
}
}
```
@@ -1874,6 +1942,10 @@ ScreenNode = clientApi.GetScreenNodeCls()
### UI界面初始化
```python
import mod.client.extraClientApi as clientApi
ScreenNode = clientApi.GetScreenNodeCls()
class TestScreen(ScreenNode):
def __init__(self, namespace, name, param):
ScreenNode.__init__(self, namespace, name, param)
@@ -1888,7 +1960,7 @@ class ViewBinder(object):
BF_ButtonClickUp = 0 | ButtonFilter
BF_ButtonClickDown = 1 | ButtonFilter
BF_ButtonClick = 2 | ButtonFilter
BF_ButtonClickCancel= 3
BF_ButtonClickCancel = 3
BF_InteractButtonClick = 4
BindFilter = 0x01000000
BF_BindBool = 5 | BindFilter
@@ -1902,6 +1974,7 @@ class ViewBinder(object):
BF_EditFinished = 12 | EditFilter
ToggleFilter = 0x00010000
BF_ToggleChanged = 13 | ToggleFilter
# Return Type
class ViewRequest(object):
Nothing = 0
@@ -1909,7 +1982,6 @@ class ViewRequest(object):
PointerHeldEventsRequest = 1 << 1
PointerHeldEventsCancel = 1 << 2
Exit = 1 << 3
```
### UI绑定和返回
@@ -1940,18 +2012,24 @@ bind_flag为上文中绑定类型binding_name为绑定名称。
binding_name为脚本绑定变量binding_name_override为引擎变量json格式如下
```json
"bindings" : [
{
"bindings": [
{
"binding_condition" : "always",
"binding_name" : "#scoreboard_grid.item_count",
"binding_name_override" : "#StackGridItemsCount"
}
]
}
```
对应的Python代码如下
```python
@ViewBinder.binding(ViewBinder.BF_BindInt, "#scoreboard_grid.item_count")
def OnStarkGridResize(self):
import mod.client.extraClientApi as clientApi
ViewBinder = clientApi.GetViewBinderCls()
@ViewBinder.binding(ViewBinder.BF_BindInt, "#scoreboard_grid.item_count")
def OnStarkGridResize(self):
return len(self.scoreBoardList)
```
@@ -1962,12 +2040,15 @@ bind_flag为上文中的绑定类型collection_name为集合名称binding_
集合的json如下
```json
"collection_name" : "scoreboard_stackgrid"
{
"collection_name" : "scoreboard_stackgrid"
}
```
在集合的子控件中binding_collection_name为集合名binding_condition为绑定条件binding_name为绑定名称binding_type为collection绑定property_bag设置他的初始值text为它的绑定值。
```json
{
"label_score_board" : {
"bindings" : [
{
@@ -1985,14 +2066,19 @@ bind_flag为上文中的绑定类型collection_name为集合名称binding_
"text_alignment" : "left",
"type" : "label",
"visible" : true
},
}
}
```
对应的Python代码如下其中index表示在集合中的哪一元素。
```python
@ViewBinder.binding_collection(ViewBinder.BF_BindString, "scoreboard_stackgrid", "#label_score_board.text")
def OnRefreshScoreBoardLabel(self, index):
import mod.client.extraClientApi as clientApi
ViewBinder = clientApi.GetViewBinderCls()
@ViewBinder.binding_collection(ViewBinder.BF_BindString, "scoreboard_stackgrid", "#label_score_board.text")
def OnRefreshScoreBoardLabel(self, index):
return self.scoreBoardList[index] if len(self.scoreBoardList) > index else ""
```
@@ -2009,8 +2095,9 @@ bind_flag为上文中的绑定类型collection_name为集合名称binding_
假设设置Mod名称为"myModName",示例:
```python
@Mod.Binding(name = "myModName", version = "0.1")
class MyModClass(object):
from mod.common.mod import Mod
@Mod.Binding(name = "myModName", version = "0.1")
class MyModClass(object):
def __init__(self):
pass
```
@@ -2089,7 +2176,7 @@ bind_flag为上文中的绑定类型collection_name为集合名称binding_
使用方法如下所示
```json
```html
// 定制化文本控件
<label>
{"text" : "玩<br>家一",
@@ -2099,12 +2186,12 @@ bind_flag为上文中的绑定类型collection_name为集合名称binding_
</label>
```
```json
```html
// 在非标签的内容
Dear player, <br>welcome to Minecraft, <br>where you can build your own world
```
```json
```html
// 按钮控件
// 注意:如果按钮控件空间不足以显示该字符串,多余部分将以"..."显示
<button>
@@ -2117,7 +2204,7 @@ Dear player, <br>welcome to Minecraft, <br>where you can build your own world
例子及效果:
```json
```html
<label>{"text" : "玩<br>家一", "font" : "smooth", "scale": 3, "color": [1,0,0,1]}</label><br><button>{"button_label": "1<br>2<br>3", "press_texture" : "textures/ui/btn_pressed","hover_texture" : "textures/ui/btn_hover","default_texture" : "textures/ui/btn_light_default","x":50, "y":100}</button>:恭喜!<br>击杀了<link>{"text" : "末影人", "format_code":"§2"}</link>
```
@@ -2125,35 +2212,40 @@ Dear player, <br>welcome to Minecraft, <br>where you can build your own world
#### 定制化文本控件
在字符串中嵌入`<label>label_data</label>`样式文本会被解析成定制文本与常规文本不同的是定制化文本可以独立设置文字的字体、大小、颜色等丰富富文本的文本样式。label_data为特殊化数据以下所列属性为必须属性text为文本font为字体默认值为unicodescale为字体缩放倍率默认值为1.0color为字体颜色默认值为[1,1,1,1]。需要注意的是如果文本中存在中文字符则字体会被强制设置为unicode此外如果字体缩放倍率过大该段文本将不会被显示。
在字符串中嵌入`<label>"label_data"</label>`样式文本会被解析成定制文本与常规文本不同的是定制化文本可以独立设置文字的字体、大小、颜色等丰富富文本的文本样式。label_data为特殊化数据以下所列属性为必须属性text为文本font为字体默认值为unicodescale为字体缩放倍率默认值为1.0color为字体颜色默认值为[1,1,1,1]。需要注意的是如果文本中存在中文字符则字体会被强制设置为unicode此外如果字体缩放倍率过大该段文本将不会被显示。
```json
label_data{
{
"label_data": {
"text" : "玩家一",
"font" : "smooth",
"scale": 3,
"color": [1,0,0,1]
}
}
```
#### 图片控件
在字符串中嵌入`<image>image_data</image>`样式文本会被解析成图片image_data为特殊化数据以下所列属性为必须属性texture为资源路径x为图片宽度y为图片高度
在字符串中嵌入`<image>"image_data"</image>`样式文本会被解析成图片image_data为特殊化数据以下所列属性为必须属性texture为资源路径x为图片宽度y为图片高度
```json
image_data{
{
"image_data": {
"texture":"texture/ui/laugh",
"x":30,
"y":30
}
}
```
#### 按钮
在字符串中嵌入`<button>button_data</button>`样式会被解析成按钮button_data为特殊化数据开发者可以在其中添加符合json格式的自定义数据在点击富文本中对应按钮时会将button_data通过回调函数整个返回以下属性为必须属性press_texture为按钮按下贴图hover_texture为按钮鼠标悬浮贴图default_texture为默认状态下按钮贴图button_label为按钮上的问题x为按钮宽度y为按钮高度
在字符串中嵌入`<button>"button_data"</button>`样式会被解析成按钮button_data为特殊化数据开发者可以在其中添加符合json格式的自定义数据在点击富文本中对应按钮时会将button_data通过回调函数整个返回以下属性为必须属性press_texture为按钮按下贴图hover_texture为按钮鼠标悬浮贴图default_texture为默认状态下按钮贴图button_label为按钮上的问题x为按钮宽度y为按钮高度
```json
button_data:{
{
"button_data":{
"press_texture": "",
"hover_texture": "",
"default_texture": "",
@@ -2161,25 +2253,29 @@ Dear player, <br>welcome to Minecraft, <br>where you can build your own world
"x":20,
"y":20
}
}
```
#### 超链接
在字符串中嵌入`<link>link_data</link>`样式会被解析成超链接外观和普通文本无异但可以被点击link_data为特殊化数据开发者可以在其中添加符合json格式的自定义数据在点击富文本中对应超链接时会将link_data通过回调函数整个返回以下属性为必须属性text表示显示文本format_code表示该段显示文本的样式代码注意基岩版的文本控件不支持下划线和删除线。
在字符串中嵌入`<link>"link_data"</link>`样式会被解析成超链接外观和普通文本无异但可以被点击link_data为特殊化数据开发者可以在其中添加符合json格式的自定义数据在点击富文本中对应超链接时会将link_data通过回调函数整个返回以下属性为必须属性text表示显示文本format_code表示该段显示文本的样式代码注意基岩版的文本控件不支持下划线和删除线。
```json
link_data:{
{
"link_data":{
"text":"末影人",
"format_code":"§2"
}
}
```
#### 序列帧动画
在字符串中嵌入`<sfx>sfx_data</sfx>`样式文本会被解析成图片sfx_data为特殊化数据以下所列属性为必须属性texture为资源路径x为显示图片宽度y为显示图片高度uv_x为截取图片宽度uv_y为截取图片高度frame_count表示该序列帧的总帧数fps为每秒执行帧数。
在字符串中嵌入`<sfx>"sfx_data"</sfx>`样式文本会被解析成图片sfx_data为特殊化数据以下所列属性为必须属性texture为资源路径x为显示图片宽度y为显示图片高度uv_x为截取图片宽度uv_y为截取图片高度frame_count表示该序列帧的总帧数fps为每秒执行帧数。
```json
sfx_data:{
{
"sfx_data":{
"texture": "textures/ui/eating_apple",
"x":30,
"y":30,
@@ -2188,6 +2284,7 @@ Dear player, <br>welcome to Minecraft, <br>where you can build your own world
"frame_count": 36,
"fps": 10
}
}
```
### 富文本成品范例
@@ -2229,6 +2326,7 @@ Dear player, <br>welcome to Minecraft, <br>where you can build your own world
开发者可以设置富文本的文本字体颜色,默认值为[1,1,1],白色
```json
{
"main" : {
"absorbs_input" : true,
"always_accepts_input" : false,
@@ -2250,7 +2348,8 @@ Dear player, <br>welcome to Minecraft, <br>where you can build your own world
"$rich_panel_font_size" : "large",
"$rich_panel_font_scale_factor" : 2.0,
"$rich_panel_color" : [1,1,1]
},
}
}
```
#### python脚本编写
@@ -2278,7 +2377,7 @@ Dear player, <br>welcome to Minecraft, <br>where you can build your own world
以下是示例
```python
def CreateRichText(self):
def CreateRichText(self):
self.richTextPath = "/RichTextPanel"
self.richTextItem = self.GetRichTextItem(self.richTextPath)
self.richTextItem.registerLinkItemClickCallback(self.OnLinkItemClickCallback)
@@ -2286,13 +2385,13 @@ Dear player, <br>welcome to Minecraft, <br>where you can build your own world
self.richTextItem.registerRichTextFinishCallback(self.OnRichTextCreateFinishCallback)
self.richTextItem.readRichText('[玩家]<label>{"text" : "玩家一", "font" : "smooth", "scale": 3, "color": [1,0,0,1]}</label><button>{"press_texture" : "textures/ui/btn_pressed","hover_texture" : "textures/ui/btn_hover","default_texture" : "textures/ui/btn_light_default","x":20, "y":20}</button>:恭喜!<image>{"texture":"textures/ui/skin/ty_yuanshenghuli_0_0", "x":30, "y":30}</image>击杀了<link>{"text" : "末影人", "format_code":"§2"}</link><sfx>{"texture": "textures/ui/eating_apple","x":30, "y":30,"uv_x": 64,"uv_y": 64,"frame_count": 36,"fps": 10}</sfx>')
def OnButtonItemClickCallback(self, data, touchX, touchY):
def OnButtonItemClickCallback(self, data, touchX, touchY):
print("---OnButtonItemClickCallback---", data, touchX, touchY)
def OnLinkItemClickCallback(self, data, touchX, touchY):
def OnLinkItemClickCallback(self, data, touchX, touchY):
print("---OnLinkItemClickCallback---", data, touchX, touchY)
def OnRichTextCreateFinishCallback(self):
def OnRichTextCreateFinishCallback(self):
print("---OnRichTextCreateFinishCallback---")
```

View File

@@ -23,8 +23,8 @@ sidebarDepth: 1
ScreenNode的一些有用的函数界面Node节点的获取方式在[UI使用文档](30-UI说明文档.html)中有详细说明。
```python
import mod.client.extraClientApi as clientApi
uiNode = clientApi.GetUI("myModName", "myUIName")
import mod.client.extraClientApi as clientApi
uiNode = clientApi.GetUI("myModName", "myUIName")
```
假设下文中的函数uiNode为获取到的ScreenNode继承类调用的UI界面是按下面的节点树组织结构的

View File

@@ -116,8 +116,10 @@ CustomUIScreenProxy是原生界面的代理类可通过extraClientApi.GetUISc
- 示例
```python
# coding=utf-8
import client.extraClientApi as clientApi
CustomUIScreenProxy = clientApi.GetUIScreenProxyCls()
ViewBinder = clientApi.GetViewBinderCls()
class PauseScreenProxy(CustomUIScreenProxy):

View File

@@ -387,9 +387,9 @@ def OnItemToggleChecked(self, args):
toggleIndex = 0
self.mCurItemIndex = toggleIndex
itemDict = self.mItemData[self.mCurItemTab][toggleIndex]
self.SetSprite(self.mItemIcon, itemDict["icon"])
self.SetText(self.mItemName, itemDict["name"])
self.SetText(self.mItemDesc, itemDict["desc"])
self.GetBaseUIControl(self.mItemIcon).asImage().SetSprite(itemDict["icon"])
self.GetBaseUIControl(self.mItemName).asLabel().SetText(itemDict["name"])
self.GetBaseUIControl(self.mItemDesc).asLabel().SetText(itemDict["desc"])
self.set_control_visible(self.mItemInfoWrap, True)
```