canvas图像Word文档下载推荐.docx
《canvas图像Word文档下载推荐.docx》由会员分享，可在线阅读，更多相关《canvas图像Word文档下载推荐.docx（10页珍藏版）》请在冰豆网上搜索。
publicvoiddestroyApp（booleanunconditional）{}
classcanvasTranslateextendsCanvas
intgameaction=0;
intx;
inty;
booleanview;
ImagepictureImage;
publiccanvasTranslate（）
try{
pictureImage=Image.createImage（"
/picture.png"
）;
}catch（Exceptionex）{}
publicvoidkeyPressed（intkeyCode）
gameaction=getGameAction（keyCode）;
switch（gameaction）
caseUP:
view=false;
repaint（）;
break;
caseDOWN:
view=true;
//设置X,Y轴位移量
x=50;
y=60;
publicvoidpaint（Graphicsg）
{
g.setColor（0xFFFFFF）;
g.fillRect（0,0,getWidth（）,getHeight（））;
g.setColor（0）;
if（view）
//设置变换原点坐标，位移至（x,y）
g.translate（x,y）;
//取得X轴位移量
g.drawString（"
X轴位移"
+String.valueOf（g.getTranslateX（））,-10,-40,
Graphics.LEFT|Graphics.TOP）;
//取得Y轴位移量
Y轴位移"
+String.valueOf（g.getTranslateY（））,-10,-20,
//保持图片都在原始点（0,0）显示
g.drawImage（pictureImage,0,0,Graphics.LEFT|Graphics.TOP）;
}
运行结果如图6-18所示。
图6-18
6.5.2图片切割法
第二个应用是Graphics类对图片处理的另一种方法，就是指定图片显示区域的位置，就像是图片被切割一样。
如示例6-9中根据设计者需求进行图片画面设置，可以调用方法：
lpublicvoidsetClip（intx,
inty,
intwidth,
intheight）
设置图片的切割范围，范围定义坐标为（x,y）、宽度width、高度height。
lpublicintgetClipX（）
取得切割图片的X坐标值。
lpublicintgetClipY（）
取得切割图片的Y坐标值。
lpublicintgetClipWidth（）
取得切割图片的宽度值。
lublicintgetClipHeight（）
取得切割图片的高度值。
lpublicvoidclipRect（intx,
指定矩形区域与图片重叠处才显示，定义坐标为（x,y），指定矩形的宽度width、高度height。
示例6-9
图片切割状态显示
importjava.util.Random;
publicclasscanvasDemo6extendsMIDlet
canvasClipcanvasclip;
publiccanvasDemo6（）
canvasclip=newcanvasClip（）;
display.setCurrent（canvasclip）;
classcanvasClipextendsCanvas
intx=0;
inty=0;
intwidth;
intheight;
RandomviewRand;
publiccanvasClip（）
viewRand=newRandom（）;
x=（int）Math.abs（viewRand.nextInt（）%60）;
y=（int）Math.abs（viewRand.nextInt（）%60）;
caseFIRE:
//设置切割区域
g.setClip（30,60,x,y）;
//取得切割画面的宽度
width=g.getClipWidth（）;
//取得切割画面的高度
height=g.getClipHeight（）;
g.drawImage（pictureImage,30,60,Graphics.LEFT|Graphics.TOP）;
//将切割后的动作应用到全屏幕画面
g.setClip（0,0,getWidth（）,getHeight（））;
宽度:
"
+width,50,10,Graphics.HCENTER|Graphics.TOP）;
高度:
+height,50,30,Graphics.HCENTER|Graphics.TOP）;
//进行矩形切割
g.clipRect（100,60,x,y）;
//取得切割画面的矩形宽度
g.drawImage（pictureImage,100,60,Graphics.LEFT|Graphics.TOP）;
矩形宽度:
+width,120,10,Graphics.HCENTER|Graphics.TOP）;
矩形高度:
+height,120,30,Graphics.HCENTER|Graphics.TOP）;
g.drawRect（100,60,x,y）;
运行结果如图6-19所示。
图6-19
【说明】
运行切割画面后，请注意一定要将画面恢复原状。
也就是不管切割画面大小如何，最后一定要设g.setClip（0,0,getWidth（）,getHeight（）），除非设计游戏时有其他显示考虑。
6.5.3合成图片动画制作
第5章介绍过如何制作动画效果，当图片是为了缩小文件大小而合成整张时，程序编写也就会有所不同。
主要是将转换坐标方法与切割图片方法混合使用，达到显示动态图片的目的。
将第5章合成一整张图片的方法进行修改，如图6-20所示。
具体程序见示例6-10。
图6-20将图片组合成一张示意图
示例6-10
整张图片制作成动画的应用
importjavax.microedition.io.×
publicclasscanvasDemo7extendsMIDlet
canvasCARcanvascar;
publiccanvasDemo7（）
canvascar=newcanvasCAR（）;
display.setCurrent（canvascar）;
classcanvasCARextendsCanvas
intgameaction,running;
ImagecarImage;
goCargocar;
int[][]gorun={
{14,123},{14,113},{14,103},{14,93},{14,83},{14,73},
{14,63},{14,53},{14,43},{14,33},{14,23},{14,13},
{24,13},{34,13},{44,13},{54,13},{64,13},{74,13},
{84,13},{94,13},{104,13},{114,13},{124,13},{134,13},
{134,23},{134,33},{134,43},{134,53},{134,63},{134,73},
{134,83},{134,93},{134,103},{134,113},{134,123},{134,133},
{124,133},{114,133},{104,133},{94,133},{84,133},{74,133},
{64,133},{54,133},{44,133},{34,133},{24,133},{14,133}
};
int[]imagetype={
0,0,0,0,0,0,
0,0,0,0,0,1,
2,2,2,2,2,2,
2,2,2,2,2,3,
4,4,4,4,4,4,
4,4,4,4,4,5,
6,6,6,6,6,6,
6,6,6,6,6,7,
publiccanvasCAR（）
running=0;
carImage=Image.createImage（"
/car.png"
publicvoidkeyPressed（intkeyCode）
caseLEFT:
caseRIGHT:
gocar=newgoCar（）;
gocar.start（）;
gocar=null;
}
g.setColor（0x90EE90）;
g.fillRect（0,0,getWidth（）,getHeight（））;
//转换坐标系
g.translate（gorun[running][0]-imagetype[running]×
32,gorun[running][1]）;
//切割显示图片
g.setClip（imagetype[running]×
32,0,32,32）;
//图片显示在屏幕上
g.drawImage（carImage,0,0,Graphics.LEFT|Graphics.TOP）;
//恢复图片的原点坐标系
g.translate（-gorun[running][0]+imagetype[running]×
//线程运行图片显示
classgoCarextendsThread
publicvoidrun（）
while（true）
running++;
if（running>
47）running=0;
Thread.sleep（200）;
升级会员 