效果如下圖，如果其上下左右有空白處的話，可以實現交換，最后可以排列成有序的12345678
實現代碼如下：
包含兩個as文件：
第一個是構造小方塊數字的as文件：RectShape.as
package {
import flash.display.Sprite;
import flash.text.TextFormat;
import flash.text.TextField;
import flash.text.TextFieldAutoSize;
public class RectShape extends Sprite {
private var xzuobiao:uint;
private var yzuobiao:uint;
public function RectShape(num:uint) {
init(num);
}
private function init(num:uint) {
this.graphics.beginFill(0x00ff00);
this.graphics.lineStyle(1);//設置線條粗細
this.graphics.drawRect(0,0,40,40);
this.graphics.endFill();
//設置數字
var txt_format:TextFormat=new TextFormat();
txt_format.size=30;
var txt_num:TextField=new TextField();
txt_num.selectable=false;//設置文本字段不可選
txt_num.text=""+num;
txt_num.width=40;
txt_num.height=40;
txt_num.x=0;
txt_num.y=0;
txt_num.setTextFormat(txt_format);
txt_num.autoSize=TextFieldAutoSize.CENTER;
this.addChild(txt_num);
}
//對屬性設置get set方法
public function get X():uint {
return xzuobiao;
}
public function set X(xzuo:uint):void {
this.xzuobiao=xzuo;
}
public function get Y():uint {
return yzuobiao;
}
public function set Y(yzuo:uint):void {
this.yzuobiao=yzuo;
}
}
}
第二個是入口as：Main.as
package{
import flash.display.Sprite;
import flash.events.MouseEvent;
public class Main extends Sprite{
private var indexShape:Array=new Array(1,2,3,4,5,6,7,8);//表示需要顯示的八個方塊的文本
private var jilu:Array=[[1,1,1],[1,1,1],[1,1,1]];//默認值為1，記錄該位置是否放了小方塊，沒有放方塊時其值為1，放了方塊后改為0
private var pielie:Array=[[0,0],[40,0],[80,0],[0,40],[40,40],[80,40],[0,80],[40,80],[80,80]];//定義小方塊排列的xy坐標
public function Main(){
init();
}
private function init():void{
var kuang:Sprite=new Sprite();
kuang.graphics.lineStyle(3,0xff00ff);
kuang.graphics.drawRect(0,0,120,120);
kuang.graphics.endFill();
kuang.x=215;
kuang.y=140;
addChild(kuang);
//隨機的填充數字1-8
for(var i:uint=1;i<=8;i++){
var index:uint=Math.floor(Math.random()*indexShape.length);
var num:uint=indexShape[index];
indexShape.splice(index,1);//在數組中移除該數字
var shape:RectShape=new RectShape(num);//生成小方塊
shape.mouseChildren=false;//解決方塊被TextField文本框覆蓋的問題
//隨機生成一個位置來存放小方塊
var position:uint=Math.floor(Math.random()*pielie.length);
var positionValue:Array=pielie[position];
pielie.splice(position,1);//刪除記錄的該位置
shape.x=positionValue[0];
shape.y=positionValue[1];
shape.X=positionValue[0]/40;
shape.Y=positionValue[1]/40;
//修改記錄的位置的值改為0
jilu[positionValue[0]/40][positionValue[1]/40]=0;
kuang.addChild(shape);
//添加鼠標點擊事件
shape.addEventListener(MouseEvent.CLICK,moveNum);
}
}
private function moveNum(evt:MouseEvent):void{
var left:int=evt.target.X-1;
var right:int=evt.target.X+1;
var top:int=evt.target.Y+1;
var bottom:int=evt.target.Y-1;
//處理向左移動
if(left!=-1&&jilu[left][evt.target.Y]==1){
//trace("come left");
jilu[evt.target.X][evt.target.Y]=1;
jilu[left][evt.target.Y]=0;
evt.target.X=left;
evt.target.x-=40;//向左移動40
}else if(right!=3&&jilu[right][evt.target.Y]==1){
//trace("come right");
jilu[evt.target.X][evt.target.Y]=1;
jilu[right][evt.target.Y]=0;//修改記錄
evt.target.X=right;
evt.target.x+=40;//向右移動40
}else if(top!=-1&&jilu[evt.target.X][top]==1){
jilu[evt.target.X][evt.target.Y]=1;
jilu[evt.target.X][top]=0;//修改記錄
evt.target.Y=top;
evt.target.y+=40;//向上移動40
}else if(bottom!=3 &&jilu[evt.target.X][bottom]==1){
jilu[evt.target.X][evt.target.Y]=1;
jilu[evt.target.X][bottom]=0;//修改記錄
evt.target.Y=bottom;
evt.target.y-=40;//向上移動40
}
}
}
}
