分享
 
 
 

使用Canvas制作简单的游戏菜单

王朝other·作者佚名  2008-05-31
窄屏简体版  字體: |||超大  

我们知道MIDP的图形用户界面分为两类,分别是高级图形用户界面和低级用户界面。一般来讲高级图形用户界面类使用起来比较方便,可移植性强,但是程序员对他的控制能力也很低,因为它们的界面表现是由底层控制的,而不是我们控制的。相比高级UI类,低级UI类则使用起来更难一些,但是控制能力更强,可以做出自己需要的界面。

Canvas和Graphics是我们必须熟练使用的两个类,分别代表了画布和画笔(事实上更丰富,姑且这么比喻)。而我们则是画画的人,而指导我们如何下笔的就是java doc了,再加上勤奋努力一定可以画出不错的界面。比如tabbed菜单,二级菜单等。这里我们讲述一个简单菜单的制作方式。

在画菜单的时候,需要考虑两面的问题,第一是计算相对位置,让菜单能够尽可能适应更多的机型,尽量少使用绝对值。例如画下面的菜单的时候

我们应该计算菜单的每个条目的高度,这些可以有Font的高度算出,当然你可以给条目留一些padding的距离。还应该计算条目的最宽值,毕竟每个条目的字数不一样。这样基本知道了整个菜单占的空间。最后还需要计算菜单在屏幕的位置。菜单的绘制如下所示:

public void paint(Graphics g){

//清除屏幕

int color = g.getColor();

g.setColor(0xFFFFFF);

g.fillRect(0,0,getWidth(),getHeight());

g.setColor(color);

//计算整个菜单的高度,宽度和(x,y)

int rectWidth = PReferWidth;

int rectHeight = preferHeight * LABELS.length;

int x = (getWidth()-rectWidth)/2;

int y = (getHeight()-rectHeight)/2;

//画矩形

g.drawRect(x,y,rectWidth,rectHeight);

for(int i = 1;i<LABELS.length;i++){

g.drawLine(x,y+preferHeight*i,x+rectWidth,y+preferHeight*i);

}

//画菜单选项,并根据selected的值判断焦点

for(int j = 0;j<LABELS.length;j++){

if(selected == j){

g.setColor(0x6699cc);

g.fillRect(x+1,y+j*preferHeight+1,rectWidth-1,preferHeight-1);

g.setColor(color);

}

g.drawString(LABELS[j],x+8,y+j*preferHeight+4,Graphics.LEFTGraphics.TOP);

}

}

第二个重要的问题是:焦点的切换,在高级UI类中,这是不需要我们处理的。但是使用Canvas制作菜单需要自己来处理焦点的移动,这里我们定义一个int类型变量selected,来记录焦点所在的菜单条目位置,也就是选择的索引。当用户按键的时候,我们在keyPressed()方法中判断用户的移动方向,对selected进行相关的加减运算,然后repaint()整个屏幕即可。

public void keyPressed(int keyCode){

//根据用户输入更新selected的值,并重新绘制屏幕

int action = this.getGameAction(keyCode);

switch(action){

case Canvas.FIRE:

printLabel(selected);

break;

case Canvas.DOWN:

selected = (selected+1)%4;

break;

case Canvas.UP:{

if(--selected < 0){

selected+=4;

}

break;

}

default:

break;

}

repaint();

serviceRepaints();

}

这样我们就制作出了一个基本的菜单,你还可以发挥想象给被选中的菜单增加动画效果。MenUCanvas的代码如下所示:

package com.j2medev.chapter3;

import javax.microedition.lcdui.*;

