corner imagecorner image
IDEPlatformPluginsDocs & SupportCommunityPartners

可视 设计器定制组件：创建 Mobile 登录屏幕

可视 Mobile 设计器 (VMD) 是 NetBeans Mobility 中的图形界面，您可以在该界面中使用拖放式组件设计移动应用程序。通过使用 VMD，您可以使用 IDE 提供的组件或您自己设计的组件定义应用程序流和设计 GUI。VMD 包含很多标准用户界面 (UI) 组件，您可以使用这些组件创建应用程序，如列表、警报、窗体和图像。它还包含一些定制组件，用于简化创建较复杂组件的过程，例如，等待屏幕、闪屏和表项等。

登录屏幕定制组件提供了一个非常有用的用户界面，其中包含一些标准元素，例如，“用户名”字段、“口令”字段以及“登录”按钮。可以使用该定制组件创建登录界面以访问受保护的功能，如 GSM 银行。

如果您对 NetBeans Mobility 或 J2EE 不太熟悉，应先阅读 NetBeans Java ME MIDP 快速入门指南，然后再继续学习本教程。

注意：如果使用的是 NetBeans IDE 6.8，请参阅在 NetBeans IDE 6.8 中创建登录屏幕教程。

目录

本页上的内容适用于 NetBeans IDE 6.9 和 7.0

要学习本教程，您需要具备以下软件和资源。

软件或资源 要求的版本
带有 Java ME 的 NetBeans Beans 版本 6.9 或 7.0
Java Development Kit (JDK) 版本 6
GlassFish 或 Tomcat 包含在 IDE 的 Java EE 和 All 安装中

安装并运行样例应用程序

在开始之前，您可能希望查看本教程的最终结果。

本示例介绍了如何在客户端应用程序中使用登录屏幕定制组件，以及如何使用已验证身份的访问将其连接到服务器资源。除了 NetBeans Mobility 项目以外，我们还需要使用 NetBeans Web 项目。要完成本教程，您需要了解如何使用 NetBeans Web 项目以及如何对 Web 应用服务器（如 GlassFish 或 Tomcat）进行本地或远程访问。

请执行下列步骤以安装 LoginScreenExample 应用程序：

  1. 下载 LoginScreenExample.zip。此下载包含完成的 NetBeans Mobility 项目。
  2. 下载 LoginScreenServletExample.zip。此下载包含完成的 NetBeans Web 项目。
  3. 解压缩这些文件。
  4. 在 IDE 中，选择“文件”>“打开项目”，然后浏览到包含 LoginScreenExample 项目的解压缩文件的文件夹。
  5. 单击“打开项目”。
  6. 重复上面的步骤 4 和 5 以打开 LoginScreenServletExample 项目。
  7. “项目”视图应如下所示：

    8. 打开了登录屏幕和登录屏幕 Servlet 示例的“项目”窗口

  8. 在“项目”窗口中，右键单击 LoginScreenServletExample 项目节点，然后选择“运行项目”（或按 F6 键）。
  9. 右键单击 LoginScreenExample 项目节点，然后选择“运行项目”。当应用程序运行时，将会打开一个仿真器窗口，其中显示了在缺省设备仿真器中运行的应用程序。
  10. 在仿真器窗口中，单击 "Launch" 下面的按钮。
    仿真器将显示闪屏组件，然后显示登录屏幕，如下所示：

    11. 显示样例登录屏幕应用程序的 WTK 2.5 仿真器

  • 通过上移和下移光标，您可以在 "Login" 和 "Password" 字段之间导航。
  • 单击中心按钮以允许编辑选定的文本字段。
  • 单击 "Username" 字段并键入 "john"，然后在仿真器中按 "OK" 按钮。
  • 单击 "Password" 字段并键入 "peanuts"，然后在仿真器中按 "OK" 按钮。
  • 单击 "Login" 下面的按钮以完成操作。
  • 如果应用程序连接到服务器，则会看到在屏幕上显示 alert1 组件以及 "Login Successful" 消息。

返回页首

使用登录屏幕定制组件创建应用程序

现在，您已看到运行中的登录屏幕组件，接下来让我们从头开始创建此应用程序。在本教程中，我们仅使用 NetBeans Mobility 包创建 Java ME 客户端。如果您需要了解此应用程序的服务器端的详细信息，请查看 LoginScreenServletExample 项目源代码。要创建 Java ME 客户端应用程序，请执行以下操作：

  1. 创建 LoginScreenExample 项目
  2. 在 LoginScreenExample 项目中添加包和 Visual MIDlet
  3. 在 LoginScreenExample 中添加组件
  4. 在登录屏幕组件中添加命令
  5. 连接组件以创建应用程序流
  6. 添加其他源代码
  7. 运行项目

