安卓實現老虎機抽獎的案例

        最近看到某理財app上有一個類似老虎機的抽獎功能,覺得蠻好玩就想自己動手去實現下.就做了一個簡單的案例,效果如下:

         

         我說下思路吧,先準備兩組圖片,紅色背景一組,黃色背景一組,如圖

             

         

        // 未開始抽獎時的圖片
	private int[] imgs1 = { R.drawable.m1, R.drawable.m2, R.drawable.m3,
			R.drawable.m4, R.drawable.ic_launcher, R.drawable.m5,
			R.drawable.m6, R.drawable.m7, R.drawable.m8 };
	// 開始抽獎時的圖片
	private int[] imgs2 = { R.drawable.n1, R.drawable.n2, R.drawable.n3,
			R.drawable.n4, R.drawable.ic_launcher, R.drawable.n5,
			R.drawable.n6, R.drawable.n7, R.drawable.n8 };

             別忘了中間還有個ic_launcher。

         新建一個GridView,把第一組圖片適配給GridView。

           然後定義一個子線程       

class MyRunnable implements Runnable {
		@Override
		public void run() {
			handler.sendEmptyMessage(0);  //發送消息
			//如果到達指定的時間,則停止
			if (startTime >= stopTime) {
				handler.removeCallbacks(mMyRunnable);
				//提示中獎消息 
				if (array[num] < 4) {
					String text = array[num] + 1 + "";
					Toast.makeText(context, "恭喜你中了" + text, 0).show();
				} else {
					Toast.makeText(context, "恭喜你中了" + array[num], 0).show();
				}
            	startTime = 0;
				stopTime = 0;
				return;
			}
			//每隔100毫秒運行一次
			handler.postDelayed(mMyRunnable, 100);
			startTime += 100;
		}
	}

        運行的時候每隔一段時間發送消息, 本文是100毫秒, 由handler來處理,當到達指定的時間時就移除消息隊列,線程停止運行,startTime初始爲0，每運行一次就增加100毫秒,stopTime則是事先設置的隨機時間    

  //定義一個隨機數最爲結束的時間，這裏是2到6秒
  stopTime = new Random().nextInt(1000 * 5) + 2000;

       handler接受消息後處理消息  ,改變GridView中item的背景色,array是轉盤id的數組    

       // 對應轉盤id的數組
	private int[] array = { 0, 1, 2, 5, 8, 7, 6, 3 };

       傳入num,num從0到8依次增加,當到達最後一個item時則循環

               Handler handler = new Handler() {
		public void handleMessage(Message msg) {
			Change(array[num]);  //改變背景色
			num++;                 //依次下一個
			//如果到了最後一個item，則循環
			if (num >= 8) {
				num = 0;
			}
    	};
	};

       現在我們來看看Change方法.在這個方法裏,我們遍歷item的個數,當傳入的id爲選中的Item時則把圖片換成圖片數組2中對應的圖片,如果是中間那個id，即4，那麼跳出循環,不處理,其他的id都設置爲圖片數組1中對應的圖片.      

      private void Change(int id) {
		for (int i = 0; i < gridView.getChildCount(); i++) {
			if (i == id) {
 			//如果是選中的，則改變圖片爲數組2中的圖片
			((ImageView) (gridView.getChildAt(i).findViewById(R.id.img))).setBackgroundResource(imgs2[id]);
			} else if (i == 4) {
 		    //如果是到了中間那個，則跳出
				continue;
			} else {
 		    //未選中的就設置爲數組1中的圖片
				((ImageView) (gridView.getChildAt(i).findViewById(R.id.img))).setBackgroundResource(imgs1[i]);
			}
		}
	}

         這裏再貼上佈局代碼吧,item佈局        

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
      >

    <ImageView
        android:id="@+id/img"
        android:layout_width="60dp"
        android:layout_height="60dp" 
        android:layout_centerInParent="true" 
        />

</RelativeLayout>

       main佈局 

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
     >

    <GridView
        android:id="@+id/gridview"
        android:layout_width="wrap_content"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:verticalSpacing="40dp"
        android:layout_gravity="center"
        android:gravity="center"
        android:numColumns="3" >
    </GridView>

    <Button
        android:id="@+id/start_btn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:text="開始" />

</LinearLayout>

        

         Demo下載地址:   點擊打開鏈接   密碼：61bh