JavaMe连载(6)-自适应滚动显示 (一)

【问题描述】

我们常看到一些滚动显示的实例，比如UC浏览器中，显示网页的内容。当内容比较多时，采用滚动分页显示是合理的。在Canvas中绘图中，多余的内容被截断了。如何实现滚动分页显示呢？

【原理】

JavaMe中有一个坐标变换的功能。当触发相应的按键事件时，我们就让其显示相应的页，并且使滚动条滚动到相应的位置。

【代码清单】

ShowHelp.java

[html] package com.token.view;

import javax.microedition.lcdui.Font;
import javax.microedition.lcdui.Graphics;
import javax.microedition.lcdui.game.GameCanvas;

import com.token.util.StringDealMethod;
import com.token.util.UIController;
import com.token.view.components.*;

public class ShowHelp extends GameCanvas
{
private UIController controller;
private Graphics graphics;
private Font ft;
private int width;
private int height;

private Menu menu;
private Head head;
private BackGroud backGroud;

private int page = 0;
private int currentPageIndex = 0;
private int bodyHeight;
private int dir = 0;

public ShowHelp(UIController control)
{
super(false);
this.controller=control;
setFullScreenMode(true);

width = getWidth();
height = getHeight();

menu = new Menu(this);
head = new Head(this);
backGroud = new BackGroud(this);
}

public void show()
{
int margin = 0;
graphics = getGraphics();

graphics.clipRect(0,0, width, height);
backGroud.drawBackGroud(this, graphics);
head.drawHead(this, graphics, "帮助");
menu.drawMenu(this, graphics, "","返回");
//flushGraphics();

ft = Font.getFont(Font.FACE_PROPORTIONAL,Font.STYLE_BOLD,Font.SIZE_MEDIUM);

String info = "1 滚动分页显示；\n"
+"2 滚动分页显示；\n"
+"3 滚动分页显示；\n"
+"4 滚动分页显示；\n"
+"5 滚动分页显示；\n"
+"6 滚动分页显示；\n"
+"7 滚动分页显示；\n"
+"8 滚动分页显示；\n"
+"9 滚动分页显示；\n"
+"10 滚动分页显示；\n"
+"11 滚动分页显示；\n"
+"12 滚动分页显示；\n"
+"13 滚动分页显示；\n"
+"14 滚动分页显示；\n"
+"15 滚动分页显示；\n"
+"16 滚动分页显示；\n"
+"17 滚动分页显示；\n"
+"18 滚动分页显示；\n"
+"19 滚动分页显示；\n"
+"20 滚动分页显示；\n"
+"21 滚动分页显示；\n"
+"22 滚动分页显示；\n"
+"23 滚动分页显示；\n"
+"24 滚动分页显示；\n"
+"25 滚动分页显示；\n"
+"26 滚动分页显示；\n"
+"27 滚动分页显示；\n"
+"28 滚动分页显示；\n"
+"29 滚动分页显示；\n"
+"30 滚动分页显示；\n"
+"31 滚动分页显示；\n"
+"32 滚动分页显示；\n"
+"33 滚动分页显示；\n"
+"34 滚动分页显示；\n";

String info_wrap1[] = StringDealMethod.format(info, width-15, ft);

page = info_wrap1.length*ft.getHeight()/(height-head.menuHeight-menu.menuHeight-2*margin)+1;
bodyHeight = ((int) (height-head.menuHeight-menu.menuHeight)/ft.getHeight())*ft.getHeight();
margin = (height-head.menuHeight-menu.menuHeight-bodyHeight)/2;

graphics.setFont(ft);
graphics.setColor(Color.text);
graphics.clipRect(0, head.menuHeight+margin, width, bodyHeight);