可视 Mobile 设计器定制组件:在 Java ME 应用程序中使用表项
通过可视 Mobile 设计器 (Visual Mobile Designer, VMD),您可以使用拖放式组件设计 Java ME 应用程序。在该设计器中,可以通过使用 IDE 提供的组件或使用自己设计的组件,确定应用程序流以及 UI 的外观。VMD 包含许多可用于创建应用程序的标准组件,如列表、警报、窗体、图像等。此外,它还包含一些用于简化较复杂组件创建过程的定制组件,如等待屏幕、闪屏和登录屏幕。
通过表项组件,您可以快速创建包含一列或多列的表,同时每列都有一个标题区域和一个数据区域,且每个记录都是如此。表在水平和垂直方向上的大小可超出屏幕。用户可以使用光标在任一方向上滚动。使用可视 Mobile 设计器 (Visual Mobile Designer, VMD) 的表项组件,可以简化 Java ME 应用程序中数据表的设计和实现过程。
如果您对在 NetBeans 中开发 Mobile 应用程序不熟悉,则应首先阅读 NetBeans Java ME MIDP 快速入门指南,然后再继续学习本教程。
注意:如果使用的是 NetBeans IDE 6.8,请参阅在 Java ME 应用程序中使用表项 - NetBeans IDE 6.8 教程。
目录
要学完本教程,您需要具备以下软件和资源:
表项组件的工作方式
本教程中的示例将向您说明如何在 Mobile 应用程序中使用表项组件和表模型组件。该示例演示了这些组件的基本功能,以及如何使用它们在 Java ME 应用程序的 SimpleTableModel 资源中可视化并处理数据。本教程中讨论的表项定制组件将使用一个来自 SimpleTableModel 接口的表,并且它可显示数据,甚至允许用户编辑数据。
除了表项定制组件以外,我们还需要使用两个其他 MIDP 组件:文本框组件和窗体组件。要了解有关这些组件以及 VMD 组件面板中包含的其他定制组件的详细信息,请参见可视 Mobile 设计器组件面板指南。
安装并运行样例应用程序
开始之前,您可能希望查看本教程的最终结果。请执行下列步骤以安装 tableitemexample 样例应用程序:
- 下载 TableItemExample.zip 文件。
- 解压缩该文件。
- 在 IDE 中,选择“文件”>“打开项目”,然后浏览到包含解压缩文件的文件夹。
- 打开“项目”窗口。该窗口应如下所示:

- 在“项目”窗口中,右键单击项目节点并选择“运行项目”(或按 F6)。当应用程序运行时,将会打开一个仿真器窗口,其中显示了在缺省设备仿真器中运行的应用程序。
- 在仿真器窗口中,单击 "Launch" 下面的按钮。仿真器将显示一个表,如下所示:
- 对该表进行如下编辑:
- 使用选择按钮上的方向箭头在单元格之间移动光标。
- 单击 "Edit Cell" 下面的按钮以编辑某个单元格的内容。
- 单击 "Exit" 下面的按钮以关闭应用程序。
返回页首
使用表项定制组件创建表
现在,您已看到运行中的表项组件,接下来我们可以向您说明如何创建此应用程序。要创建此应用程序,请执行以下操作:
- 创建 MyTableExample 项目
- 在 MyTableExample 项目中添加包和 Visual MIDlet
- 在 MyTableMidlet 中添加组件
- 编辑 SimpleTableModel 设计
- 向窗体组件和文本框组件中添加命令
- 连接组件以创建应用程序流
- 插入源代码
- 运行项目
创建 MyTableExample 项目
- 选择“文件”>“新建项目 (Ctrl-Shift-N)”。在“类别”下,选择 "Java ME"。在“项目”下,选择“Mobile 应用程序”,然后单击“下一步”。
- 在“项目名称”字段中键入
MyTableExample。将“项目位置”更改为系统中的某个目录。从现在开始,我们将此目录称为 $PROJECTHOME。
- 取消选中“创建 Hello MIDlet”复选框。单击“下一步”。
- 将 "Sun Java Wireless Toolkit 2.5.2" 保留为选定的仿真器平台。单击“完成”。
在 MyTableExample 项目中添加包和 Visual MIDlet
- 在“项目”窗口中选择
MyTableExample 项目,然后选择“文件”>“新建文件 (Ctrl-N)”。在“类别”下选择 "Java"。在“文件类型”下,选择“Java 包”。单击“下一步”。
- 在“包名”字段中输入
tableitemexample。单击“完成”。
- 在“项目”窗口中选择
tableitemexample 包,然后选择“文件”>“新建文件 (Ctrl-N)”。在“类别”下,选择 "MIDP"。在“文件类型”下,选择 "Visual MIDlet"。单击“下一步”。
- 分别在“MIDlet 名称”字段和“MIDP 类名”字段中输入
MyTableItemMidlet。单击“完成”。
在 MyTableItemMidlet 中添加组件
- 将 Visual MIDlet 切换至“流”视图。将以下屏幕组件从组件面板拖放至流设计器中:
- 选择 textBox,然后在“属性”窗口中将组件标题更改为 Edit。
- 双击 form 组件以切换到“屏幕”视图。
- 将“表项”组件从组件面板的“项”类别拖放至 form 中。添加到屏幕设计器中的“表项”组件如下所示:

