位置:海鸟网 > IT > JavaScript >

J2ME中实现可伸展目录树TreeList

J2ME里面有自带的List类,但是功能太弱,没有实现View和Model的分离,所以操作起来比较费事。本来事想写一个Canvas的TreeList,但是画起来算坐标又太麻烦,所以选取了一个折中的方法,继承List,实现一个操作起来比较方便的组件。

  目的:

  1.可伸缩的目录树结构,暂时先实现两层。

  2.Label和存储内容分离。

  3.激活和非激活图片分开。

  4.通过选择事件可以准确快速找到对应内容

  5.存储内容无关性,里面可以放置任何Object

  实现思路:

  1.封装一个ExpandItem类,用来存储每一条数据。

/**
* 默认图片
*/
private String imagePath="";
/*
* 激活图片,如果为空说明此图片无效
*/
private String selectImgPath=null;
/**
* 组
*/
public static int GROUP=1;
/**
* 记录
*/
public static int ITEM=0;
/**
* 是否选中,如果选中则默认为展开状态
*/
private boolean ifselected=false;
/**
* 显示Label
*/
private String label;
/**
* 类型:组,记录
*/
private int type;
/**
* 存储的对象
*/
  GROUP表示这个ITEM是一个父节点,下面包含字节点,这样它的Content将是一个Vector.ITEM表示这个ITEM是根节点。

  selectImgPath,是激活后的图标,可以为空,为空的时候选择了这个ITEM图标不变。

  然后就是ExpandList类,此类的数据结构如下:

private Vector itemList = new Vector();

/*用来存储内容的数据结构*/

private ExpandListItem currentSelectedObject = null;

/*当前所选择的对象,方便获取*/

private int currentSelectedIndex = -1;

/*当前选择的对象在队列中的Index,队列有两个,一个是真实数据的存储Vector,另外一个是显示在屏幕上的队列。这两个有时候是不一样的。因为有的节点有子节点*/

private Vector appearHookList = new Vector();

/*显示在屏幕上的Label队列*/
  总的思路如下:

  初始化List的时候,参数是一个Vector,里面可以是ExpandItem或者是Vector.然后根据ExpandItem里面的参数初始化屏幕,如果GROUP节点的ifselected状态为True则递归添加下面的子节点,否则只插入当前节点。图标也是一样,如果ifselected为True 则用激活图标否则用默认图标。

  在用户选择了一个结点后,取得当前的激活的Index号码,判断是不是父节点,如果是的话,首先更新这个父节点的Ifselected属性为True,然后重画这个List;(其实效率更高的方法是直接插入这个父节点的子节点,但是这样做的话,在移除的时候会稍微稍微麻烦一点。有时间我在改过来,呵呵)。如果选择的是子节点,则判断是否有激活图标,如果有,则更新这个图标,就好了。

  下面是效果


  附代码一份,这是我ME组件库中很早的版本了。别的组件以后在写。其实最好的方法就是写Canvas。

ExpandList.java

package com.skystudio.ExpandList;

public class ExpandListItem {
  public ExpandListItem(Object content,String imgPath,String selectImgPath,String Label,int type,boolean ifselected){
   this.selectImgPath=selectImgPath;
   this.imagePath=imgPath;
   this.content=content;
   this.label=Label;
   this.type=type;
   this.ifselected=ifselected;
  }
  /**
  * 默认图片
  */
  private String imagePath="";
  /*
  * 激活图片,如果为空说明此图片无效
  */
  private String selectImgPath=null;
  /**
  * 组
  */
  public static int GROUP=1;
  /**
  * 记录
  */
  public static int ITEM=0;
  /**
  * 是否选中
  */
  private boolean ifselected=false;
  /**
  * 显示Label
  */
  private String label;
  /**
  * 类型:组,记录
  */
  private int type;
  /**
  * 存储的对象
  */
  private Object content;
   public Object getContent() {
    return content;
   }
  public void setContent(Object content) {
   this.content = content;
  }
  public String getLabel() {
   return label;
  }
  public void setLabel(String label) {
   this.label = label;
  }
  public int getType() {
   return type;
  }
  public void setType(int type) {
   this.type = type;
  }
  public boolean Ifselected() {
   return ifselected;
  }
  public void setIfselected(boolean ifselected) {
   this.ifselected = ifselected;
  }
  public String toString() {
   return this.label+" ";
  }
  public String getImagePath() {
   return imagePath;
  }
  public void setImagePath(String imagePath) {
   this.imagePath = imagePath;
  }
  public String getSelectImgPath() {
   return selectImgPath;
  }
  public void setSelectImgPath(String selectImgPath) {
   this.selectImgPath = selectImgPath;
  }
}

