端到端 Web 服务教程:移动 Dilbert 应用程序

源自:http://developers.sun.com.cn/Java/mobile-dilbert.html

端到端 Web 服务教程:移动 Dilbert 应用程序
 
By netbeans.org, 1/18/08  

本教程将介绍如何使用 NetBeans IDE 创建使用 web 服务的移动客户机应用程序。我们将创建这样一个应用程序,它可通过实时在线 Web 服务提取每日 Dilbert 连环漫画,并将图形转换为空间节省格式,然后在移动设备上显示漫画。

在本教程中,我们首先将在移动应用程序中创建一个 Web 服务客户机,用于连接在线 DailyDilbert 服务。然后,我们将演示如何使用 Visual MIDlet Designer 以图形化的方式来设计应用程序布局。接下来,添加代码将漫画的图形格式由 GIF 转换为移动设备支持的 PNG 格式。最后,使用模拟器在 IDE 中欣赏连环漫画。

目录

本教程所需要的软件

开始之前,需要在您的计算机上下载并安装以下软件:

  • Java Standard Development Kit(JDK)版本 5.0 或 6.0(下载
  • NetBeans IDE 6.0 的完整发行版(下载
  • GlassFish 或 Tomcat 等 Java EE 5 服务器,可以与上述项目一起安装。

创建 Web 服务客户机

首先,我们需要创建一个新的 Web Application 项目。该项目将包含所需的 Web 服务客户机。

  1. 选择 File > New Project 选项。从 Categories 列表中,选择 Web 选项。从 Projects 列表中,选择 Web Application 选项。单击 Next 按钮。
  2. 将项目命名为 DilbertWebApplication 并选择 Java EE 5 选项,如下所示。

  3. 单击 Finish 按钮,IDE 将创建应用程序。

成功创建了应用程序,Projects 窗口应如下所示:

使用 Web Service Client 向导

现在,我们将添加一个 Web 服务客户机,并让它使用 DailyDilbert 服务

 

  1. 右键单击 DilbertWebApplication 项目节点,然后选择 New > Web Service Client。或者,你也可以从 New File 向导中选择此向导,如下所示:

    此时将显示 Web Service Client 向导。

  2. 选择 WSDL URL 并输入以下 URL:

     

    http://www.esynaps.com/WebServices/DailyDiblert.asmx?WSDL

    注意: Web 服务的拼写是错误的,正确拼写 为 DailyDilbert.asmx,而它实际上是 DailyDiblert.asmx。记住要错误拼写,否则本教程将不会运行!

  3. 将包命名为 dilbert。现在您应该看到以下内容:

  4. 单击 Finish 按钮。

IDE 将下载 WSDL 文件,并创建客户端工件,可以在 Files 窗口的 build 文件夹中查看这些工件。Projects 窗口显示的逻辑视图如下所示:

创建移动客户机

在本节中,我们将创建一个新的 Mobile Application 项目。然后,我们使用 Mobile Client to Web Application 向导将应用程序连接到 DailyDilbert 服务

  1. 选择 File > New Project 选项。从 Categories 列表中,选择 Mobility 选项。从 Projects 列表中选择 MIDP Application 选项,如下所示:

    单击 Next 按钮。

  2. 在 Project Name 字段中输入 DilbertViewer,然后取消选中 Create Hello MIDlet 复选框。

  3. 单击 Finish 按钮,创建 MIDlet。

成功创建了移动应用程序,Projects 窗口应如下所示:

使用 Mobile Client to Web Application 向导

Mobile Client to Web Application 向导会生成一个 Servlet,它可连接到包含 Web 服务客户机的 Web 应用程序。

  1. 在 Projects 窗口中,右键单击 DilbertViewer 项目节点并选择 New > Mobile Client to Web Application 选项,如下所示:

    单击 Next 按钮。

  2. DibertWebApplication 应作为 Web 应用程序列出。将 Servlet 名称改为 DilbertServlet,然后将包命名为 dilbert。在 Mobile Client Uses 区域中,先选择 Web Service Client in Web Application,然后选择 DailyDiblert.asmx,如下所示:

    单击 Next 按钮。

  3. 选择 DailyDilbertImage,如下所示:

    单击 Next 按钮。

  4. 将 Client Name 更改为 DilbertViewer,在包中添加 dilbert 名称,如下所示:

  5. 单击 Finish 按钮。

新工件已创建完成。Project 窗口现在会显示应用程序的逻辑视图,如下所示:

创建可视 MIDlet

在本节中,我们将创建一个可视 MIDlet,然后使用设计器来添加组件并将它们互相连接起来。

  1. 右键单击项目节点,然后选择 New > Visual MIDlet 选项。
  2. 将文件命名为 DilbertVisualMIDlet,并指定 dilbert 作为包名,如下所示:

    单击 Finish 按钮。

    这样将创建一个新的可视 MIDlet 文件,并在 Visual MIDlet Designer 中打开。

  3. 现在,使用 Palette(Ctrl-Shift-8)拖放一个 Alert 组件和一个 Wait Screen 组件到画布上,如下所示:

    您可以将这些组件放在设计器的任意位置。

在下一节中,我们将创建一个新的组件,并将它添加到组件面板中。然后,我们再将它拖放到设计器上。接下来,我们将这些组件互相连接起来,建立它们之间的关系。

创建画布组件

在本节中,我们将创建一个自定义画布组件用于显示图形文件。

  1. 右键单击 DilbertViewer 项目节点并选择 New > Other 选项。在 Categories 列表中,选择 MIDP 选项。在 File Types 列表中,选择 MIDP Canvas 选项,如下所示:

    ty/dilbert/dilbert-mob6.png" border="1" alt="Mobile application">

    单击 Next 按钮。

  2. 在 MIDP Class Name 字段中输入 DilbertCanvas,并将包命名为 dilbert 。单击 Finish 按钮。
  3. 在 IDE 中打开新创建的文件,然后插入代码,如下所示:
    package dilbert;

    import javax.microedition.lcdui.Canvas;
    import javax.microedition.lcdui.Graphics;
    import javax.microedition.lcdui.Image;

    public class DilbertCanvas extends Canvas {

    private int coordX, coordY;
    private int imageWidth, imageHeight;
    private Image image;
    private int screenWidth, screenHeight;

    /** Creates a new instance of DilbertCanvas */
    public DilbertCanvas() {
    screenHeight = getHeight();
    screenWidth = getWidth();
    }

    public void setImage(Image image) {
    this.imageWidth = image.getWidth();
    this.imageHeight = image.getHeight();
    this.image = image;
    }

    protected void paint(Graphics graphics) {
    graphics.setColor(255, 255, 255);
    graphics.fillRect(0, 0, getWidth(), getHeight());
    graphics.drawImage(image, coordX, coordY, Graphics.LEFT | Graphics.TOP);
    }

    protected void keyPressed(int keyCode) {
    int key = getGameAction(keyCode);
    if (key == DOWN) {
    if (coordY - screenHeight + imageHeight > 0) {
    coordY -= 10;
    }
    } else if (key == UP) {
    if (coordY < 0) {
    coordY += 10;
    }
    } else if (key == RIGHT) {
    if (coordX - screenWidth + imageWidth > 0) {
    coordX -= 10;
    }
    } else if (key == LEFT) {
    if (coordX < 0) {
    coordX += 10;
    }
    }
    repaint();
    }
    }
  4. 右键单击 DilbertCanvas 项目节点,然后选择 Build Project 选项。现在,我们已经构建并编译了画布组件。

在下一节中,我们将组件添加到组件面板上,然后再将它从组件面板拖放到设计器上。

将画布组件添加到组件面板

接下来,我们将画布组件添加到调色板上,然后将画布组件整合到应用程序中。

  1. 在编辑器中打开 DilbertVisualMIDlet 文件,然后打开 Palette (Ctrl-Shift-8)。在 Palette 中单击鼠标右键,然后选择 Palette Manager 选项。此时将出现 Palette Manager,如下所示:

  2. 单击 Add to Palette 按钮。此时将出现 Add to Palette 向导,如下所示。其中的移动应用程序包含您要添加到组件面板的 Java 类:

    单击 Next 按钮。

  3. 选择 dilbert.DilbertCanvas 选项。

    单击 Finish 按钮。

  4. 检查所看到的新增画布类,它应如下所示:

使用画布组件

  1. 打开可视 MIDlet 和 Palette(Ctrl-Shift-8)。在组件面板中,将 Custom 类别中的 DilbertCanvas 项目拖放到设计器中。

  2. 右键单击所拖放的画布组件,然后选择 New/Add > OK 命令,如下所示:

    在 Navigator(Ctrl-7)中,您将看到以下内容:

  3. 通过将这些组件连接起来创建一个流程,如下所示:

     

    • 将 Mobile Device 的 Started 点连接到 waitScreen 组件。
    • waitScreen 组件的 Success 命令连接到 dilbertCanvas 组件。
    • waitScreen 组件的 Failure 命令连接到 alert 组件。
    • dilbertCanvas 组件的 okCommand 连接到 Mobile Device。

    此时,您将看到以下内容:

  4. 切换到 Source 视图中,然后修改 getTask() 方法,如以下黑体内容所示:
    private byte[] dailyDilbertImage_returnValue;

    public SimpleCancellableTask getTask() {
    if (task == null) {
    // write pre-init user code here
    task = new SimpleCancellableTask();
    task.setExecutable(new org.netbeans.microedition.util.Executable() {
    public void execute() throws Exception {

    if (dailyDilbertImage_returnValue == null) {
    DilbertViewer client = new DilbertViewer();
    dailyDilbertImage_returnValue = client.dailyDilbertImage();
    Image dilbertImage = Image.createImage(dailyDilbertImage_returnValue, 0, dailyDilbertImage_returnValue.length);
    getDilbertCanvas().setImage(dilbertImage);
    }

    }
    });
    // write post-init user code here
    }
    return task;
    }

转换图像

现在,我们已经创建了一个客户机应用程序,可用于接收每天的图像。但是所接收的图像是 GIF 格式,这对于内存有限的移动设备来说太大了。因此,我们需要将图像转换为 PNG 格式,这对于许多不同显示尺寸的移动设备来说小很多,而且更容易调节大小。

  1. 打开 DailyDilbert_Proxy 文件,如下所示:

  2. 修改 dailyDilbertImage() 方法,在其中添加以下突出显示的代码:
    public byte[] dailyDilbertImage() throws RemoteException, Exception {
    try {
    ByteArrayInputStream in = new ByteArrayInputStream(getService().getDailyDilbertSoap().dailyDilbertImage());
    BufferedImage image = ImageIO.read(in);
    ByteArrayOutputStream out = new ByteArrayOutputStream();
    ImageIO.write(image, "png", out);
    return out.toByteArray();
    } catch (java.rmi.RemoteException ex) {
    throw ex;
    } catch (Exception ex) {
    throw ex;
    }

    }

部署应用程序

首先,我们需要部署 Web 应用程序。然后将运行移动应用程序。

  1. 在 Projects 窗口中,右键单击 DilbertWebApplication 项目节点,然后选择 Deploy Application 选项。如果服务器还没有运行,那么它将会启动。然后将应用程序部署到服务器中。可以在 Services 窗口中查看应用程序是如何部署的,如下所示:

  2. 右键单击移动项目,然后选择 Run 选项。运行移动应用程序。此时将打开设备仿真器。在设备仿真器屏幕中,单击 Launch 下面的按钮。然后单击 Select 按钮。应用程序将转至互联网,然后返回最新的 Dilbert 漫画,如下所示:

结束语

本教程展示了如何使用 Mobile Client to Web Application 快速创建一个使用 Web 服务的 MIDlet。

本教程还演示了如何创建一个自定义组件,以及如何使用可视 Mobile 设计器(Visual Mobile Designer )将其添加到应用程序中。

未来计划

除了 IDE 中内建的关于 Java ME CDC 开发的帮助文档外,以下链接也提供了关于 Mobility 包的技术教程和文章:

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值