- 选择 tableItem,然后在“属性”窗口中键入
TableItem Example 作为“标签”属性值。
- 右键单击 tableItem 组件,然后在弹出式菜单中选择“属性”。
- 在“表模型”属性中单击箭头 (
),然后在下拉列表中选择 "<新 SimpleTableModel>"。
- 单击“关闭”。
simpleTableModel 组件将添加到资源中。

编辑 SimpleTableModel
- 在“屏幕”视图中,双击 "<未指定表模型>" 组件以打开“值”对话框。
- 在“值”对话框中,选中“使用表头”选项。
- 分别单击“添加行”和“添加列”按钮四次,将行数和列数更改为 4。
- 将表头分别重命名为 column 1、column 2、column 3 和 column 4。
- 单击“确定”以完成操作。
在窗体组件和文本框组件中添加命令
- 打开“流”视图。
- 从组件面板的“命令”类别中选择“退出命令”。将其拖放至 form 组件中。对于“项命令”,重复执行此操作。
- 在“屏幕”视图中选择 "itemCommand"。在“属性”窗口中,将“标签”属性值更改为 Edit Cell。
- 在“流”视图中,从组件面板的“命令”类别中选择“确定命令”,然后将其拖放至 textBox 组件中。
连接组件
在“流”视图中,单击“移动设备”上的“已启动”,然后将其拖至 form 组件上。采用相同的方法,按照下图所示连接各个组件。

插入源代码
- 切换至“源”视图。
- 在源代码(第 198 行)中查找 getOkCommand 方法,然后在 okCommand = new Command("Ok", Command.OK, 0);(显示的内容为 // write post-init user code here)后面插入以下代码:
} else if (command == itemCommand) {
/* This part of the code is responsible for
* getting value from the table model
*/
if (textBox != null) {
// Get position of the cursor in the table.
int row = tableItem.getSelectedCellRow();
int column = tableItem.getSelectedCellColumn() ;
// Get value from the table model
Object value = simpleTableModel.getValue(column,row);
// Set textBox string value
if (value != null)
textBox.setString(value.toString());
else
textBox.setString("");
}
- 在第 207 行中单击错误标记 (
),然后从弹出式菜单中选择“在 tableitemexample.MyTableItemMidlet 中创建字段命令”选项,如下图所示。

- 在源代码(第 189 行)中查找 getItemCommand 方法,然后在 itemCommand = new Command("Edit Cell", Command.ITEM, 0);(显示的内容为 // write post-init user code here)后面插入以下代码:
/* This part of the code is responsible for
* getting value from the table model
*/
if (textBox != null) {
// Get position of the cursor in the table.
int row = tableItem.getSelectedCellRow();
int column = tableItem.getSelectedCellColumn();
// Get value from the table model
Object value = simpleTableModel.getValue(column,row);
// Set textBox string value
if (value != null)
textBox.setString(value.toString());
else
textBox.setString("");
}
运行项目
按 F6 键以运行主项目。或者,也可以选择“运行”>“运行主项目”。
返回页首
tableItem 和 SimpleTableModel 组件的 Javadoc
NetBeans IDE 提供 tableItem 或 tableModel 组件以及可以在 VMD 中使用的其他组件的 API Javadoc。要阅读 tableItem 或 tableModel 组件的 Javadoc,请完成以下步骤:
- 将光标放在源代码中的 tableItem 或 tableModel 组件上,然后按 Ctr-Shift-空格键(或选择“源”>“显示文档”)。
将在弹出式窗口中显示该元素的 Javadoc。
- 在弹出式窗口中单击“在外部 Web 浏览器中显示文档”图标 (
),以查看有关浏览器中的 tableItem 或 tableModel 组件的详细信息。
返回页首
另请参见
返回页首