`
hn_liuyi
  • 浏览: 32452 次
  • 性别: Icon_minigender_1
  • 来自: 天津
社区版块
存档分类
最新评论

TWaver组件之Table使用(翻译TWaver文档+补充自己使用体会)八

阅读更多

第八篇 使用 Element Table

Element Table 组件同 alarmtable 一样继承自 TWaver table,Element table 备用用于展示 TWaver element 对象, Element Table 连接着 DataBox ,并从 DataBox 中获取所有的 Element 对象信息展示到表格的每一列上,一个属性对应一列。

Element table 来源于 TWaver table 所以他拥有所有的基本 表格的特性。像自定义列,排序,分页控制,锁定,弹出菜单,和过滤器。不清楚的请参考使用表格组件。

创建一个 Element Table 组件

一般情况下,我们需要一个 DataBox 去创建一个 element table, 这样这个表格就是连接着 DataBoxd , 展示和监控着 DataBox 里面的数据。根据下面小片段来看一下创建一个 Element table 组件和展示 DataBox 里面所有的数据信息。

JFrame frame = new JFrame("TWaver Element Table");

TDataBox box = new TDataBox();

TElementTable table = new TElementTable(box);// 这样写,数 //// 据量大的话,严重影响性能

table.setElementClass(Element.class);

frame.setContentPane(new JScrollPane(table));

frame.setSize(400, 100);

TWaverUtil.centerWindow(frame);

//create several elements.

for (int i = 0; i < 5; i++) {// 自己补充,这里是插入 5 个数据,你可 // 以测试一下插入 5000 条以上数据,看看这个程序要多长 时间能 // 显示出来。

Node node = new Node("N-" + i);

node.setName("Node " + i);

node

.getAlarmState()

.addNewAlarm(AlarmSeverity.getNonClearedRandomSeverity());

box.addElement(node);

}

frame.setVisible(true);

图片

 

自定义一个 Element Table

通过 xml 定义 Bean 信 息来创建 Table

TDataBox box = new TDataBox();

TElementTable table = new TElementTable(box);

// 关键 步骤 1 :注册 xml 定 义的 Bean 信 息

table.registerElementClassXML(Person.class,”/table.xml”);

// 关键 步骤 2 :设置 element class 类型

table.setElementClass(Person.class);

// 往表 格里面放数据

box.addElement(new Person(“Sam”,89));

box.addElement(new Person(“Tom”,12));

box.addElement(new Person(“lisa”,10));

box.addElement(new Person(“pate”,20));

//Person.java

public static class Person extends Node{

   public Person(String name,int age){

  this.setName(name);

  this.putClientProperty(“age”,age);

}

public int getAge(){

  String value = this.getClientProperty(“age”).toString();

return Integer.valueOf(value).intValue();

  }

}

补充:上面这个 Person.java 类很令人费解,这事 Twaver 文档实例的一贯作风。这里可以这么简单的改一下,最简单的实现一 下:

pubic static class Person extends Node{

public Person(String name,int age){

// 因为 采用的是键值对的形式,所以下面的红色部分为 xml 配置 // bean 信 息的 name 属性对应的值保持一致

// 如果 设置 putClientProperty xml 里面必须得 clientPropertyKey

this.putClientProperty(“name ”,name);

this.putClientProperty(“age ”,age);

}

}

下面配置 table.xml 文件

<beaninfo>

<attribute

name="name"

displayName="Name"/>

<attribute

clientPropertyKey="age"

displayName="Age"/>

</beaninfo>

图片

补充: table.xml 的配置信息太简单了,这里可以配置所有的 table 属性信息。比如:

<attribute

name="name"

displayName="Name"/>

我可以这样:

<attribute

name="name"

displayName="Name"

visible=”false”// 该列不可见

editable=”false”// 该列不可编辑

// javaClass = "java.lang.Boolean" 这事设置这 一列为复选框的同 Check 隐藏列

//renderer=”com.org.listRenderer” 设置 renderer

//editor=”com.org.listEditor”// 设置 Editor

/>

提示:如果打开界面就有几千行数据呈现在一个表格里面的话,这个 表格应该这样做:

TElementTable table = new TElementTable();

TDataBox box = new TDataBox();

…….// 一 系列设置表格属性的操作,就是不要设置 TDataBox 属性。

for(){// 这里不管什么样的循环往 box 里面加载数据,举例为: for

……..

box.addElement(…);

}

// 加载 数据结束

table.setDataBox(box);

box 的加载到 table 上 的位置放到数据加载完毕之后,上面写那么多有点磨叽了。

使用过滤器

你可以使用 VisibleFilter 去控制 TElementTable 的每一行的显示与否。

List getVisibleFilters()

void addVisibleFilter(VisibleFilter visibleFilter)

void removeVisibleFilter(VisibleFilter visibleFilter)

table.addVisibleFilter(new VIisibleFilter(){

public Boolean isVisible(Element element){

   Person person = (Person)element;

  return person.getAge()>=18;

}

});

图片

加载数据

表格和他关联的 DataBox 拥有一样的 Element 存放顺序,在默认的情况下,最后添加的数据总是放在表格的最底 处,即行号最大的地方,但是,你也许想看到最后添加的数据能够呈现在表格的最顶端。例如:一个新发生的告警一般都想被放在表格的最顶端,一般调用方法 table.setConverseIncreaseOrder(true) 能做到这样。

图片

图片

补充:还有一个常用的办法就是在往表格关联的 DataBox 里面放数据的时候,一般: box.addElement(element); 这样如果是放在最低端的话,使用 box.addElement(0,element); 这样就放在表格的最前端了。原因为: box 里面其实就是存放的一个 List 数据链, list 可以从前段后端进行插入数据的嘛
0
2
分享到:
评论

相关推荐

    flex Twaver组件使用

    TWaver组件是针对Flex和Flash平台的专业图形化组件,由Adobe公司的Flex/Flash技术构建。它为电信行业的运营支撑系统提供了一种富互联网应用(RIA)解决方案,同时也适用于电力、金融、制造、交通等多个领域的软件...

    Twaver java 4.1资源包(库+学习文档+javadoc)

    【标签】"twaver java 4.1 整合包" 表明这是一个包含Twaver 4.1所有必要组件的完整集合,包括Java库、相关的文档和API参考,是进行Java项目开发的必备资料。 【压缩包子文件的文件名称列表】: 1. **demo.bat** 和 ...

    TWaver的3d图形组件库,小demo

    通过这个"TWaver的3d图形组件库,小demo",开发者不仅可以学习到如何使用TWaver库创建3D图形,还能了解到现代Web开发中的3D数据可视化技术和最佳实践。通过研究提供的源代码,开发者可以提升自己在WebGL和JavaScript...

    TWaver_Flex中文帮助文档

    TWaver Flex中的告警功能是该组件的一个重要组成部分,文档中讲解了告警的使用,包括告警级别、状态与统计、以及告警的呈现方式。 ### 版权声明和使用许可 文档中也明确了版权信息和版权声明,强调了文档是...

    twaver.js使用示例

    “twaver.js使用示例”这一标题表明了我们即将探讨的是一个关于twaver.js的实践应用案例。Twaver.js是一款强大的图形化建模和可视化库,主要用于创建复杂的网络拓扑图、流程图、组织结构图等。这个标题暗示我们将...

    TWaver“一站式”UI组件提供包括网络拓扑图、地图、设备面板图、流程图、各种Chart图表、树图、表格等各种通用组件

    使用TWaver前,需熟悉几个基本概念:图元(Element)、容器(DataBox)和画布(Network)。 图元:图形中的各种基本元素,如节点(Node)、连线(Link)等; 容器:图元都统一放置在一个容器(DataBox)中进行管理...

    TWaver文档

    - **界面交互**也是TWaver的重要组成部分之一,它提供了丰富的API来处理用户的输入事件,并且可以根据用户的操作实时更新视图。 ### 产品家族与技术栈 - TWaver支持多种技术和平台,包括**Java**、**Flex**、**...

    Twaver java 帮助文档

    Twaver java开发帮助文档,英文版的。

    Twaver Web SVG 开发说明文档

    该文档详细介绍了 Twaver Web SVG 的架构、开发流程以及常见问题解决方案等内容,旨在帮助开发者更好地理解和掌握 Twaver Web SVG 的使用方法。 #### 二、简介 ##### 2.1 TWAVER WEBSVG 结构 Twaver Web SVG 采用...

    TWAVER-最好的JAVA 图形设计组件-试用

    TWAVER是一款强大的JAVA图形设计组件,专为电信...综合这些资源,开发者不仅可以了解TWAVER的基本功能,还能通过示例代码和文档深入理解如何在自己的项目中集成和扩展TWAVER组件,以构建出高效且用户友好的图形界面。

    TWaver-Java 电信组件

    【描述】"TWaver-Java手册,单机Demo 相应的文档和接口"涵盖了该组件的使用指南、示例代码以及详细的API接口文档。手册部分将引导用户了解如何集成和操作TWaver组件,而Demo则提供了实际运行的示例,帮助开发者快速...

    最新TWaver3.1 -Java 电信组件(包含 Demo 相关文档 API接口 源码)

    刚弄到的最新版本TWaver3.1的Demo源代码(包含了DEMO运行程序,相关文档,API接口,源码,网站上没有的)...它不但提供了全部的Demo,还有相应的全部文档和源码,有了它,您完全可以根据自己的需要做出漂亮的电信组件。

    TWaver HTML5 Developer Guide

    在视图组件部分,文档将介绍Network、Tree和Table三种主要组件的介绍,这些组件是构建可视化界面的核心。Network组件用于展示网络拓扑结构,Tree组件用于构建树形结构,而Table组件用于展示和操作表格数据。 数据...

    twaver 官方文档

    【标题】"TWaver 官方文档"指出的是TWaver这一技术的相关官方资料,它代表了一个专注于数据可视化和图表绘制的工具。TWaver是用于创建交互式图表、网络图、流程图、地图等复杂可视化应用的JavaScript库。通过官方...

    TWaver .NET 开发指南+API(英文版)

    《TWaver .NET 开发指南+API(英文版)》是专为.NET开发者设计的一份重要参考资料,旨在帮助开发者深入理解和高效使用TWaver组件。TWaver是一个强大的数据可视化工具,尤其适用于创建复杂的图表、网络图以及地理信息...

    twaver-html5-5.9.0-api_html5_-5.9.0-api_twaver_

    标题中的"twaver-html5-5.9.0-api_html5_-5.9.0-api_twaver_"似乎是指一个基于HTML5的Twaver版本5.9.0的应用程序接口(API)文档。Twaver是一个强大的数据可视化和网络建模工具,广泛应用于网络拓扑、流程图、组织...

    TWaver-Java 电信组件 单机Demo 相应的文档和接口

    【TWaver-Java 电信组件】是专门为电信行业设计的一款强大的可视化组件库,它提供了丰富的图形化工具,用于构建复杂的网络拓扑、设备状态监控、业务流程展示等应用。这个单机Demo是开发者和系统集成商了解和评估...

    TWaver-java-4.1最新 官网试用版jar包及Demo

    8. documents:文档目录,可能包含TWaver的用户手册、API参考等资料,帮助开发者更深入地了解和使用TWaver。 9. javadoc:Java文档目录,通常生成自源代码,提供了TWaver库的API详细说明,包括方法、类和接口的描述...

Global site tag (gtag.js) - Google Analytics