public class MenuCanvas extends Canvas{

//selected变量标记了焦点位置

private int selected = 0;

private int preferWidth = -1;

private int preferHeight = -1;

public static final int[] OPTIONS = {0,1,2,3};

public static final String[] LABELS={"New Game","Setttings","High Scores","Exit"};

public MenuCanvas() {

selected = OPTIONS[0];

//计算菜单选项的长度和高度值

Font f = Font.getDefaultFont();

for(int i = 0;i<LABELS.length;i++){

int temp = f.stringWidth(LABELS[i]);

if(temp > preferWidth){

preferWidth = temp;

}

}

preferWidth = preferWidth + 2*8;

preferHeight = f.getHeight()+2*4;

}

public void paint(Graphics g){

//清除屏幕

int color = g.getColor();

g.setColor(0xFFFFFF);

g.fillRect(0,0,getWidth(),getHeight());

g.setColor(color);

//计算整个菜单的高度,宽度和(x,y)

int rectWidth = preferWidth;

int rectHeight = preferHeight * LABELS.length;

int x = (getWidth()-rectWidth)/2;

int y = (getHeight()-rectHeight)/2;

//画矩形

g.drawRect(x,y,rectWidth,rectHeight);

for(int i = 1;i<LABELS.length;i++){

g.drawLine(x,y+preferHeight*i,x+rectWidth,y+preferHeight*i);

}

//画菜单选项,并根据selected的值判断焦点

for(int j = 0;j<LABELS.length;j++){

if(selected == j){

g.setColor(0x6699cc);

g.fillRect(x+1,y+j*preferHeight+1,rectWidth-1,preferHeight-1);

g.setColor(color);

}

g.drawString(LABELS[j],x+8,y+j*preferHeight+4,Graphics.LEFTGraphics.TOP);

}

}

public void keyPressed(int keyCode){

//根据用户输入更新selected的值,并重新绘制屏幕

int action = this.getGameAction(keyCode);

switch(action){

case Canvas.FIRE:

printLabel(selected);

break;

case Canvas.DOWN:

selected = (selected+1)%4;

break;

case Canvas.UP:{

if(--selected < 0){

selected+=4;

}

break;

}

default:

break;

}

repaint();

serviceRepaints();

}

//showNotify()在paint()之前被调用

public void showNotify(){

System.out.println("showNotify() is called");

}

private void printLabel(int selected){

System.out.println(LABELS[selected]);

}

}

(出处:http://www.knowsky.com)

 
 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
2023年上半年GDP全球前十五强
 百态   2023-10-24
美众议院议长启动对拜登的弹劾调查
 百态   2023-09-13
上海、济南、武汉等多地出现不明坠落物
 探索   2023-09-06
印度或要将国名改为“巴拉特”
 百态   2023-09-06
男子为女友送行,买票不登机被捕
 百态   2023-08-20
手机地震预警功能怎么开?
 干货   2023-08-06
女子4年卖2套房花700多万做美容:不但没变美脸,面部还出现变形
 百态   2023-08-04
住户一楼被水淹 还冲来8头猪
 百态   2023-07-31
女子体内爬出大量瓜子状活虫
 百态   2023-07-25
地球连续35年收到神秘规律性信号,网友:不要回答!
 探索   2023-07-21
全球镓价格本周大涨27%
 探索   2023-07-09
钱都流向了那些不缺钱的人,苦都留给了能吃苦的人
 探索   2023-07-02
倩女手游刀客魅者强控制(强混乱强眩晕强睡眠)和对应控制抗性的关系
 百态   2020-08-20
美国5月9日最新疫情:美国确诊人数突破131万
 百态   2020-05-09
荷兰政府宣布将集体辞职
 干货   2020-04-30
倩女幽魂手游师徒任务情义春秋猜成语答案逍遥观:鹏程万里
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案神机营:射石饮羽
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案昆仑山:拔刀相助
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案天工阁:鬼斧神工
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案丝路古道:单枪匹马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:与虎谋皮
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:李代桃僵
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:指鹿为马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:小鸟依人
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:千金买邻
 干货   2019-11-12
 
推荐阅读
 
 
 
>>返回首頁<<
 
靜靜地坐在廢墟上,四周的荒凉一望無際,忽然覺得,淒涼也很美
© 2005- 王朝網路 版權所有