--------------------------------------------------------------------------------

package com.skystudio.ExpandList;

import java.util.Vector;

import javax.microedition.lcdui.Command;
import javax.microedition.lcdui.CommandListener;
import javax.microedition.lcdui.Displayable;
import javax.microedition.lcdui.Image;
import javax.microedition.lcdui.List;

import com.skystudio.ui.toolkit.Util;

/**
* @author sky
*
*/
public class ExpandList extends List implements CommandListener {
  private Vector itemList = new Vector();

  private ExpandListItem currentSelectedObject = null;

  private int currentSelectedIndex = -1;

  private Vector appearHookList = new Vector();

  public ExpandList(String title, int type, Vector itemList) {
   super(title, type);
   this.itemList = itemList;
   this.setCommandListener(this);
   LoadList();
  }

  public void appendItem(ExpandListItem item, Image icon, boolean ifSub) {
   appearHookList.addElement(item);
   System.out.println("Add current display list:" + item);
   if (!ifSub) {
    this.append(item.getLabel(), icon);
   } else {
    this.append(" " + item.getLabel(), icon);
   }
  }

  public void Init() {
   int count = this.size();
   for (int i = 0; i < count; i++) {
    this.delete(0);
   }
   this.appearHookList.removeAllElements();
    System.out.println("Now itemList:" + this.itemList);
  }

  public void LoadList() {
   Init();
   for (int i = 0; i < itemList.size(); i++) {
    ExpandListItem elItem = (ExpandListItem) itemList.elementAt(i);
    if (elItem.getType() == ExpandListItem.GROUP) {
     Image icon = Util.getImage(elItem.getImagePath());
    /**
     * @Debug
    */
    if (elItem.Ifselected()) {
     if (elItem.getSelectImgPath() != null) {
      icon = Util.getImage(elItem.getSelectImgPath());
     }
     System.out.println("Add Parent Node:");
     this.appendItem(elItem, icon, false);
     Vector group = (Vector) elItem.getContent();
     for (int j = 0; j < group.size(); j++) {
      ExpandListItem item = (ExpandListItem) group.elementAt(j);
      Image ic = Util.getImage(item.getImagePath());
      System.out.println("Add Sub Node:");
      this.appendItem(item, ic, true);
     }
     } else {
      System.out.println("Add Leave Node:");
      this.appendItem(elItem, icon, false);
     }
    } else if (elItem.getType() == ExpandListItem.ITEM) {
     Image icon = Util.getImage(elItem.getImagePath());
     this.appendItem(elItem, icon, false);
    }
   }
   if (this.currentSelectedIndex != -1) {
    this.setSelectedIndex(currentSelectedIndex, true);
   }
  }

  public Vector getItemList() {
   return itemList;
  }

  public void setItemList(Vector itemList) {
   this.itemList = itemList;
  }

