Verwenden Sie eine ActionScript-ähnliche Syntax, um HTML5 zu schreiben – den letzten Artikel

1. Was ist die LegendForHtml5Programming1.0-Bibliothek?
Es handelt sich um eine Javascript-Bibliothek, die für die Entwicklung von HTML5 verwendet wird und nicht als Engine bezeichnet werden kann Es besteht die Hoffnung, dass es in Zukunft als Open-Source-Engine für HTML5 verwendet werden kann, um Dienste für HTML5-Entwickler bereitzustellen.


Der Erstellungsprozess der LegendForHtml5Programming1.0-Bibliothek
Bitte beachten Sie die folgenden neun Artikel. Es wird einige Abweichungen zwischen dem endgültigen Code und dem Erstellungsprozess geben.
Verwenden Sie eine ActionScript-ähnliche Syntax, um eine Reihe von HTML5-Artikeln zu schreiben
Der erste Artikel zeigt ein Bild an
http://blog.csdn.net/lufy_legend/article/details/6753032
Der zweite Artikel: Verwenden Sie Sprite, um Animationen zu realisieren
http://blog.csdn.net/lufy_legend/article/details/6753032
Der dritte Artikel, Mausereignisse und Spielcharakterbewegungen
http://blog.csdn .net/lufy_legend/article/details/6760812
Der vierte Artikel, Vererbung und einfaches Rollenspiel
http://blog.csdn.net/lufy_legend/article/details/6770713
Der fünfte Artikel, Grafikzeichnung
http://blog.csdn.net/lufy_legend/article/details/6777784
Artikel 6, TextFeld und Eingabefeld
http://blog.csdn.net/lufy_legend/article/details/ 6782218
Der siebte Artikel, benutzerdefinierte Schaltfläche
http://blog.csdn.net/lufy_legend/article/details/6798187
Der achte Artikel, Bildverarbeitung + Partikeleffekt
http:// Blog. csdn.net/lufy_legend/article/details/6798192
Artikel 9, imitiert URLLoader zum Lesen von Dateien
http://blog.csdn.net/lufy_legend/article/details/6824136


3. Beispiele für die Verwendung der LegendForHtml5Programming1.0-Bibliothek
Die folgenden einfachen Spiele dienen nur zum Testen und werden in Zukunft als Referenz entwickelt.
1, Tetris
http://fsanguo.comoj.com/html5/jstoas10/index.html
2, Lotterie-Minispiel
http://fsanguo.comoj.com/html5/ lottery_html5 /index.html
Ich persönlich finde, dass diese Bibliothek sehr praktisch ist, insbesondere das obige Tetris. Ich habe den vorherigen AS-Code direkt kopiert und die Syntax leicht geändert, und sie kann direkt ausgeführt werden Quellcode des Spiels, Sie können ihn selbst lesen, indem Sie mit der rechten Maustaste klicken, daher werde ich nicht mehr sagen


Vier Syntaxbeispiele der LegendForHtml5Programming1.0-Bibliothek
Vor der Verwendung Bedarf Führen Sie die Datei legend.js der LegendForHtml5Programming1.0-Bibliothek in HTML ein, konfigurieren Sie dann den Speicherort Ihrer Bibliothek in legend.js


1 und zeigen Sie das Bild an

var loader;    
function main(){    
    loader = new LLoader();    
    loader.addEventListener(LEvent.COMPLETE,loadBitmapdata);    
    loader.load("10594855.png","bitmapData");    
}    
function loadBitmapdata(event){    
    var bitmapdata = new LBitmapData(loader.content);    
    var bitmap = new LBitmap(bitmapdata);    
    addChild(bitmap);    
}    
//图片的缩放  
bitmapdata = new LBitmapData(imglist["chara"]);  
showImg2 = new LBitmap(bitmapdata);  
showImg2.scaleX = 0.2;  
showImg2.scaleY = 0.2;  
//图片的透明度  
bitmapdata = new LBitmapData(imglist["chara"]);  
showImg3 = new LBitmap(bitmapdata);  
showImg3.alpha = 0.2;  
//图片的旋转  
bitmapdata = new LBitmapData(imglist["chara"]);  
showImg4 = new LBitmap(bitmapdata);  
showImg4.rotate = 50;

var backLayer = new LSprite();    
addChild(backLayer);   
//在sprite上加child  
backLayer.addChild(mapimg);

//frame事件  
//backLayer.addEventListener(LEvent.ENTER_FRAME, onframe)    
//鼠标事件  
//backLayer.addEventListener(LMouseEvent.MOUSE_DOWN, onframe)

Wenn Sie für iPhone, iPad oder entwickeln Android, dann konvertiert die Bibliothek MOUSE_DOWN, MOUSE_UP, MOUSE_MOVE automatisch in TOUCH_START, TOUCH_END, TOUCH_MOVE. Es ist nicht erforderlich, selbst Touch-Ereignisse hinzuzufügen
4, erben
und rufen Sie base(this,LSprite,[] auf Konstruktor); Die Methode kann Vererbung realisieren
Die drei Parameter sind selbst, die zu vererbende übergeordnete Klasse, die Parameter des übergeordneten Klassenkonstruktors
5, Grafikzeichnung

backLayer = new LSprite();    
addChild(backLayer);    
//画一圆    
backLayer.graphics.drawRect(1,"black",[20, 20, 150, 20],true,"#cccccc");    
//画一个矩形    
backLayer.graphics.drawArc(2,"black",[100, 100, 50, 0,2*Math.PI,false],true,"#FF0000");    
//画一条线    
backLayer.graphics.drawLine(2,"#FF0000",[200, 20, 100, 50]);

//文字显示    
var txt = new LTextField();    
txt.x = 100;    
txt.text = "TextField 测试";    
addChild(txt);    
//输入框    
var txt1 = new LTextField();    
txt1.x = 100;    
txt1.y = 50;    
txt1.setType(LTextFieldType.INPUT);    
addChild(txt1);

function gameInit(event){    
    backLayer = new LSprite();    
    addChild(backLayer);    
        
    btn01 = new LButton(new LBitmap(new LBitmapData(imglist["replay_button_up"])),new LBitmap(new LBitmapData(imglist["replay_button_over"])));    
    btn01.x = 76;    
    btn01.y = 50;    
    backLayer.addChild(btn01);    
        
    btn02 = new LButton(new LBitmap(new LBitmapData(imglist["quit_button_up"])),new LBitmap(new LBitmapData(imglist["quit_button_over"])));    
    btn02.x = 76;    
    btn02.y = 100;    
    backLayer.addChild(btn02);    
        
    btn01.addEventListener(LMouseEvent.MOUSE_DOWN, onmousedown01);    
    btn02.addEventListener(LMouseEvent.MOUSE_DOWN, onmousedown02);    
}    
function onmousedown01(event){    
    alert("btn01 on click");    
}    
function onmousedown02(event){    
    alert("btn02 on click");