拼圖小游戲

icon：

選擇界面：

兩個難度界面：

成功界面：

然后 這個是跟著視頻教程寫的 也是第一次寫關于圖片分割和動畫的這些
大概步驟是：

1.初始化游戲主界面和方塊
2.設置某個方塊為缺口方塊這樣
3.判斷點擊的方塊與空方塊的關系 是否是相鄰的 點擊方塊周邊是
否存在缺塊方塊
5.缺塊方塊與點擊方塊的數據交換
6.獲取手勢的方向
7.根據手勢執行交換動作
8.隨機打亂順序
9.判斷游戲結束

1.初始化游戲主界面和方塊
初始化包括初始化游戲的主界面 小方格 每個小方格的數據
獲取一張大圖 通過雙重循環將大圖切為若干個小方格 并且為每一個小方格綁定數據
所以提前封裝了這樣一個類GameDate

/* 每個游戲小方塊的數據實際位置x實際位置y每個方塊的圖片bm每個小方塊圖片的位置p_x每個小方塊圖片的位置 p_y*/class GameDate{public int x = 0;public int y = 0;public Bitmap bm;public int p_x=0;public int p_y=0;public GameDate(int x,int y,Bitmap bm){this.bm = bm;this.x=x;this.y = y;this.p_x = x;this.p_y = y;}//判斷每個小方塊的位置是否正確public Boolean isTrue(){if (x==p_x&&y==p_y){return true;}return false;}}

2.設置某個方塊為缺口方塊這樣
因為要交換所以肯定要有一個是空白的格子才可以進行交換啊
所以我們在初始化的時候就選擇一個合適的位置初始化為空格方塊
定義全局變量private ImageView main_nullImage;
初始化它

/*設置某個方塊為缺口方塊*/public void setNullImageView(ImageView nullImageView){nullImageView.setImageBitmap(null);main_nullImage=nullImageView;}

3.判斷點擊的方塊與空方塊的關系 是否是相鄰的 點擊方塊周邊是
否存在缺塊方塊
點擊的方塊相鄰必須有空白方塊才可以交換 所以必須要判斷當前點擊的方塊是否相鄰空白方塊
是根據當前點擊的方塊實例中的坐標關系和空白方塊的坐標關系 分別判斷上下左右是否相差為1來判斷是否相鄰 返回值為boolean 類型

/* 判斷點擊的方塊與空方塊的關系 是否是相鄰的*/public boolean ifHasNullImageView(ImageView clickImageView){//分別獲取當前空方塊的位置和點擊方塊的位置的實例GameDate nullImage = (GameDate) main_nullImage.getTag();GameDate gameDate = (GameDate)clickImageView.getTag();if (nullImage.y==gameDate.y&&nullImage.x==gameDate.x+1){//上面return true;}else if (nullImage.y==gameDate.y&&nullImage.x==gameDate.x-1){//下面return true;}else if (nullImage.y==gameDate.y+1&&nullImage.x==gameDate.x){//左邊return true;}else if (nullImage.y==gameDate.y-1&&nullImage.x==gameDate.x){//右邊return true;}return false;}

5.缺塊方塊與點擊方塊的數據交換
當返回值為true時證明相鄰于空白方塊
所以要進行數據交換和圖像交換 這里就有動畫的東西了

/*利用動畫結束后交換兩個方塊的數據*/public void changeDataByImageView( ImageView imageView){changeDataByImageView(imageView, true);}public void changeDataByImageView(final ImageView imageView,Boolean istrue){if (!istrue){GameDate gameDate = (GameDate)imageView.getTag();main_nullImage.setImageBitmap(gameDate.bm);GameDate nullgamedata = (GameDate)main_nullImage.getTag();nullgamedata.bm = gameDate.bm;nullgamedata.p_x = gameDate.p_x;nullgamedata.p_y = gameDate.p_y;setNullImageView(imageView);if (isGameStart) {isGameOver();}return;}TranslateAnimation translateAnimation=null;if (imageView.getX()>main_nullImage.getX()){//根據點擊位置和空方塊的位置來設置動畫translateAnimation = new TranslateAnimation(0.1f,-imageView.getHeight(),0.1f,0.1f);}else if(imageView.getX()<main_nullImage.getX()){translateAnimation = new TranslateAnimation(0.1f,imageView.getHeight(),0.1f,0.1f);}else if(imageView.getY()>main_nullImage.getY()){translateAnimation = new TranslateAnimation(0.1f,0.1f,0.1f,-imageView.getHeight());}else if(imageView.getY()<main_nullImage.getY()){translateAnimation = new TranslateAnimation(0.1f,0.1f,0.1f,imageView.getHeight());}translateAnimation.setDuration(70);//設置時長translateAnimation.setFillAfter(true);//設置是否停留/*設置動畫監聽*/translateAnimation.setAnimationListener(new Animation.AnimationListener() {@Overridepublic void onAnimationStart(Animation animation) {}@Overridepublic void onAnimationEnd(Animation animation) {//動畫結束之后開始真正交換數據imageView.clearAnimation();GameDate gameDate = (GameDate)imageView.getTag();main_nullImage.setImageBitmap(gameDate.bm);GameDate nullgamedata = (GameDate)main_nullImage.getTag();nullgamedata.bm = gameDate.bm;nullgamedata.p_x = gameDate.p_x;nullgamedata.p_y = gameDate.p_y;setNullImageView(imageView);if (isGameStart) {isGameOver();}}@Overridepublic void onAnimationRepeat(Animation animation) {}});imageView.startAnimation(translateAnimation);}

6.獲取手勢的方向
實現不僅點擊可以交換在屏幕通過手勢控制也可以進行游戲 所以需要獲取手勢的方向 獲取手勢方向主要是要傳入四個參數 分別是滑動前和滑動后的兩組數據 來判斷滑動的方向 創建一個GestureDetector實例 重寫里面的onFling方法 在這個里面調用

/*手勢判斷 是向哪個方向滑動根據滑動的手勢之間的坐標值來決定的 */public int getDirByGes(float start_x,float start_y,float end_x,float end_y){boolean isLeftorRight = (Math.abs(start_x-end_x)>Math.abs(start_y-end_y))?true:false;if(isLeftorRight){boolean isLeft = (start_x-end_x)>0?true:false;if(isLeft){return 3;}else{return 4;}}else{boolean isup = (start_y-end_y)>0?true:false;if(isup){return 1;}else{return 2;}}}

7.根據手勢執行交換動作
根據手勢的返回值 來判斷當前圖片的實例里面的數據是怎么改變的

public void changeByDir(int type){changeByDir(type,true);}public void changeByDir(int type,Boolean ishas){GameDate nullGameDate = (GameDate)main_nullImage.getTag();int new_x = nullGameDate.x;int new_y = nullGameDate.y;if (type==1){new_x++;}else if (type==2){new_x--;}else if (type==3){new_y++;}else if (type==4){new_y--;}//判斷這個新坐標是否存在if (new_x>=0&&new_x<game_arr.length&&new_y>=0&&new_y<game_arr[0].length){if (ishas) {changeDataByImageView(game_arr[new_x][new_y]);}else{changeDataByImageView(game_arr[new_x][new_y],false);}}}

8.隨機打亂順序
隨機打亂順序是游戲第一次進入應該是系統自動打亂
所以我們隨機產生1到4 的值來代表方向然后進行隨機打亂調用之前封裝好的交換但是應該是沒有動畫的 所以我們重載了那個

public void changeDataByImageView( ImageView imageView){changeDataByImageView(imageView, true);}public void changeDataByImageView(final ImageView imageView,Boolean istrue){}

這樣就可以看見通過傳入參數來判斷是否需要動畫來調用了；
具體代碼下面有
然后通過循環的次數來設置難度 就是系統打亂的次數；
t是打亂次數

public void randomMove(int t){for (int i = 0;i<t;i++){int type =(int)(Math.random()*4)+1;changeByDir(type,false);}}

9.判斷游戲結束
邏輯就是判斷實際位置是否與當前位置一致
一致就證明是成功啦

下面是游戲主界面的涉及的所有代碼

package com.example.katherine_qj.playgame;import android.content.Intent; import android.graphics.Bitmap; import android.graphics.drawable.BitmapDrawable; import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.util.Log; import android.view.GestureDetector; import android.view.MotionEvent; import android.view.View; import android.view.animation.Animation; import android.view.animation.TranslateAnimation; import android.widget.Button; import android.widget.GridLayout; import android.widget.ImageView; import android.widget.TextView; import android.widget.Toast;public class MainActivity extends AppCompatActivity {private Boolean isGameStart = false;/* 利用二維數組創建若干個游戲小方塊*/private ImageView[][] game_arr = new ImageView[5][3];/*游戲主界面*/private GridLayout main_game;//當前空方塊的實例private ImageView main_nullImage;private GestureDetector gestureDetector;private Button return_a;private Button tip_a;private TextView title;private int count;@Overridepublic boolean onTouchEvent(MotionEvent event) {return gestureDetector.onTouchEvent(event);}@Overridepublic boolean dispatchTouchEvent(MotionEvent ev) {gestureDetector.onTouchEvent(ev);return super.dispatchTouchEvent(ev);}@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);gestureDetector = new GestureDetector(this, new GestureDetector.OnGestureListener() {@Overridepublic boolean onDown(MotionEvent e) {return false;}@Overridepublic void onShowPress(MotionEvent e) {}@Overridepublic boolean onSingleTapUp(MotionEvent e) {return false;}@Overridepublic boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX, float distanceY) {return false;}@Overridepublic void onLongPress(MotionEvent e) {}@Overridepublic boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) {changeByDir( getDirByGes(e1.getX(), e1.getY(), e2.getX(), e2.getY()));//手勢執行一瞬間的方法操作// Toast.makeText(MainActivity.this,""+getDirByGes(e1.getX(),e1.getY(),e2.getX(),e2.getY()),Toast.LENGTH_SHORT).show();return false;}});setContentView(R.layout.activity_main);title = (TextView)findViewById(R.id.title);Intent intent = getIntent();String level = intent.getStringExtra("Level");//獲取一張大圖Bitmap big = ((BitmapDrawable)getResources().getDrawable(R.drawable.ababa)).getBitmap();int tuWandH = big.getHeight()/5;/* 初始化游戲若干個小方塊，利用雙重循環*/for (int i =0;i<game_arr.length;i++){for (int j = 0;j<game_arr[0].length;j++){Bitmap bm = Bitmap.createBitmap(big,j*tuWandH,i*tuWandH,tuWandH,tuWandH);//根據行列切成若干個小方塊game_arr[i][j] = new ImageView(this);game_arr[i][j].setImageBitmap(bm);//設置每一個小方塊的圖案game_arr[i][j].setPadding(2, 2, 2, 2);//設置方塊之間的間距game_arr[i][j].setTag(new GameDate(i, j, bm));//綁定自定義的數據game_arr[i][j].setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View v) {boolean flag = ifHasNullImageView((ImageView) v);if (flag) {//如果是真的相鄰關系就交換count++;changeDataByImageView((ImageView) v);}}});}} /* 初始化游戲主界面并添加若干個小方塊，利用雙重循環*/main_game = (GridLayout)findViewById(R.id.main_game);for (int i =0;i<game_arr.length;i++){for (int j = 0;j<game_arr[0].length;j++){main_game.addView(game_arr[i][j]);if (i==0&&j==0){setNullImageView(game_arr[0][0]);}}}if (level.equals("esay")){randomMove(20);isGameStart = true;title.setText("ESAY");}if (level.equals("best")){randomMove(100);isGameStart = true;title.setText("BEST");}return_a= (Button)findViewById(R.id.return_a);tip_a =(Button) findViewById(R.id.tip_a);return_a.setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View v) {finish();}});}/*隨機打亂順序*/public void randomMove(int t){for (int i = 0;i<t;i++){int type =(int)(Math.random()*4)+1;changeByDir(type,false);}}/*設置某個方塊為缺口方塊*/public void setNullImageView(ImageView nullImageView){nullImageView.setImageBitmap(null);main_nullImage=nullImageView;}/* 設置某個方塊為缺口方塊這樣判斷點擊的方塊與空方塊的關系 是否是相鄰的*/public boolean ifHasNullImageView(ImageView clickImageView){//分別獲取當前空方塊的位置和點擊方塊的位置的實例GameDate nullImage = (GameDate) main_nullImage.getTag();GameDate gameDate = (GameDate)clickImageView.getTag();if (nullImage.y==gameDate.y&&nullImage.x==gameDate.x+1){//上面return true;}else if (nullImage.y==gameDate.y&&nullImage.x==gameDate.x-1){//下面return true;}else if (nullImage.y==gameDate.y+1&&nullImage.x==gameDate.x){//左邊return true;}else if (nullImage.y==gameDate.y-1&&nullImage.x==gameDate.x){//右邊return true;}return false;}/*手勢判斷 是向哪個方向滑動根據滑動的手勢之間的坐標值來決定的 */public int getDirByGes(float start_x,float start_y,float end_x,float end_y){boolean isLeftorRight = (Math.abs(start_x-end_x)>Math.abs(start_y-end_y))?true:false;if(isLeftorRight){boolean isLeft = (start_x-end_x)>0?true:false;if(isLeft){return 3;}else{return 4;}}else{boolean isup = (start_y-end_y)>0?true:false;if(isup){return 1;}else{return 2;}}}//根據手勢的方向，獲取空方塊相鄰的位置是否存在方塊 進行數據交換public void changeByDir(int type){changeByDir(type,true);}public void changeByDir(int type,Boolean ishas){GameDate nullGameDate = (GameDate)main_nullImage.getTag();int new_x = nullGameDate.x;int new_y = nullGameDate.y;if (type==1){new_x++;}else if (type==2){new_x--;}else if (type==3){new_y++;}else if (type==4){new_y--;}//判斷這個新坐標是否存在if (new_x>=0&&new_x<game_arr.length&&new_y>=0&&new_y<game_arr[0].length){if (ishas) {changeDataByImageView(game_arr[new_x][new_y]);}else{changeDataByImageView(game_arr[new_x][new_y],false);}}}/*利用動畫結束后交換兩個方塊的數據*/public void changeDataByImageView( ImageView imageView){changeDataByImageView(imageView, true);}public void changeDataByImageView(final ImageView imageView,Boolean istrue){if (!istrue){GameDate gameDate = (GameDate)imageView.getTag();main_nullImage.setImageBitmap(gameDate.bm);GameDate nullgamedata = (GameDate)main_nullImage.getTag();nullgamedata.bm = gameDate.bm;nullgamedata.p_x = gameDate.p_x;nullgamedata.p_y = gameDate.p_y;setNullImageView(imageView);if (isGameStart) {isGameOver();}return;}TranslateAnimation translateAnimation=null;if (imageView.getX()>main_nullImage.getX()){//根據點擊位置和空方塊的位置來設置動畫translateAnimation = new TranslateAnimation(0.1f,-imageView.getHeight(),0.1f,0.1f);}else if(imageView.getX()<main_nullImage.getX()){translateAnimation = new TranslateAnimation(0.1f,imageView.getHeight(),0.1f,0.1f);}else if(imageView.getY()>main_nullImage.getY()){translateAnimation = new TranslateAnimation(0.1f,0.1f,0.1f,-imageView.getHeight());}else if(imageView.getY()<main_nullImage.getY()){translateAnimation = new TranslateAnimation(0.1f,0.1f,0.1f,imageView.getHeight());}translateAnimation.setDuration(70);//設置時長translateAnimation.setFillAfter(true);//設置是否停留/*設置動畫監聽*/translateAnimation.setAnimationListener(new Animation.AnimationListener() {@Overridepublic void onAnimationStart(Animation animation) {}@Overridepublic void onAnimationEnd(Animation animation) {//動畫結束之后開始真正交換數據imageView.clearAnimation();GameDate gameDate = (GameDate)imageView.getTag();main_nullImage.setImageBitmap(gameDate.bm);GameDate nullgamedata = (GameDate)main_nullImage.getTag();nullgamedata.bm = gameDate.bm;nullgamedata.p_x = gameDate.p_x;nullgamedata.p_y = gameDate.p_y;setNullImageView(imageView);if (isGameStart) {isGameOver();}}@Overridepublic void onAnimationRepeat(Animation animation) {}});imageView.startAnimation(translateAnimation);}//判斷游戲結束 在游戲開始之前是不判斷的public void isGameOver(){Boolean isGameOver = true;for (int i = 0;i<game_arr.length;i++){for (int j = 0;j<game_arr[0].length;j++){if (game_arr[i][j]==main_nullImage){continue;}GameDate gameDate = (GameDate)game_arr[i][j].getTag();if(!gameDate.isTrue()){isGameOver = false;break;}}}if (isGameOver){Toast.makeText(MainActivity.this,"成功啦",Toast.LENGTH_SHORT).show();}}/* 每個游戲小方塊的數據實際位置x實際位置y每個方塊的圖片bm每個小方塊圖片的位置p_x每個小方塊圖片的位置 p_y*/class GameDate{public int x = 0;public int y = 0;public Bitmap bm;public int p_x=0;public int p_y=0;public GameDate(int x,int y,Bitmap bm){this.bm = bm;this.x=x;this.y = y;this.p_x = x;this.p_y = y;}//判斷每個小方塊的位置是否正確public Boolean isTrue(){if (x==p_x&&y==p_y){return true;}return false;}} }

最后

感謝素材提供者 李啪啪

總結

以上是生活随笔為你收集整理的Android—拼图小游戏的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。