BlackBerry 高级UI设计.pdfVIP

BlackBerry 高级UI 设计 作者：王志刚 概论 3 1 基于MIDP 的UI 设计4 1.1 MIDP 高级UI 4 1.2 MIDP 低级UI 6 2 基于Third party 的UI 库的设计 9 2.1 基于LWUIT 的UI 库的设计规范 9 3 基于BlackBerry 的UI 库的设计 11 4 基于SVG 的UI 设计 11 4.1 什么是SVG 11 4.2 Mobile 上的svg 12 4.3 RIM 上的svg 12 5 基于BlackBerry Widget 的UI 设计 18 概论 这篇文档讲述的是如何在BlackBerry 设备上应用的UI 效果，文档的介绍的内容包括如下部分: 1. 基于MIDP 的UI 2. 基于3rd-party 的UI library 的应用 3. 基于BlackBerry UI 组件的应用 4. 基于SVG(JSR 226) 的UI 设计 5. 基于Widget 的UI 设计 本文的组成部分是以以一个传统移动应用的九宫格程序的UI 设计和实现为范例，讨论并着重介绍 了在BlackBerry 平台上设计UI 需要考虑和借用的技术，更好的包装BlackBerry 的应用 通过对UI 应用的讨论，本文也涉及到了在BlackBerry 应用开发中如何和第三方应用Library 集成， BlackBerry 上的网络应用开发等等方面的知识，文中涉及到的参考文档，都可以从RIM 中国开发 论坛上下载得到。 在阅读和参考本篇文档时，读者应该对BlackBerry 上的基本开工具和开发过程有些了解，如果想 参阅这些内容，可以参阅BlackBerry 中国。 1 基于MIDP 的UI 设计 上面的图是整个MIDP 中的LCDUI 包的组成结构，这个包包括完整的MIDLP 高级和低级UI 库。 1.1 MIDP 高级UI 我们在这一节要介绍LCDUI 库的具体组成类图。Screen 类系属于高级图形用户界面组件，Canvas 是低级图形用户界面组件，在同一时刻，只能有唯一一个Screen 或者Canvas 类的子类显示在屏 幕上。 使用高级界面，但是九宫格这样的屏幕铺放应用的实现是想不到好的办法，本身没有合适的控件可以 完成这个任务。一种可能的办法是通过定制高级UI 组件里面的元素，比如CustomItem, 用他来绘 制定宫格。本例就是使用CustomItem 来实现了一个九宫格效果，效果如下图所示 源代码如下所示: public class GridItem extends CustomItem { private Image image; public MyItem(Image image, String title,int width,int height) { this.image = image; } public void paint(Graphics g, int w, int h) { g.drawImage(this.image, w/2, 0, Graphics.HCENTER | Graphics.TOP); g.drawString(this.title, w/2, h - g.getFont().getHeight(), Graphics.HCENTER | Graphics.TOP); } 通过对 Form 的定制item 设置背景图片，找到一个work around 的办法，放置我们的九宫格图标， 剩下的就是对Form 主程序的设置了 Form f = new Form(CustomItem); int tempWidth = f.getWidth() / 4; int tempHeight = 60; for(int i = 0; i 9;i++) { String imgSrc = /img/ + i + .png; try { Image img = Image.createImage(imgSrc); MyItem mi = new MyItem(img,String.valueOf(i) + item,tempWidth,tempHeight); mi.setLayou