BlackBerry 触摸屏设备编程

最新推荐文章于 2024-09-18 11:19:13 发布

BBturials

最新推荐文章于 2024-09-18 11:19:13 发布

阅读量1.8k

点赞数

作者: 王志刚

一触摸屏幕设计需要注意的地方

开发用于带触摸屏的 Blac k Ber r y ® 设备的应用程序时，您应考虑这些设备的以下 U I 功能：

• 触摸屏

• 屏幕方位的重要性

• 触摸屏键盘

• 加速度计（一些带触摸屏的 Bla c kB e rr y 设备上）

关于这些项目的具体内容和细节，可以参考 blackbe r r y 的编程白皮书： BlackBe r r y Ja v a A pp l ic a ti o n

Tra n si t io n in g t o T o uc h S cre e n D ev e lo p me n t .

二触摸屏幕的具体编程和设计的要求

随着触摸屏幕手机的引入， Bla c kB e rr y 也加入了相应 API 的支持：

net . ri m .d e vi c e. a pi . ui . T o uch s cr e e n 这个类的作用就是系统用来判别当前手机是否是触屏的 uti l it y 类别，所以一个比较通用的 jav a 程序的做法就是在程序入口中加入这样的逻辑判断：

if (Touchscreen.isSupported ())

{

}

else

{

/* Touch screen logic */

UiApplication.getUiApplication ().invokeLater( new Runnable()

{

public void run()

{

}

});

}

Dialog.alert ( "This application requires a touch screen device." );

System.exit (0);

在 JDE5.0 的示例程序中，有一个例子 touchdemo ，有关于这个工具类的具体使用方法，可以参考相应的代理例子在做一个通用的 bl ac kb er ry 客户端程序。

触屏手机的引入，可以加入对屏幕的方向的变化，这个在原有的全键盘手机中是没有的，所以在触摸屏幕手机开发应用过程中，需要加入相应的响应的逻辑 . 有两种方式可以用来对屏幕的方位进行控制和调整，第一种方式是在 screen 的 su bl ay ou t 方法中。

public void sublayout(int width, int height)

{

//update scrren layout based on orientation

if(Display.getOrientation()== Display.ORIENTATION_LANDSCAPE)

{

invalidate();

}

else if(Display.getOrientation()== Display.ORIENTATION_PORTRAIT)

{

invalidate();

}

supe r.sublayout(width, height);

}

还有一种方式是在应用中显式调用屏幕的方位信息，然后做出调整：

switch(Display.getOrientation())

{

case Display.ORIENTATION_LANDSCAPE:

Dialog.alert("Screen orientation is landscape"); break;

case Display.ORIENTATION_PORTRAIT:

Dialog.alert("Screen orientation is portrait"); break;

case Dis play.ORIENTATION_SQUARE:

Dialog.alert("Screen orientation is square"); break;

default:

Dialog.alert("Screen orientation is not known"); break;

}

除了对屏幕方位也就是重力切换的处理，在触摸屏幕编程中，需要考虑 UI 事件的处理和全键盘手机的不同，关于这部分的具体处理，可以参考下面部分的示例以及后续的内容介绍。

三一个触摸屏幕应用界面的例子

本章以一个定制的黑莓 UI 展示程序为例，说明黑莓编程中需要注意的各个方面，通过一个可以定制的个性化的 toolbar 的实现以及黑莓应用的背景的切换，来说明触摸屏幕编程和普通全键盘手机编制程序的区

别。

黑莓标准的 UI 组件里面是没有 toolbar 的，这里要设计一个 toolbar ，可以考虑标准 UI 组件的扩展，这里我们让 toolbar 继承自 H or iz on ta lF ie ld Ma na ge r . 基本的 toolbar 的特性包括排列的方向和 toolbar 的高宽等等以及组件的排列性质。这些都是可以配置的，如果要做到一个比较灵活的设计，这里我们写死。

//public class ToolBarField extends HorizontalFieldManager public class ToolBarField extends HorizontalFieldManager

{

//private static final int DefaultButtonHeight = 55;

//private static final int DefaultButtonWidth = 55; private static final int DefaultButtonHeight = 129; private static final int DefaultButtonWidth = 129;

private Vector leftJustifiedButtons = new Vector(); private Vector rightJustifiedButtons = new Vector(); private int preferredHeight = DefaultButtonHeight; private int sideMargin = 3;

private int buttonSpacing = 2;

private int preferredWidth = Display.getWidth();

private Bitmap bg = null;

……

}

