网格布局
网格布局相对固定布局来说会灵活很多, 可以用来制作大盘图表或者一些复杂的场景.
配置说明
- 实现接口:
dev.fastball.ui.components.layout.LayoutComponent
- 配置注解:
@dev.fastball.ui.components.layout.config.GridLayout
- 属性说明:
- cells:
- 类型:
GridCell[]
- 默认值: 无
- 配置作用: 网格布局的格子内容
- 属性说明:
- component:
- 类型:
Class<Component>
- 默认值: 无
- 配置作用: 格子内的组件
- 类型:
- x:
- 类型:
int
- 默认值:
0
- 配置作用: 格子在网格中的 X 轴坐标
- 类型:
- y:
- 类型:
int
- 默认值:
0
- 配置作用: 格子在网格中的 Y 轴坐标
- 类型:
- width:
- 类型:
int
- 默认值:
6
- 配置作用: 格子在网格中的宽度, 即占几列
- 类型:
- height:
- 类型:
int
- 默认值:
6
- 配置作用: 格子在网格中的高度, 即占几行
- 类型:
- component:
- 类型:
- cols:
- 类型:
int
- 默认值:
12
- 配置作用: 网格布局的列数
- 类型:
- rowHeight:
- 类型:
int
- 默认值:
32
- 配置作用: 网格的每一行的高度
- 类型:
- resizable:
- 类型:
boolean
- 默认值:
false
- 配置作用: 是否可以改变大小
- 类型:
- draggable:
- 类型:
boolean
- 默认值:
false
- 配置作用: 是否可以拖动
- 类型:
- cells:
- 示例代码链接:
java
@UIComponent
@GridLayout(cells = {
@GridCell(x = 0, y = 0, width = 3, component = BasicColumnChart.class),
@GridCell(x = 3, y = 0, width = 3, component = MultipleLineChart.class),
@GridCell(x = 6, y = 0, width = 3, component = BasicAreaChart.class),
@GridCell(x = 9, y = 0, width = 3, component = BasicLineChart.class),
@GridCell(x = 0, y = 6, height = 12, component = MultipleColumnChart.class),
@GridCell(x = 6, y = 6, component = MultipleAreaChart.class),
@GridCell(x = 6, y = 12, component = MultipleBarChart.class),
@GridCell(x = 0, y = 18, width = 12, component = BasicBarChart.class)
})
public class SimpleGridLayout implements LayoutComponent {}