J2ME GUI实战之二 ----------LWUIT实现手机九宫图

本文来自：http://blog.youkuaiyun.com/hellogv/ ，转载必须注明出处！
本文的源代码，已放到 http://download.youkuaiyun.com/user/hellogv 供大家下载！

首先，想让大家看看九宫图实现之后的界面：


本文所用的代码，是来自LWUIT所提供的Sample例子，但是对例子做出以下修改：
1.设计自主的res资源文件
2.把builde.xml里面的<target name="post-compile"> 。。。。。</target> 删除
3.把所用的res文件放到一个名为res的文件夹，并与源代码放在一起
4.把ResourceBuilder.jar也删除，util文件夹里的ResourceBuilder.jar绝对不能删，是用于设计res文件

针对以上4点，说明一下为什么这么做：
原Sample例子的res文件，是使用util文件夹里的ResourceEdit.exe设计，而且还在builde.xml中使用ResourceBuilder.jar再重新生成一次res文件并与源文件组合，这显然有点冗余，因为直接用ResourceEdit.exe设计的res文件放到源文件目录里即可。也许Sample作者直接使用ANT编译或者是其他IDE要求，本文所用的IDE为netbeans。

OK，接下来就是源代码修改了，Sample源代码可是写得很长很长，要看也得花不少时间，但是，我保证大家看完后一定领略到JAVA大牛的编程功力之深！！！为了方便以后使用，所以我把Sample中实现九宫图和一些小操作的代码保留，其他都去掉了，请JAVA大牛切勿见笑哈。
以下给出关键代码:

