Zebra入门 互动版

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

StackLayout


   “栈” 布局是一种简单常见的布局方式,使用这种布局方式时,组件将会 填充 满整个布局空间,因此无需设置组件的位置。

var r = new zebra.ui.zCanvas(200,200).root;
r.setBorder(zebra.ui.borders.plain);
//设置布局方式
r.setLayout(new zebra.layout.StackLayout());
//添加按钮到画布中
r.add(new zebra.ui.Button("button"));

  设置布局方式使用setLayout方法,添加到画布中的按钮将铺满整个画布。

  那么问题来了,如果再添加一个组件到画布中会是怎么样一个排列方式呢?答案是,新的组件会 覆盖 掉原来的组件,并依然填充满整个布局空间。

在“栈”布局下,向画布添加多个组件。