在 toolbarfield 类的设计中，核心的部分在于

private Vector leftJustifiedButtons = new Vector();

private Vector rightJustifiedButtons = new Vector(); 这两个是为了放置用户加入扩种的具体 field 组件，这里使用的是标准的 vector 元素，可以添加也可以删除组件，这里我们简单起见，只实现添加的接口，如下面的 addbutton 方法所示：

public void addButton(ToolBarButtonField button, boolean leftJustified)

{

super.add(button);

if (button.getPreferredHeight() > preferredHeight)

preferredHeight = button.getPreferredHeight();

if (leftJustified)

{

}

else

{

}

leftJustifiedButtons.addElement(button);

rightJustifiedButtons.addElement(button);

为了实现更加可供定制化的效果，可以扩充 Horizont almanager 的 subpaint 方法，添加部分背景处理

的能力：

protected void subpaint(Graphics graphics)

{

if (bg != null)

{

for (int x = 0; x < Display.getWidth();)

{

}

else

{

graphics.drawBitmap(x, 0, getPreferredWidth(), bg.getHeight(), bg, 0, 0);

x += bg.getWidth();

graphics.setColor(Color.BLACK);

graphics.drawRect(0, 0, getPreferredWidth(), getPrefe rredHeight());

}

super.subpaint(graphics);

}

如果所有的功能扩充到这里，我们所设计的 toolbar 也只是一个可供全键盘手机使用的版本，这里我们加

入一个新的 touchevent 方法，用来加入对触摸屏幕的响应有了这个方法，这个就是一个专门针对

touchscreen 的控件版本版本：

public boolean touchEvent(TouchEvent event)

{

int eventID = event.getEvent();

if (eventID == TouchEvent.DOWN || eventID == TouchEvent.UP)

{

boolean hit = false; int x = event.getX(1); int y = event.getY(1);

for (int f = 0; f < getFieldCount(); f++)

{

ToolBarButtonField field = (ToolBarButtonField)getField(f);

XYRect ext = field.getExtent();

if (ext.contains(x, y))

{

hit = true;

if (eventID == TouchEvent.UP)

{

}

else

{

}

field.setActive(false);

this.setFocus();

field.setFocus();

field.setActive(true);

invalidate();

break;

}

if (!hit && eventID == TouchEvent.UP)

{

this.setFocus();

invalidate();

}

return true;

}

基本上 UI 的展现，如果把如上的部分做完了，有了基本的 UI 的事件的处理之后也就可以了，系统会自动对

UI 的布局做一些调整，但是作为一个标准的应用组件，需要考虑的是如何让 UI 的展现在任何情况下都能达到比较理想的效果，那么就需要对触屏手机的屏幕视图方位切换事件进行相应的处理和考虑了。

protected void sublayout(int maxWidth, int maxHeight)

{

this.setExtent(maxWidth, getPreferredHeight());

Enumeration iter = leftJustifiedButtons.elements();

if (maxHeight > Display.getHeight())

maxHeight = Display.getHeight();

int y = 0;

int curX = sideMargin;

// Layout the left justified buttons

while (iter.hasMoreElements())

{

ToolBarButtonField button = (ToolBarButtonField)iter.nextElement();

this.layoutChild(button, button.getPreferredWidth(), button.getPreferredWidth());

this.setPositionChild(button, curX, y);

curX = curX + button.getWidth();

}

int minX = curX + buttonSpacing;

int totalButtonsWidth = 0;

// Layout the right justified buttons

iter = rightJustifiedButtons.elements();

while (iter.hasMoreElements())

{

ToolBarButtonField button = (ToolBarButtonField)iter.nextElement(); this.layoutChild(button, button.getPreferredWidth(), button.getPreferredWidth()); totalButtonsWidth += button.getWidth() + buttonSpacing;

}

totalButtonsWidth -= buttonSpacing;

if ((totalButtonsWidth+minX) > maxWidth)

{

preferredWidth = totalButtonsWidth+minX;

}

curX = maxWidth;

iter = rightJustifiedButtons.elements();

while (iter.hasMoreElements())

{

ToolBarButtonField button = (ToolBarButtonField)iter.nextElement();

this.layoutChild(button, button.getPreferredWidth(), button.getPreferredWidth());