|
|
@ -142,3 +142,43 @@ inset: "4 8" /* top/bottom left/right */ |
|
|
|
inset: "5 15 10" /* top left/right bottom */ |
|
|
|
inset: "5 15 10" /* top left/right bottom */ |
|
|
|
inset: "2 3 3 3" /* top right bottom left */ |
|
|
|
inset: "2 3 3 3" /* top right bottom left */ |
|
|
|
``` |
|
|
|
``` |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
6. 绝对布局可以和其他布局共存 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
FineUI中组件render方法支持return对象或者数组,可以利用绝对布局几乎没有副作用的特点,附加一些内容 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
``` |
|
|
|
|
|
|
|
BI.createWidget({ |
|
|
|
|
|
|
|
type: "bi.basic_button", |
|
|
|
|
|
|
|
width: 200, |
|
|
|
|
|
|
|
height: 200, |
|
|
|
|
|
|
|
cls: "bi-border", |
|
|
|
|
|
|
|
render: () => { |
|
|
|
|
|
|
|
return [ |
|
|
|
|
|
|
|
{ |
|
|
|
|
|
|
|
type: "bi.center_adapt", |
|
|
|
|
|
|
|
items: [ |
|
|
|
|
|
|
|
{ |
|
|
|
|
|
|
|
type: "bi.button", |
|
|
|
|
|
|
|
text: "居中", |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
], |
|
|
|
|
|
|
|
}, { |
|
|
|
|
|
|
|
type: "bi.absolute", |
|
|
|
|
|
|
|
items: [ |
|
|
|
|
|
|
|
{ |
|
|
|
|
|
|
|
el: { |
|
|
|
|
|
|
|
type: "bi.button", |
|
|
|
|
|
|
|
text: "左上角", |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
top: 10, |
|
|
|
|
|
|
|
right: 10, |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
], |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
]; |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
``` |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
![示例](../images/10.png) |