Zebra入门 互动版

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

Line


  当我们需要绘制横向或者纵向线条的时候可以使用Line类。

//绘制一条长100px的横线。
var line = new zebra.ui.Line();
line.setBounds(0,0,100,10);

  如何绘制竖线呢?当绘制线条的 with 大于 height 时,将绘制出横线,反之则是竖线。

  需要注意的是线条的宽度并不是绘制时的 height 决定的,而是需要通过设置lineWidth属性来实现,当然lineWidth 小于等于 绘制时的 width 或者 height 值。

//绘制一条长100px,宽20px的竖线。
var line = new zebra.ui.Line();
line.lineWidth = 20;
line.setBounds(0,0,20,100);

  线条颜色也是可以自定义的,使用setLineColors方法可以将线条设置成不同的颜色。

//设置线条颜色为红色。
line.setLineColors('red');
绘制一条绿色的竖线。