Twaver-HTML5基础学习(22)层管理容器(LayerBox)、告警管理容器(AlarmBox)、列管理容器(ColumnBox)、属性管理容器(PropertyBox)

本文涉及的产品
应用实时监控服务-用户体验监控,每月100OCU免费额度
应用实时监控服务-应用监控,每月50GB免费额度
简介: 本文介绍了Twaver HTML5中的多种管理容器:层管理容器(LayerBox)、告警管理容器(AlarmBox)、列管理容器(ColumnBox)和属性管理容器(PropertyBox)。文章解释了这些容器的作用、如何获取它们,并提供了一些基本的操作方法。这些容器分别用于管理图层、告警、表格列和属性对象,是TWaver中数据管理和组织的重要部分。

层管理容器(LayerBox)

LayerBox的主要作用是用来管理Layer,得到LayerBox的方式有两种,一种是直接通过var layerBox =
databox.getLayerBox();一种是创建:var layerBox = new twaver.LayerBox(box);

var layerBox = box.getLayerBox();
var layerBox = new twaver.LayerBox(box);

twaver.Layer(图层)继承于twaver.Data,用于描述拓扑网元的图层信息,Layer有四个特殊属性:visible,editable,movable,rotatable。

//显示隐藏
setVisible:function()
getVisible:function()
//是否可以移动
setMovable:function()
getMovable:function()
//是否能编辑
setEditable:function()
getEditable:function()
//是否可以旋转
setRotatable:function()
getRotatable:function()

Twaver-HTML5基础学习(7)Layer图层元素

告警管理容器(AlarmBox)

AlarmBox自然是用来管理告警(Alarm)的,获取AlarmBox的方法也有两种,
一种是var alarmBox =databox.getAlarmBox();另外一种是:var alarmBox = new AlarmBox(box);

Twaver-HTML5基础学习(4)告警元素(Alarm)
Twaver-HTML5基础学习(5)告警元素(Alarm)的告警位置(偏移量以及定位理解)
Twaver-HTML5基础学习(6)告警元素(Alarm)闪烁效果

列管理容器(ColumnBox)

列管理容器主要用于Table表格中,管理表格中的列(twaver.Column)对象。

    var table = new twaver.controls.Table(box);
    ...
    var column = new twaver.Column(name);
    column.setName(name);
    column.setPropertyName(propetyName);
    column.setPropertyType(propertyType);
    if (valueType) {
   
        column.setValueType(valueType);
    }
    table.getColumnBox().add(column);

Twaver-HTML5基础学习(10)嵌入Table

属性管理容器(PropertyBox)

属性管理容器主要用来管理属性(twaver.Property)对象。

    var sheet = new twaver.controls.PropertySheet(box);
    ...
    var sheetBox = sheet.getPropertyBox();
    var property = new twaver.Property();
    property.setCategoryName(category);
    if (!name) {
   
        name = demo.Util._getNameFromPropertyName(propertyName);
    }
    property.setName(name);
    property.setEditable(true);
    property.setPropertyType(proprtyType);
    property.setPropertyName(propertyName);
    sheetBox.add(property);

学习参考:TWaver Documents

相关实践学习
通过云拨测对指定服务器进行Ping/DNS监测
本实验将通过云拨测对指定服务器进行Ping/DNS监测,评估网站服务质量和用户体验。
目录
相关文章
WK
|
1月前
|
存储 移动开发 前端开发
HTML5新增了哪些其他元素和属性
这段文字介绍了HTML5中新增的多种元素和属性,包括页面布局元素如header、nav等,表单元素如email、tel输入框等,以及其他元素如canvas、svg等。此外,还介绍了全局及表单属性,例如contenteditable、placeholder等,这些新功能显著增强了HTML5在现代网页设计与开发中的实用性与灵活性。
WK
52 1
|
18天前
|
搜索推荐 前端开发 UED
哪些 HTML 全局属性在 SEO 优化中比较重要?
【10月更文挑战第27天】这些HTML全局属性通过不同的方式为搜索引擎提供了更丰富、准确的页面信息,有助于提高页面的可索引性、相关性和用户体验,从而在SEO优化中发挥着重要的作用。开发者应充分重视并合理运用这些属性,以提升网站在搜索引擎中的排名和流量。
|
18天前
|
前端开发 搜索推荐 算法
|
18天前
|
前端开发 JavaScript 开发者
HTML 中的全局属性和局部属性是否可以相互覆盖?
【10月更文挑战第27天】HTML中的全局属性和局部属性在正常使用情况下不会相互覆盖,但在涉及CSS样式和JavaScript操作等特殊情况下,可能会出现类似覆盖的效果。开发者需要理解属性的功能、作用域和优先级,遵循最佳实践,以确保HTML文档的结构清晰、功能正常且易于维护。
|
18天前
|
存储 移动开发 前端开发
HTML全局属性
【10月更文挑战第27天】
|
26天前
HTML 属性参考手册
HTML属性参考手册提供了常用的HTML属性列表,包括`class`、`id`、`style`、`title`等,用于定义元素的样式、唯一标识、额外信息等。此外,还包括`href`、`src`、`alt`、`name`、`value`、`target`、`type`和`placeholder`等,分别用于链接、资源路径、替代文本、表单元素名称和值、链接打开方式、表单元素类型及占位符文本的定义。
|
27天前
HTML 属性
HTML属性为元素提供额外信息,格式为name="value",置于开始标签内。如<a href="http://www.runoob.com">,其中href为属性名,URL为值。属性值应加引号,推荐使用小写。
|
1月前
|
人工智能
|
1月前
|
移动开发 JavaScript 前端开发
HTML5 表单属性详解
HTML5引入了多种新的表单属性,使表单创建与验证更加便捷高效。新增的输入类型包括`email`、`url`、`tel`等,常用属性有`placeholder`、`required`等。表单元素如`<form>`可设置提交方法和目标URL,`<button>`及`<input type="submit">`用于提交。新元素`<datalist>`和`<output>`提供更多功能。HTML5还提供了内置表单验证机制,增强用户体验。
|
1月前
|
Kubernetes Linux 持续交付
docker容器学习
【10月更文挑战第1天】
39 1
下一篇
无影云桌面