Zebra入门 互动版

在线工具推荐: Three.js AI纹理开发包 - YOLO合成数据生成器 - GLTF/GLB在线编辑 - 3D模型格式在线转换 - 可编程3D场景编辑器

ListLayout


   列表布局 简单而直接,布局空间中的元素从上到下依次排列,和流式布局有点类似,可以将它看做是精简版的流式布局。

var r = new zebra.ui.zCanvas(200,200).root;
r.setBorder(zebra.ui.borders.plain);
//设置布局方式
r.setLayout(new zebra.layout.ListLayout());

r.add(new zebra.ui.Button("Item1"));
r.add(new zebra.ui.Button("Item2"));
r.add(new zebra.ui.Button("Item3"));

  ListLayout类有两个可选参数,用途分别为指定 水平对齐方式 组件间的间距

//组件左对齐,间距为2
r.setLayout(new zebra.layout.ListLayout(zebra.layout.LEFT,2));
使用列表布局,设置组件对齐方式为居中对齐。