创建 LoginScreenExample 项目

  1. 选择“文件”>“新建项目 (Ctrl-Shift-N)”。在“类别”下，选择 "Java ME"。在“项目”下，选择“Mobile 应用程序”，然后单击“下一步”。
  2. 在“项目名称”字段中输入 LoginScreenExample。将“项目位置”更改为系统中的某个目录。让我们将此目录称为 $PROJECTHOME。
  3. 取消选中“创建 Hello MIDlet”复选框。单击“下一步”。
  4. 将 "Sun Java Wireless Toolkit " 保留为选定的仿真器平台。单击“下一步”，然后单击“完成”。

    5. 注意：此项目文件夹包含所有源代码和项目 meta 数据，例如，项目的 Ant 脚本。应用程序显示在可视 Mobile 设计器的“流”设计窗口中。

在 LoginScreenExample 项目中添加包和 Visual MIDlet

  1. 在“项目”窗口中选择 LoginScreenExample 项目，然后选择“文件”>“新建文件 (Ctrl-N)”。在“类别”下选择 "Java"。在“文件类型”下，选择“Java 包”。单击“下一步”。
  2. 在“包名”字段中输入 loginscreenexample。单击“完成”。
  3. 在“项目”窗口中选择 loginscreenexample 包，然后选择“文件”>“新建文件 (Ctrl-N)”。在“类别”下，选择 "MIDP"。在“文件类型”下，选择 "Visual MIDlet"。单击“下一步”。
  4. 在“MIDlet 名称”和“MIDP 类名”字段中输入 LoginScreenExample。单击“完成”。

在 LoginScreenExample 中添加命令

  1. 将 Visual MIDlet 切换到流设计器窗口。将以下组件从组件面板拖放至流设计器中：
    • 闪屏
    • 等待屏幕
    • 登录屏幕
    • Alert (x2)
  2. 单击 "splashScreen"，然后在“属性”窗口中将“文本”属性值从 null 更改为 Login Screen Example。
  3. 右键单击警报组件，然后在弹出式菜单中选择“重命名”。
  4. 在“重命名”对话框中，输入 alertFailure，然后单击“确定”。
  5. 对于 alert1 组件，重复步骤 3 和 4 以将其重命名为 alertSuccess。
  6. 返回到 alertFailure 组件，然后在“属性”窗口中将“字符串”属性值更改为 Error。
  7. 单击 waitScreen 组件，然后在“属性”窗口中将“文本”属性值更改为 Please Wait...。
  8. 在 waitScreen 组件的“属性”窗口中，单击“任务”属性的省略号按钮 (省略号按钮)。
  9. 在“任务”对话框中，单击“添加”。
    将添加 task1 组件。
  10. 单击“转至源”。
    “源”视图将显示 getTask () 方法代码。
  11. 单击“确定”以关闭“任务”对话框。
  12. 在“源”视图中，查找 // write task-execution user code here 部分并将其替换为 login();。
  13. 按 Ctrl+S 组合键以保存所做的编辑。

在 LoginScreenExample 中添加命令

  1. 打开“流”视图。
  2. 从组件面板的“命令”类别中选择“退出命令”。将其拖放至“流”视图中的 loginScreen 组件上。

连接组件

在“流”视图中，单击“移动设备”上的“已启动”文本，然后将其拖至 splashScreen 组件上。采用相同的方法，按照下图所示连接各个组件。

显示包含由命令线连接的组件的流设计器

添加源代码

  1. 在 LoginScreenExample.java 源代码的声明部分中添加以下代码：private boolean login = false;。
  2. 在源代码的末尾，粘贴以下代码： 
    3.  private void login() throws IOException {
   //URL
   String url = "http://localhost:8084/LoginScreenExample/"
                + "?username=" + getLoginScreen().getUsername()
                + "&password=" + getLoginScreen().getPassword();
   //Clean up alertSuccess 
   getAlert1().setString("");
   //Connect to the server
   HttpConnection hc = (HttpConnection) Connector.open(url);
   //Authentication
   if (hc.getResponseCode() == HttpConnection.HTTP_OK) {
        login = true;
   }
   //Closing time...
   hc.close();
   //Take action based on login value
   if (login) {
        getAlert1().setString("Login Succesfull");
   } else {
        getAlert1().setString("Wrong Username or Password");
   }
   login = false;
 }

    该代码负责将包含用户名和口令信息的请求发送到服务器，并在成功完成登录过程时接收应答。可通过按 Ctrl+Shift+I 组合键来更正源代码导入。

运行项目

在运行客户端应用程序之前，请确保已部署并正在运行服务器端应用程序。

要运行移动客户端应用程序，请选择“运行”>“运行主项目”或按 F6 键以运行主项目。

返回页首

登录屏幕组件的 Javadoc

NetBeans IDE 提供了登录屏幕组件以及可以在 VMD 中使用的其他组件的 API Javadoc。要阅读登录屏幕组件的 Javadoc，请完成以下步骤：

  1. 将光标放在源代码中的 loginScreen 组件上，然后按 Ctr-Shift-空格键（或选择“源”>“显示文档”）。
    将在弹出式窗口中显示该元素的 Javadoc。
  2. 在弹出式窗口中单击“在外部 Web 浏览器中显示文档”图标 (在外部 Web 浏览器中显示文档)，以查看有关浏览器中的 loginScreen 组件的详细信息。

返回页首


另请参见

返回页首