自定義View之貪喫蛇

本次的重點，如何讓自定義View動起來。

效果如下圖： 如圖所見，我們自定義3個View

一個是單元Tileview,用來畫方塊

一個是貪喫蛇SnakeView繼承至TileView

一個是背景BackgroundView

本次重點介紹SnakeView因爲只有小蛇是動的。

前面講過，讓View刷新有兩種方式，一個在UI線程中，一個在非UI線程（一般使用SurfaceView）。

簡單的，不是非常頻繁的刷新可以在UI線程中。SnakeView就是採用這種方式。

核心實現：

1.使用Handler來刷新View，使用Handler中的 sendMessageDelayed的方式來控制小蛇的速度。delay越久，小蛇速度越慢。

 

class RefreshHandler extends Handler {


        @Override
        public void handleMessage(Message msg) {
            //更新小蛇的狀態
            SnakeView.this.update();
            //刷新小蛇的view
            SnakeView.this.invalidate();
        }


        public void sleep(long delayMillis) {
            this.removeMessages(0);
            sendMessageDelayed(obtainMessage(0), delayMillis);
        }
    };

2.重寫ondraw方法中，構造小蛇身體組成的方塊即可。

@Override
    public void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        for (int x = 0; x < mXTileCount; x += 1) {
            for (int y = 0; y < mYTileCount; y += 1) {
                if (mTileGrid[x][y] > 0) {
                    canvas.drawBitmap(mTileArray[mTileGrid[x][y]], mXOffset + x * mTileSize,
                            mYOffset + y * mTileSize, mPaint);
                }
            }
        }
    }

將這個屏幕轉化爲一個矩陣，矩陣的行數就是mXTileCount，列數就是mYTileCount.對應的元素是方塊，是否需要畫方塊由mTileGrid[][]二維數組保存的值決定的。

小蛇的行動其實就是對mTileGrid二維數組中的值進行修改。每次更新View都會將這個二維數組遍歷一次，重新構造View。因此效率很差。

mXTileCount：當前屏幕X方向最都能畫幾個方塊

mYTileCount：當前屏幕Y方向最都能畫幾個方塊

總結：直接在線程UI中操作View刷新

優點：實現簡單。

缺點：效率低，不流暢，view位置變化是很生硬，從這消失，到那出現。中間沒有動畫來連貫。