Canvas制作RPG手机版游戏(一):

       最近想写一个简单的手机RPG游戏,现在的RPG制作工具多为PC版,但Web版RPG制作太少了。网上的Scratch制作虽然简单好用,但却用的是flash,对手机来说是很不良好的。

        打算写一个Canvas的RPG游戏,HTML5游戏对手机游戏制作好处不多说。

 

       首先,创建一个Canvas。

       标签meta,这个对手机开发来说是需要的。




   
	
	YHH Game
	


	
	
	
	

 

然后,设置这个canvas

var main_canvas = document.getElementById("gameCanvas");
var main_context = main_canvas.getContext("2d");

var width = screen.width*0.92; //最大屏宽度
var height = screen.height*0.8; //最大屏高度
main_canvas.width = width;
main_canvas.height = height;

 使用RequestAnimationFrame,这个是重点,按当前显示屏刷新次数运到,一般的电脑屏是60Hz,就是每秒刷新60次,大概16.6m运行一次。

比起setTimeout和setInterval,RequestAnimationFrame不需要设置时间间隔,与显示器刷新相同,运行更加流畅。

//main
var w = window;
requestAnimationFrame = w.requestAnimationFrame || w.webkitRequestAnimationFrame || w.msRequestAnimationFrame || w.mozRequestAnimationFrame;
var now = Date.now();
var then = Date.now();
var main = function () {
	now = Date.now();
	var delta = now - then; //时间间隔
	then = now; 
	
    //写运行内容
	
	requestAnimationFrame(main);
};



main();

 

你可能感兴趣的:(Canvas)