首页 > 开发 > Java > 正文

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

2020-02-05 13:46:23
字体:
来源:转载
供稿:网友
  • 本文来源于网页设计爱好者web开发社区http://www.html.org.cn收集整理,欢迎访问。
  •   我们知道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.left|graphics.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.left|graphics.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]);
    }
    }
    发表评论 共有条评论
    用户名: 密码:
    验证码: 匿名发表