1. /*
2. *Copyright?2008SunMicrosystems,Inc.Allrightsreserved.
3. *Useissubjecttolicenseterms.
4. *
5. */
6. packagecom.sun.lwuit.uidemo;
8. importcom.sun.lwuit.Button;
9. importcom.sun.lwuit.animations.CommonTransitions;
10. importcom.sun.lwuit.Command;
11. importcom.sun.lwuit.Component;
12. importcom.sun.lwuit.Dialog;
13. importcom.sun.lwuit.Display;
14. importcom.sun.lwuit.Form;
15. importcom.sun.lwuit.Image;
16. importcom.sun.lwuit.Label;
17. importcom.sun.lwuit.animations.Transition;
18. importcom.sun.lwuit.animations.Transition3D;
19. importcom.sun.lwuit.events.ActionEvent;
20. importcom.sun.lwuit.events.ActionListener;
21. importcom.sun.lwuit.events.FocusListener;
22. importcom.sun.lwuit.layouts.GridLayout;
23. importcom.sun.lwuit.plaf.Style;
24. importcom.sun.lwuit.plaf.UIManager;
25. importcom.sun.lwuit.util.Resources;
28. publicclassUIDemoMIDletextendsjavax.microedition.midlet.MIDletimplementsActionListener{
30. privatestaticfinalCommandexitCommand=newCommand("Exit",1);
32. privateString[]btn_name=newString[]{//九宫图的名称，同时也是图标的名称
33. "Image1","Image2","Image3","Image4","Image5","Image6","Image7",
34. "Image8","Image9"
35. };
36. privatestaticTransitioncomponentTransitions;
37. privatestaticFormmainMenu;//主窗体
38. privateintcols;
39. privateintelementWidth;
41. protectedvoidstartApp(){
42. try{
43. Display.init(this);
44. Resourcesr=Resources.open("/res/resources.res");//读取资源文件
46. setMainForm(r);
47. }catch(Throwableex){
48. ex.printStackTrace();
49. Dialog.show("Exception",ex.getMessage(),"OK",null);//hellogv最爱的提示框弹出方式
50. }
51. }
52. protectedvoidpauseApp(){
53. }
55. protectedvoiddestroyApp(booleanarg0){
56. }
58. publicstaticvoidsetMenuTransition(Transitionin,Transitionout){
59. mainMenu.setMenuTransitions(in,out);
60. UIManager.getInstance().getLookAndFeel().setDefaultMenuTransitionIn(in);
61. UIManager.getInstance().getLookAndFeel().setDefaultMenuTransitionOut(out);
62. }
64. publicstaticvoidsetComponentTransition(Transitiont){
65. componentTransitions=t;
66. mainMenu.setSmoothScrolling(false);
67. }
69. publicstaticTransitiongetComponentTransition(){
70. returncomponentTransitions;
71. }
73. publicstaticvoidbackToMainMenu(){
74. mainMenu.refreshTheme();
75. mainMenu.show();
76. //forseries40devices
77. System.gc();
78. System.gc();
79. }
81. privatevoidsetMainForm(Resourcesr){
82. //设置主题
83. UIManager.getInstance().setThemeProps(r.getTheme("businessTheme"));
84. mainMenu=newMainScreenForm("LWUITDemo");
85. intwidth=Display.getInstance().getDisplayWidth();//取得全屏的宽度
86. elementWidth=0;
88. //效果，可以实现类似IPhone、S1智能机的TouchFlo的动态窗体切换效果!**********************
89. mainMenu.setTransitionOutAnimator(CommonTransitions.createSlide(CommonTransitions.SLIDE_HORIZONTAL,false,500));
90. mainMenu.setTransitionInAnimator(CommonTransitions.createSlide(CommonTransitions.SLIDE_HORIZONTAL,true,500));
91. UIDemoMIDlet.setComponentTransition(Transition3D.createCube(600,false));
92. //***************************************************************************************************************
94. Image[]selectedImages=newImage[btn_name.length];//按钮被选中时的图片
95. Image[]unselectedImages=newImage[btn_name.length];//按钮未被选中的图片
97. for(inti=0;i<btn_name.length;i++){
99. //---------读取选中时的图片
100. selectedImages[i]=r.getImage(btn_name[i]);
102. //--------读取未被选中的图片
103. unselectedImages[i]=r.getImage(btn_name[i]);
105. finalButtonbutton=newButton(btn_name[i],unselectedImages[i])
106. {
107. publicImagegetPressedIcon(){
108. Imagei=getIcon();
109. returni.scaled((int)(i.getWidth()*0.8),(int)(i.getHeight()*0.8));
110. }
111. };
113. button.setRolloverIcon(selectedImages[i]);
114. Styles=button.getStyle();
115. s.setBorder(null);
116. s.setBgTransparency(0);
117. s.setBgSelectionColor(0xffffff);
118. button.setAlignment(Label.CENTER);
119. button.setTextPosition(Label.BOTTOM);
120. mainMenu.addComponent(button);
121. button.addActionListener(this);
122. //按钮焦点处理,用于实现按钮特效
123. button.addFocusListener(newFocusListener(){
124. publicvoidfocusGained(Componentcmp){//按钮取得焦点时的特效
125. if(componentTransitions!=null){
126. mainMenu.replace(button,button,componentTransitions);
127. }
128. }
129. publicvoidfocusLost(Componentcmp){}//按钮失去焦点时的特效
130. });
131. elementWidth=Math.max(button.getPreferredW(),elementWidth);
132. }
134. cols=width/elementWidth;
135. introws=btn_name.length/cols;
136. mainMenu.setLayout(newGridLayout(rows,cols));//GridLayout为九宫图的排列方式
137. mainMenu.addCommand(exitCommand);
139. mainMenu.setCommandListener(this);
140. mainMenu.show();
141. }
143. /**
144. *控件处理函数
145. */
146. publicvoidactionPerformed(ActionEventevt){
147. try{//通过异常处理来判断事件来源
148. Commandcmd=evt.getCommand();
149. if(cmd.getCommandName().equals("Exit"))
150. notifyDestroyed();
151. }catch(Exceptione)
152. {
153. Stringsel_button=((Button)(evt.getSource())).getText();//取得所选按钮的名称
154. if(sel_button.equals("Image1"))
155. newAnimationDemo().form.show();
156. elseif(sel_button.equals("Image2"))
157. newPaintingDemo().form.show();
158. elseif(sel_button.equals("Image3"))
159. newLayoutDemo().form.show();
160. }
161. }
162. }

好了，本文就介绍到这里，关于J2ME LWUIT的摸索还在继续，希望大家多多支持LWUIT，让它越做越好！