android 遊戲之情境的實現以及拓展應用照片瀏覽器

  下面我們說下有遊戲，當我們過關卡的時候遊戲中或許出現情境切換，這對做遊戲開發的同學們在熟悉不過了，這裡我簡單介紹下，一來自己鞏固下學習的知識，二來把我學習的心得分享出來，以便大家共同進步.  實現原理：首先我們對螢幕進行clipRect擷取相應的矩形模組.然後在用圖片進行填充. 矩形（橫向）交差情境實現：[java]  /***      * 矩形情境(橫向)      */      public void doRect_H() {          /** 交錯的實現矩形相交 **/          int ractHeight = (mScreenHeight / ractCount);// 擷取每個矩形寬度.          // 左邊開始(偶數0,2,4...)          for (int i = 0; i < ractCount; i += 2) {              drawFillRect(mCanvas, Color.BLACK, 0, i * ractHeight, rectStep,                      ractHeight);          }          // 右邊開始（奇數1,3,5...）          for (int i = 1; i < ractCount; i += 2) {              drawFillRect(mCanvas, Color.BLACK, mScreenWidth - rectStep, i                      * ractHeight, rectStep, ractHeight);          }        }  我簡單講解下流程:針對螢幕我們分割成10條矩形，然後我們在對這10條矩形進行一一填充.而填充的就是下一個的情境.矩形（縱向）交差情境同理.這裡要說明一點，你要理解canvas的save和restore方法.          save：用來儲存Canvas的狀態。save之後，可以調用Canvas的平移、放縮、旋轉、錯切、裁剪等操作。           restore：用來恢複Canvas之前儲存的狀態。防止save後對Canvas執行的操作對後續的繪製有影響。          save和restore要配對使用(restore可以比save少，但不能多)，如果restore調用次數比save多，會引發Error。save和restore之間，往往夾雜的是對Canvas的特殊操作。百葉窗情境實現：[java] /***      * 百葉窗情境      */      public void doSQUARE() {          /** 百葉窗效果利用雙for迴圈 修改每個矩形繪製的寬度 **/          for (int i = 0; i <= (mScreenWidth / squareRange); i++) {// 算取寬包含多少個正方形，              for (int j = 0; j <= (mScreenHeight / squareRange); j++) {// 算去高包含多少正方形.                  drawFillRect(mCanvas, Color.BLACK, i * squareRange, j                          * squareRange, rectStep, rectStep);              }          }      }  簡單說明：根據View的寬高分割成若干個正方形然後一一進行填充.滾動(向右)水紋情境:[java]  /***      * 滾動水紋情境(右移動)      */      public void doSHADOW_RINGHT() {          /***          * 在這裡我們要算去各個矩形的寬度以及起始的X座標          *           * 注意要理解其含義.          */          int X1 = rectStep + rectX1;// 矩形1的x座標          int rectWidth1 = rectW + 12;// 矩形1的寬度          int X2 = X1 + rectWidth1 + rectX2;          int rectWidth2 = rectW + 5;          int X3 = X2 + rectWidth2 + rectX3;          int rectWidth3 = rectW;            /** 水紋效果其實繪製了4個矩形 中間留一些縫隙 **/          drawFillRect(mCanvas, Color.BLACK, 0, 0, rectStep, mScreenHeight);            drawFillRect(mCanvas, Color.BLACK, X1, 0, rectWidth1, mScreenHeight);            drawFillRect(mCanvas, Color.BLACK, X2, 0, rectWidth2, mScreenHeight);// 繪製第二條矩形            drawFillRect(mCanvas, Color.BLACK, X3, 0, rectWidth3, mScreenHeight);// 繪製第三條矩形        }  簡單說明：首先我們將螢幕分割四個長方形.第一個會時時增大及向右移動，而其餘三個長方形也跟隨右移動，所以感覺類似於滾動波紋.滾動(向左)水紋情境同理.橫向分割場:[java]  /***      * 橫向分割圖片      */      public void doHalf_V() {          int Y = mScreenHeight / 2;// 擷取中間分割線          int Y1 = Y - rectStep;// 上半部分X座標            drawFillRect(mCanvas, Color.BLACK, 0, Y1, mScreenWidth, rectStep);// 繪製上部分            drawFillRect(mCanvas, Color.BLACK, 0, Y, mScreenWidth, rectStep);// 繪製下部分      }  這個我就不說明了，因為這個是最簡單的一個.最後我們來看下drawFillRect方法.[java] /**      * 繪製一個矩形      *       * @param canvas      * @param color      * @param x      * @param y      * @param w      * @param h      */      public void drawFillRect(Canvas canvas, int color, int x, int y, int w,              int h) {          int backColor = mPaint.getColor();          mPaint.setColor(color);          canvas.save();          canvas.clipRect(x, y, x + w, y + h);          int id = currentId + 1;          if (id == bitmap.length)              id = 0;          // 繪圖          canvas.drawBitmap(bitmap[id], null, rectF, null);          canvas.restore();          mPaint.setColor(backColor);      }  這個方法是對你剪裁的矩形進行填充圖片.代碼都比較簡單，相信大家都能看明白.或許大家發現了，我們的情境其實都是由矩形得來的，這也得益於API提供了這個clipRect方法，但是API只提供了對矩形的剪裁，比如說圓形、弧形可是沒有，所以我沒有辦法做到這些，不過提供矩形的剪裁已經不錯了，只要你有好的實現想法，都可以自己一一構造。情境就介紹到這裡. 下面我們進行拓展：其實也不叫拓展，因為我是做應用的，所以第一個想到的就是這東東在應用中可以實現什麼效果. 比如個性相簿播放器.或者圖片瀏覽器等等.其實把遊戲中的效果運用到應用的話，效果會很不錯的.下面我介紹下實現的流程：首先我們要自訂SurfaceView控制項,將擷取圖片數組集合射入到該自訂控制項中.然後就是邏輯處理，我們要每5分鐘執行一片切換，也就是情境轉場效果.而執行情境切換的效果最好是隨機的.就這麼多簡單吧.只要你明白原理，其實實現起來一點也不難，難的是我們的邏輯要進行如何處理，這也是遊戲開發的痛點，不同於應用，應用控制項都是現成的，頂多重寫其控制項額外增加些協助工具功能.所以最重要的一點：你要有耐心. 好了，下面我們看下效果吧.（看著還不錯吧. 截屏工具不好，所以看起來有點卡，手機模擬器運行沒有什麼問題的.）