  public void commandAction(Command arg0, Displayable arg1) {
   if (arg0 == List.SELECT_COMMAND) {
    /**
     * Set Current List Selected status
    */
    this.currentSelectedIndex = this.getSelectedIndex();
    System.out.println(this.appearHookList);

    this.currentSelectedObject = (ExpandListItem) this.appearHookList.elementAt(currentSelectedIndex);

    int indexInItemList = this.itemList.indexOf(this.appearHookList.elementAt(this.getSelectedIndex()));
    System.out.println(" Selected: " + currentSelectedIndex + " " + this.currentSelectedObject + " indexInItemList:" + indexInItemList);
    /**
    *
    */
    if (this.currentSelectedObject.getType() == ExpandListItem.GROUP) {
     if (this.currentSelectedObject.Ifselected() == false) {// Previous
      // item
      // status
      // is
      // contractive,need
      // to be
      // expanded.
      System.out.println(this.currentSelectedObject.Ifselected());
      this.itemList.removeElementAt(indexInItemList);
      this.currentSelectedObject.setIfselected(true);
      this.itemList.insertElementAt(currentSelectedObject,
      indexInItemList);
     } else {
      this.itemList.removeElementAt(indexInItemList);
      this.currentSelectedObject.setIfselected(false);
      this.itemList.insertElementAt(currentSelectedObject,
      indexInItemList);
     }
     this.Init();
     this.LoadList();
    } else {
     if (this.currentSelectedObject.getSelectImgPath() != null) {
      if (this.currentSelectedObject.Ifselected() == false) {
       Image icon = Util.getImage(this.currentSelectedObject.getSelectImgPath());
       System.out.println(this.currentSelectedObject.Ifselected());
       this.itemList.removeElementAt(indexInItemList);
       this.currentSelectedObject.setIfselected(true);
       this.itemList.insertElementAt(currentSelectedObject,indexInItemList);
       this.delete(this.currentSelectedIndex);
       this.insert(this.currentSelectedIndex,
       this.currentSelectedObject.getLabel(), icon);
      } else {
       Image icon = Util.getImage(this.currentSelectedObject.getImagePath());
       this.itemList.removeElementAt(indexInItemList);
       this.currentSelectedObject.setIfselected(false);
       this.itemList.insertElementAt(currentSelectedObject,indexInItemList);
       this.delete(this.currentSelectedIndex);
       this.insert(this.currentSelectedIndex,
       this.currentSelectedObject.getLabel(), icon);
      }
      this.setSelectedIndex(this.currentSelectedIndex,true);
     }
    }
   }
  }
}
  附测试代码

import java.util.Vector;

import javax.microedition.lcdui.Choice;
import javax.microedition.lcdui.Display;
import javax.microedition.midlet.MIDlet;
import javax.microedition.midlet.MIDletStateChangeException;

import com.skystudio.Canvas.ListCanvas;
import com.skystudio.ExpandList.ExpandList;
import com.skystudio.ExpandList.ExpandListItem;

public class Main extends MIDlet {
  Display d=null;
  protected void startApp() throws MIDletStateChangeException {
   d=Display.getDisplay(this);
   ListTest();
  }
  private void TestUI(){
   ListCanvas l=new ListCanvas();
   d.setCurrent(l);
  }
  private void ListTest(){
   Vector v1=new Vector();
   for(int i=0;i<10;i++){
    v1.addElement(new ExpandListItem("土匪"+Integer.toString(i),"/img/default.png","/img/Group-open.png","土匪"+Integer.toString(i),ExpandListItem.ITEM,false));
   }
   String v2="警察";
   Vector v3=new Vector();
   for(int i=0;i<10;i++){
    v3.addElement(new ExpandListItem("警察"+Integer.toString(i),"/img/default.png","/img/Group-open.png","警察"+Integer.toString(i),ExpandListItem.ITEM,false));
   }
   Vector v=new Vector();
   v.addElement(new ExpandListItem(v1,"/img/Group-close.png","/img/Group-open.png","土匪帮",ExpandListItem.GROUP,false));
   v.addElement(new ExpandListItem(v3,"/img/Group-close.png","/img/Group-open.png","警察局",ExpandListItem.GROUP,false));
   v.addElement(new ExpandListItem(v2,"/img/default.png","/img/Group-open.png","法官",ExpandListItem.ITEM,false));
   d.setCurrent(new ExpandList("花名册",Choice.IMPLICIT,v));
  }

  protected void pauseApp() {
   // TODO Auto-generated method stub
  }

  protected void destroyApp(boolean arg0) throws MIDletStateChangeException {
   // TODO Auto-generated method stub
  }
}