路是爬出來(lái)的

導(dǎo)航

<

2025年7月

>

日

一

二

三

四

五

六

29

30

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

1

2

3

4

5

6

7

8

9

統(tǒng)計(jì)

隨筆 - 50
文章 - 50
評(píng)論 - 2
引用 - 0

常用鏈接

留言簿(1)

隨筆檔案

2006年12月 (50)

文章檔案

2006年12月 (50)

搜索

閱讀排行榜

評(píng)論排行榜

[導(dǎo)入]設(shè)計(jì)可組裝的j2me UI(一) 核心部件

最近發(fā)現(xiàn)很多朋友在設(shè)計(jì)j2me程序的時(shí)候，在有些關(guān)鍵的UI設(shè)計(jì)都放棄j2me提供的高級(jí)UI。而自己通過(guò)繼承Canvas，而實(shí)現(xiàn)自己想要的效果。游戲的菜單設(shè)計(jì)一般都是這樣。設(shè)計(jì)自己的UI是比較困難的，因?yàn)樽约阂刂破聊坏母鱾€(gè)元素跟各個(gè)元素的低級(jí)事件。我想這些不是問(wèn)題。主要還是很少有教程手把手的教你。小第我經(jīng)過(guò)一個(gè)項(xiàng)目，而起這個(gè)項(xiàng)目的UI全部是自己實(shí)現(xiàn)。所以在這方面算是有點(diǎn)點(diǎn)經(jīng)驗(yàn)。所以拿出來(lái)給大家分享下。
我的設(shè)計(jì)思想是這樣的。
1。手機(jī)CPU，內(nèi)存等資源都有限。手機(jī)屏幕各個(gè)廠商各不相同。
2。手機(jī)基本不用考慮，窗口移動(dòng)，拖動(dòng)，縮放，重疊，窗口至頂?shù)葐?wèn)題。
3。手機(jī)窗口事件不用考慮，拖動(dòng)，移動(dòng)，縮放，鼠標(biāo)等時(shí)間。因此問(wèn)題就相對(duì)簡(jiǎn)單了。
4：我們只需要實(shí)現(xiàn)，UI的顯示跟文字，圖片的排版顯示，已經(jīng)文字的滾動(dòng)顯示等。

下面將是一些片段代碼，希望。
首先設(shè)計(jì)兩個(gè)核心的類。
1。Part －－窗口顯示部件。主要是一些可以組裝的組件例如（TextField，TextBox）等

代碼

public abstract class Part {

protected final int X = 0;

protected final int Y = 1;

protected final int WIDTH = 2;

protected final int HEIGHT = 3;

/**
	 * 位置的顯示位置（相對(duì)手機(jī)屏幕的位置）
	 */
	protected int view[] = new int[4];

/**
	 * 背景色
	 */
	protected int bgColor = 0x000000;

/**
	 * 字體顏色
	 */
	protected int fontColor = 0xFFFFFF;

protected int selectIndex;

protected Canvas container;
	
	protected String label;
	  
	/** 每個(gè)Item都有自己的焦點(diǎn) **/
	protected boolean hasFocus;

protected PartChangeListener partChangeListener;
	
	public Part(int x, int y, int widht, int height) {
		view[X] = x;
		view[Y] = y;
		view[WIDTH] = widht;
		view[HEIGHT] = height;
	}

public void setStyle(int bgColor, int fontColor) {
		this.bgColor = bgColor;
		this.fontColor = fontColor;
	}

/**
	 * 默認(rèn)字體
	 */
	protected Font font = Font.getDefaultFont();

/**
	 * 資料實(shí)現(xiàn)繪制方法
	 * 
	 * @param g
	 */
	public abstract void paint(Graphics g);

/**
	 * 事件
	 * 
	 * @param keyCode
	 */
	public abstract void onClick(int keyCode);

public int getSelectIndex() {
	 
		return selectIndex;
	}

public void setSelectIndex(int selectIndex) {
		this.selectIndex = selectIndex;
	}

/**
	 * 改變部件的位置
	 */
	public void changePosition(int x, int y, int width, int height){
		view[X] = x;
		view[Y] = y;
		view[WIDTH] = width;
		view[HEIGHT] = height;	
	}

public void setContainer(Canvas container) {
		this.container = container;
	}
	
