移动信息设备描述（Mobile Information Device Profile，MIDP) 1.0 版本提供了一套基本组件，用于支持应用程序需要的大多数用户界面（UI）。但是，如果您的需求比较复杂，那么一般必须要从Canvas派生子类，并重新设计。

MIDP 2.0 改变了所有这些。现在您可以建立自定义组件，这样您就可以对用户交互进行细粒度的控制，而且可以适应现有的窗体框架，符合设备本身的观感。

在这篇文章里，我们通过建立一个简单的Outliner MIDlet，来研究这些新的定制功能。大纲是用来组织想法、保持列表，甚至进行项目计划的工具——是一个在移动设备上非常有用的应用程序。Outliner MIDlet让用户可以构建层次结构良好的窗体项目大纲。它们可以加入或删除，缩进或凸出，还可以用一种在MIDP 2.0出现之前不可能的方法折叠和展开项目。

窗体：回顾

如果您对于使用 MIDP 建立用户界面不熟，请让我们回顾一下基础知识。

MIDP 1.0提供了一些骨干UI组件，包括选项组（ChoiceGroup）,日期字段（DateField）, Gauge, 图像项目ImageItem）,字符串项目（StringItem）, 以及文本字段（TextField）。这些类全部扩展自公共基类Item。和它们的AWT等价物非常相似，项目是我们用来控制底层本机UI小部件的抽象。因为本机实现在不同设备之间，可能有很大的差异，而事实上也是这样，所以Item公共接口对于底层小部件的外观和行为只提供了非常少的控制。

窗体的存在，是为了按行排列项目，使其最好地适合屏幕尺寸、适应项目运行所在设备的能力。至少从理论上讲，MIDP实现可以方便、无缝地使您的应用程序适应设备硬件；副作用是您对用户界面观感的影响受到限制。

有什么新东西？

MIDP 2.0改善了窗体，为项目布局提供了更好的控制，还提供了一个新类CustomItem，这个类让您可以建立自己的窗体项目。Outliner利用全部这些能力，为用户提供以下特性：

应用程序显示多行文本，用不同的数量缩进，形成一个可视的层次结构。窗体增强的布局能力使这种表示成为可能。

用户可以折叠大纲的任何一行，把层次结构中该行之下的行隐藏起来。会有一个可视指示器，表示指定行是展开的还是折叠的。您可以覆盖 CustomItem的paint()方法，按照自己喜欢的方式画出这样的指示器。

用户还可以按照任意顺序重新排列行。移动一个行，也会同时移动它所有的下级行。现在，这个命令可以专门用于一个项目，这样菜单就能够做到上下文敏感。向上移动、向下移动、展开、以及折叠命令只有在适合项目当前状态的时候才会出现。

这些特性在MIDP 1.0里都是不可能的。下面让我们看看这种魔术是如何做到的。

建立Outline项目类

Outliner类自己就是一个普通的MIDlet。功能的核心是CustomItem的子类，叫做OutlineItem。你要实现自己的CustomItem类时需要做的事，在这个类里都做了，所以您应当好好在源代码里看看它。构造函数是一个开始的好地方：

<%@ control language="c#" autoeventwireup="true" codefile="webusercontrol2.ascx.cs"   
inherits="webusercontrol2" %>
/**

* 用指定的初始缩进和文本建立  OutlineItem

*/

public OutlineItem( int inIndent, String inText )

{

// 我们不想要系统提供的标签

super( null );

indent = inIndent;

text = inText;

hiddenChildren = null;

// 定义布局

setLayout( LAYOUT_EXPAND | LAYOUT_TOP | LAYOUT_NEWLINE_AFTER );

// 加入一直适用的命令

addCommand( editCommand );

addCommand( insertCommand );

}  
  

调用构造函数，把要显示的文本、项目应当缩进的次数传递给构造函数，就可以建立OutlineItem。

在构造函数里，第一项任务是调用超类的构造函数。MIDP项目不仅仅代表UI小部件本身，还有一个标签向用户标识部件。例如，一个文本字段是一个包含文本的框；它的标签通常出现在它的左边，是描述文本框中内容的单词，比如Name或Password。大纲项不需要标签，所以我们的构造函数把null作为必要参数传给超类的构造函数。

在使用传递给构造函数的参数初始化对象的状态之后，下一步就是配置项目的布局指令，把一些命令直接加给项目。稍后我会解释布局指令和专门用于项目的命令。

CustomItem 有5个我们必须实现的抽象方法。在这些方法里，paint() 方法可以让您控制项目的外观。

paint()方法的参数包含项目的宽度和高度，它们由窗体的布局逻辑、图形对象、转换方式决定，所以它的原点项目的左上角。下面是OutlineItem中paint()的实现：

<%@ control language="c#" autoeventwireup="true" codefile="webusercontrol2.ascx.cs"  
 
inherits="webusercontrol2" %>public void paint( Graphics g, int w, int h )

{

// 用背景色全部清除

g.setColor( DISPLAY.getColor( DISPLAY.COLOR_BACKGROUND ) );

g.fillRect( 0, 0, w, h );

// 现在用前景色来画图

g.setColor( DISPLAY.getColor( DISPLAY.COLOR_FOREGROUND ) );

if ( isCollapsed() )

{

// 画一个代表隐藏项目的填充的圆

g.fillArc( indent * INDENT_MARGIN   2, 2, 

FONT_HEIGHT-7, FONT_HEIGHT-7, 0, 360 );

}

else

{

// 没有隐藏项目，所以画一个空心圆

g.drawArc( indent * INDENT_MARGIN   2, 2, 

FONT_HEIGHT-7, FONT_HEIGHT-7, 0, 360 );

}

// 画出文本

g.drawString( text, 

indent * INDENT_MARGIN   FONT_HEIGHT, 0, g.TOP | g.LEFT );


}