[
{
"group": "Layout",
"name": "ULinearLayout",
"alias": "线性布局",
"title": "线性布局",
"concept": "ViewComponentDeclaration",
"kebabName": "u-linear-layout",
"description": "内部元素按照一定的规则布局",
"icon": "linear-layout",
"tsTypeParams": "",
"props": [
{
"concept": "PropDeclaration",
"group": "主要属性",
"bindHide": true,
"tabKind": "style",
"setter": {
"concept": "CapsulesSetter",
"options": [
{
"title": "行内",
"icon": "layout-inline-block",
"tooltip": "内联布局",
"value": "inline"
},
{
"title": "块级",
"icon": "layout-block",
"tooltip": "块级布局",
"value": "block"
},
{
"title": "弹性",
"icon": "layout-flex",
"tooltip": "弹性布局",
"value": "flex"
}
]
},
"name": "mode",
"title": "布局模式",
"tsType": "'inline' | 'block' | 'flex'",
"defaultValue": {
"concept": "DefaultValue",
"expression": {
"concept": "StringLiteral",
"value": "block"
},
"playground": []
},
"tooltipLink": "http://help.lcap.163yun.com/1.%E5%BC%80%E5%8F%91%E5%BA%94%E7%94%A8/2.%E9%A1%B5%E9%9D%A2/05.PC%E9%A1%B5%E9%9D%A2%E5%9F%BA%E7%A1%80%E7%BB%84%E4%BB%B6/01.%E5%B8%83%E5%B1%80/020.%E7%BA%BF%E6%80%A7%E5%B8%83%E5%B1%80.html",
"docDescription": "内联布局:将当前元素修改为内联布局模式,各个内联布局模式的元素将默认排布在同一行中,若空间不足以排布下一个内联布局元素,则该元素将会换行。\n块级布局:将当前元素修改为块级布局模式,各个块级布局模式的元素之前和之后均会换行。\n弹性布局:在弹性布局模式中,子元素可以在任何方向上排布,也可以“弹性伸缩”其尺寸,既可以增加尺寸以填满未使用的空间,也可以收缩尺寸以避免溢出父元素。",
"onChange": [
{
"clear": [
"justify",
"alignment",
"wrap",
"layout"
]
}
],
"tsOnChange": "[{\"clear\":[\"justify\",\"alignment\",\"wrap\",\"layout\"]}]"
},
{
"concept": "PropDeclaration",
"group": "主要属性",
"bindHide": true,
"tabKind": "style",
"setter": {
"concept": "CapsulesSetter",
"options": [
{
"title": "横向排列",
"icon": "flex-horizontal",
"tooltip": "横向",
"value": "horizontal"
},
{
"title": "纵向排列",
"icon": "flex-vertical",
"tooltip": "纵向",
"value": "vertical"
}
]
},
"name": "direction",
"title": "主轴方向",
"tsType": "'horizontal' | 'vertical'",
"defaultValue": {
"concept": "DefaultValue",
"expression": {
"concept": "StringLiteral",
"value": "horizontal"
},
"playground": []
},
"docDescription": "横向:内部子元素进行横向排布,建议内部子元素使用行内布局。\n纵向:内部子元素进行纵向排布,建议内部子元素使用块级布局。",
"onChange": [
{
"clear": [
"justify",
"alignment"
]
}
],
"tsOnChange": "[{\"clear\":[\"justify\",\"alignment\"]}]"
},
{
"concept": "PropDeclaration",
"group": "主要属性",
"bindHide": true,
"tabKind": "style",
"setter": {
"concept": "CapsulesSetter",
"options": [
{
"title": "左对齐",
"icon": "horizontal-justify-start",
"tooltip": "左对齐",
"value": "start"
},
{
"title": "居中对齐",
"icon": "horizontal-justify-center",
"tooltip": "居中对齐",
"value": "center"
},
{
"title": "右对齐",
"icon": "horizontal-justify-end",
"tooltip": "右对齐",
"value": "end"
},
{
"title": "平均分布(两端不留空)",
"icon": "horizontal-justify-space-between",
"tooltip": "平均分布(两端不留空)",
"if": "_ => _.mode === 'flex' || _.direction === 'horizontal'",
"tsIf": "_ => _.mode === 'flex' || _.direction === 'horizontal'",
"value": "space-between"
},
{
"title": "平均分布",
"icon": "horizontal-justify-space-around",
"tooltip": "平均分布",
"if": "_ => _.mode === 'flex'",
"tsIf": "_ => _.mode === 'flex'",
"value": "space-around"
}
]
},
"name": "justify",
"title": "横轴对齐",
"tsType": "'start' | 'center' | 'end' | 'space-between' | 'space-around'",
"defaultValue": {
"concept": "DefaultValue",
"expression": {
"concept": "StringLiteral",
"value": "start"
},
"playground": []
},
"docDescription": "主轴方向为横向时:支持左对齐、居中对齐、右对齐、平均分布(两端不留空)、平均分布,其中平均分布仅在弹性布局模式下展示。\n主轴方向为纵向时:支持左对齐、居中对齐、右对齐、占满容器宽度,其中占满容器宽度仅在弹性布局模式下展示。",
"if": "_ => _.direction === 'horizontal' || _.mode === 'inline' && _.direction === 'vertical' || _.mode === 'block' && _.direction === 'vertical'",
"onChange": [
{
"update": {
"gap": "normal"
},
"if": "_ => _ === 'space-between'"
},
{
"update": {
"gap": "normal"
},
"if": "_ => _ === 'space-around'"
}
],
"tsIf": "_ => _.direction === 'horizontal' || _.mode === 'inline' && _.direction === 'vertical' || _.mode === 'block' && _.direction === 'vertical'",
"tsOnChange": "[{\"update\":{\"gap\":\"normal\"},\"if\":\"_ => _ === 'space-between'\"},{\"update\":{\"gap\":\"normal\"},\"if\":\"_ => _ === 'space-around'\"}]"
},
{
"concept": "PropDeclaration",