Posted on 2010-08-31 12:45
TWaver 阅读(1728)
评论(3) 编辑 收藏
1.概述
前文介绍了用Java开发电信网管界面系统的方法和相关产品。本文继续阐述如何使用TWaver Java来制作简单的网络拓扑图。
2.TWaver组件结构
TWaver是一套基于Java Swing的电信网络拓扑图呈现组件。其组件按照MVC的架构进行设计。其中，我们把将创建的各种电信网络图形对象（例如各种节点、连接等），直接放置在一个内存容器类中（称为DATABOX），而各种用于显示数据的图形组件（例如地图、树图、表格等）直接与容器连接即可。这种结构就类似Swing中的TableModel和JTable的关系，各种电信网络对象则类似放置在表格中的各种Object。JTable有专门的Editor和Renderer对每个Cell的Object进行编辑和渲染，TWaver也使用类似的机理；其内部使用不同的UI类负责不同类型数据对象的“绘制”。
3.TWaver组件示例
有了以上基本概念，使用TWaver就比较容易了。其基本过程是：
- 创建数据容器；
- 创建各种视图（地图/树图），并与容器连接；
- 创建各种网络对象并设置其属性，并放入容器中；
- 动态更改对象的各种属性，实现数据的实时更新；
下面我们就动手用简单的代码来演示创建过程。首先我们创建一个简单的界面，它由中间的网络地图、左边的树以及右面的属性表组成。他们分别对应于TWaver的TNetwork控件、TTree控件以及TPropertySheet控件。同时，他们共享一个统一的数据容器TDataBox。代码如下：
1
package blog;
2
3import java.awt.*;
4import javax.swing.*;
5import twaver.*;
6import twaver.network.*;
7import twaver.table.*;
8import twaver.tree.*;
9
10
public class Test extends JFrame 
{
11
12 //创建数据容器，并给一个名字
13 private TDataBox box = new TDataBox("My Network");
14 //创建各种图形组件，包括地图、树和属性表。同时连接数据容器。
15 private TNetwork network = new TNetwork(box);
16 private TTree tree = new TTree(box);
17 private TPropertySheet sheet = new TPropertySheet(box);
18
19
public Test() {
20 init();
21
}
22
23 void init() {
24 JSplitPane rootSplit = new JSplitPane();
25 JSplitPane rightSplit = new JSplitPane(JSplitPane.VERTICAL_SPLIT);
26
27 this.setTitle("电信网管中的Java客户端");
28 this.add(rootSplit, BorderLayout.CENTER);
29 rootSplit.add(rightSplit, JSplitPane.LEFT);
30 rootSplit.add(network, JSplitPane.RIGHT);
31
32 rightSplit.add(new JScrollPane(tree), JSplitPane.TOP);
33 rightSplit.add(new JScrollPane(sheet), JSplitPane.BOTTOM);
34 }
35
36 public static void main(String[] args) {
37 Test test = new Test();
38 test.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
39 test.setBounds(200, 200, 450, 300);
40 test.setVisible(true);
41 }
42
}
以上代码简单的创建了一个界面，显示了一幅空的网络地图。运行如下图：
为了放置数据，我们再增加一个函数initData进行网络数据的初始化。
1private void initData() {
2 Node cloud = new Node(); //创建一个node对象
3 cloud.setImage("Cloud.png"); //用一个云图作为图片
4 cloud.setLocation(60, 100); //设置其X、Y坐标
5 cloud.setName("PSTN"); //设置节点显示名称
6 //设置节点属性，改变名称标签的纵向显示位置。
7 //默认情况下，其标签显示在节点下方；此处提升30个象素，将其放置在节点中央位置。
8 cloud.putClientProperty("label.yoffset", new Integer(-30));
9 //设置节点属性，改变其标签字体。
10 cloud.putClientProperty("label.font", new Font("Arial", Font.BOLD, 12));
11 //设置节点属性，改变其标签文本颜色。
12 cloud.putClientProperty("label.color", Color.white);
13 //将节点放入容器
14 box.addElement(cloud);
15
16 //围绕云图创建n个节点，并通过一条link与云图相连。
17 for (int i = 0; i < 10; i++) {
18 //创建一个普通节点并设置其位置。
19 Node node = new Node();
20 int x = 20 + cloud.getLocation().x
21 + (int) (70 * Math.cos(2 * Math.PI / 10 * i));
22 int y = cloud.getLocation().y
23 + (int) (100 * Math.sin(2 * Math.PI / 10 * i));
24 node.setLocation(x, y);
25 box.addElement(node);
26 //创建一条link并让它连接到云图
27 Link link = new Link(node, cloud);
28 box.addElement(link);
29 }
30 }
此时运行程序，将显示如下结果：
你可以观察到，地图上的对象按照我们设定的位置显示出来，同时可以通过鼠标进行选择、托拽等操作。同时，树图上也显示了对象之间的层次关系，属性表则显示了当前选中的对象的属性集合。
除此之外，TWaver的组件还提供了缩放、平移、监听各种事件、设置各种过滤器等功能。由于TWaver是专门针对电信行业而设计，所以直接提供了对告警、事件、自动布局等功能的支持。
4.综合举例
看了一上例子，相信你已经对TWaver有了初步认识。下面介绍一个复杂一点的例子。网络结构虽然更加复杂了，但是TWaver的使用还是同样简单。下图是一个在实际项目中综合使用了TWaver各种对象创建的一幅复杂一点的网络拓扑图：
怎么样，还不错吧？别忘了它可是一幅基于Java Swing的、可交互的图，而不是用Visio之类的工具画出来的静态拓扑图。如果把我们软件项目中的网络结构用这样的效果呈现出来，相信客户会非常满意！
5.结束
下次将介绍如何通过XML数据来创建、加载和呈现网络地图。