	/**
	 * 聚焦，主要用戶當(dāng)前使用的Part。
	 * @param hasFocus
	 */
	public void setHasFocus(boolean hasFocus){
		this.hasFocus = hasFocus;
		 
	}
	
	public void setPartChangeListener(PartChangeListener partChangeListener) {
		this.partChangeListener = partChangeListener;
	}

public int[] getView() {
		return view;
	}

上面的類不足以顯示，主要是通過(guò)下面的類，通過(guò)addPart方法添加進(jìn)去。

代碼

public abstract class Panel extends Canvas {
	private static Log log = Log.getLog("Panel");

final int X = 0;

final int Y = 1;

final int WIDTH = 2;

final int HEIGHT = 3;

/** 顯示主要部分.比如菜單的Icon,List的數(shù)據(jù)的位置 */
	int[] viewContent = new int[4];

Image icon;
	Part part;
	
	SoftButton softButton;
	
	Part timer;
	
	public Panel(){
		init();
	}
	public Panel(Image icon) {
		init();
		this.icon = icon;
		
		 
		//此方法是讓所以的Panel都添加一個(gè)TimerPart
		//以后重構(gòu)的時(shí)候應(yīng)該???慮要不要這么做
		//this.setTimer(null);
	}
	private void init() {
		setFullScreenMode(true);
	 
		initViewContent();
		this.softButton = new SoftButton();
	}

public void addCommand(Command cmd) {
		if (cmd == null)
			return;
		softButton.addCommand(cmd);
	}

public Part getPart() {
		return part;
	}

public void append(Part part){
		this.part = part;
	}
	public void setPartChangeListener(PartChangeListener partChangeListener) {
		this.part.setPartChangeListener(partChangeListener);
	}

public void removeCommand(int type) {

softButton.removeCommand(type);
	}

public void setSoftButtonListener(CommandListener cmdListener) {
		if (softButton != null)
			softButton.setCommandListener(cmdListener);
	}

public void setSoftButtonStyle(int bgColor, int fontColor){
		this.softButton.setStyle(bgColor, fontColor);
	}

public abstract void paint(Graphics g);

protected abstract void keyPressed(int keyCode);

/**
	 * 長(zhǎng)按事件
	 */
	protected void keyRepeated(int keyCode) {
		keyPressed(keyCode);
	}

private void initViewContent() {
		viewContent[X] = 0;
		viewContent[Y] = 45;
		viewContent[WIDTH] = Platform.WIDTH;
		viewContent[HEIGHT] = Platform.HEIGHT;
	}

public SoftButton getSoftButton() {
		return softButton;
	}

public void setSoftButton(SoftButton softButton) {
		this.softButton = softButton;
	}
	
    /**
     * 增加時(shí)間顯示
     */
	public void setTimer(Part timer){
		this.timer = timer;
	}
	
	void paintTimerImpl(Graphics g){
		if(timer != null)
			timer.paint(g);
	}
	
	public void repaintTimer(){
		if(timer != null){
			int [] view = timer.getView();
			repaint(view[X],view[Y],view[WIDTH], view[HEIGHT] );
		}
			
	}

}

以上就是UI的核心，以后我將會(huì)逐漸介紹其他的組件跟相關(guān)的事件接口。讀者也可以自己實(shí)現(xiàn)一些有意思的界面然后測(cè)試下，我相信效果會(huì)更好

文章來(lái)源: http://wuhua.javaeye.com/blog/34288

posted on 2006-12-30 08:44 路是爬出來(lái)的閱讀(115) 評(píng)論(0) 編輯收藏

新用戶注冊(cè) 刷新評(píng)論列表


只有注冊(cè)用戶登錄后才能發(fā)表評(píng)論。




網(wǎng)站導(dǎo)航: 博客園 IT新聞 Chat2DB C++博客博問(wèn) 管理