Android SurfaceView 多線程繪圖

fly_xiaosu 7年前發布 | 10K 次閱讀 Bitmap 多線程 Android開發移動開發 SurfaceView

以前學習過分形幾何，很有意思，由簡單的數學公式迭代計算得到的分形圖形，放大后不會丟失細節。典型的如Mandelbrot圖形：

Mandelbrot.png

計算方式也不復雜，由f(z) = z^2 + c,迭代計算 z1=f(z0), z2=f(z1), z3=f(z2)...其中z, c都是復數，可以表示為復平面上的一個點，而每個點的計算次數可以映射為一個顏色值（就像不同溫度映射為熱成像），把這些不同坐標、不同顏色的點組合起來，就是一張分形圖形了。

那么，Android下如何實現呢？

已知使用 Bitmap.setPixel(int x, int y, int color) 方法可以將計算結果保存到Bitmap中，有多種方法展示：

一次計算出整個圖形的Bitmap，顯示到ImageView上：
計算時間可能較長，計算過程中看不到任何畫面
使用SurfaceView，利用可以動態刷新的特點，開啟多個線程各計算圖片的一部分，某個線程計算完成后將結果刷新到Surface上，直到所有線程結束
使用TextureView，原理跟SurfaceView相同。在Android4.0之后使用，支持硬件加速，并且TextureView可以放大，縮小，平移等（這些操作在SurfaceView上無效）

SurfaceView效果圖如下：

rects.gif

SurfaceView的基本使用

//創建SurfaceView，也可以直接放到layout布局中
    SurfaceView surface = new SurfaceView(this);
    //獲取SurfaceHolder
    SurfaceHolder holder = surface.getHolder();
    //添加Callback
    holder.addCallback(mCallback);

    //創建Callback
    SurfaceHolder.Callback mCallback = new SurfaceHolder.Callback() {
        @Override
        public void surfaceCreated(SurfaceHolder holder) {
        //表示Surface準備好，可以繪制了

            //繪制在整個Surface上
            Canvas canvas = holder.lockCanvas();
            canvas.drawColor(Color.BLACK);
            holder.unlockCanvasAndPost(canvas);

            //繪制在Surface中的一個矩形區域內
            canvas = holder.lockCanvas(new Rect(0,0,100,100));
            canvas.drawColor(Color.RED);
            holder.unlockCanvasAndPost(canvas);
        }

        @Override
        public void surfaceChanged(SurfaceHolder holder, int format, int width, int height) {
        }

        @Override
        public void surfaceDestroyed(SurfaceHolder holder) {
        //表示Surface銷毀，不能繪制
        }
    };

幾個注意點：

Surface的可繪制狀態是在SurfaceHolder.Callback的 surfaceCreated(SurfaceHolder holder) 方法回調后， surfaceDestroyed(SurfaceHolder holder) 方法回調前，可以用一個boolean變量標記可繪制狀態，在每次繪制前先判斷這個變量。如果在Surface創建前，或者Surface銷毀后進行繪制，也會直接拋出異常
holder.unlockCanvasAndPost(Canvas c) ，從方法名中的post可以看出，這個方法不是立即執行的，連續多次調用會一次顯示最終的結果。比如，畫一個矩形，調用unlockCanvasAndPost，接著畫另一個矩形，調用unlockCanvasAndPost，Surface上會直接顯示兩個矩形
holder.lockCanvas(Rect r) ，這個方法會從Surface中取出一塊矩形區域進行刷新，Surface中的其他部分保持原樣，也就是動態局部刷新。這個方法調用后會修改傳入的參數 Rect r！！！如果后面還要用 r，就不能指望 r 中還是原來的數據，建議傳入參數時構造一個新的Rect對象-- lockCanvas(new Rect(r))
從lockCavas()到unlockCanvasAndPost()的過程只能有一個線程操作(不需要是主線程)。也就是不能線程A調用了lockCavas()，還沒有unlock，另一個線程B就跑來lock，這時會直接拋出異常。要使用多線程操作SurfaceView的話，可以把這兩個方法封裝在一個同步方法里，或者使用其他方式保證同一時間只有一個線程在修改Surface

（下面是具體的方法）

計算一塊矩形區域的分形圖形，并保存到Bitmap中

調整傳入的參數可以得到不同的圖形

public Bitmap calculateBitmap(Rect r, float re, float im) {
        Complex z = new Complex(0f,0f);
        Complex c = new Complex(re, im);
        Bitmap bitmap = Bitmap.createBitmap(r.width(), r.height(), Bitmap.Config.RGB_565);
        for (int i = r.left - width / 2; i < r.right - width / 2; i++) {
            for (int j = r.top - height / 2; j < r.bottom - height / 2; j++) {
                z.re = i * 2f / width;
                z.im = j * 3f / height;

                int k = 0;
                for (; k < ITERATE_TIMES; k++) {
                    if (z.abs() > 2) break;
                    z.mul(z);
                    z.add(c);
                }

                int color = generateColor(k);

                bitmap.setPixel((i + width / 2) % r.width(), (j + height / 2) % r.height(), color);
            }
        }
        return bitmap;
    }

把迭代次數映射為顏色值

修改這個方法可以得到不同的顏色效果

protected int generateColor(int k) {
        int r, g, b;

        if (k < 16) {
            g = 0;
            b = 16 * k - 1;
            r = b;
        } else if (k < 32) {
            g = 16 * (k - 16);
            b = 16 * (32 - k) - 1;
            r = g;
        } else if (k < 64) {
            g = 8 * (64 - k) - 1;
            r = g;
            b = 0;
        } else { // range is 64 - 127
            r = 0;
            g = 0;
            b = 0;
        }
        return Color.argb(255, r, g, b);
    }

同步繪圖

synchronized void drawBitmap(SurfaceHolder holder, Rect r, Bitmap bitmap) {
        if (isAvailable.get()) {
            Canvas canvas = holder.lockCanvas(new Rect(r));
            canvas.drawBitmap(bitmap, r.left, r.top, null);
            holder.unlockCanvasAndPost(canvas);
        }
    }

多線程計算

先將屏幕切分成多個矩形方塊，便于開啟多線程計算，將得到的所有Rect保存到一個集合中，可以使用 Collections.shuffle() 方法打亂排序，獲得不同的視覺效果；
然后使用 Executors.newFixedThreadPool(5) 方法建立一個最大5個線程的線程池（這個數字跟設備CPU核數有關，一般用2*核數+1。線程數太少不能充分發揮CPU的性能；線程數太多了沒有意義，實際開不了那么多線程，但沒有發現負面作用）；

遍歷Rect集合，每取出一個Rect就丟到線程池中去計算，計算完調用同步繪圖方法刷新SurfaceView。

ExecutorService executorService = Executors.newFixedThreadPool(5);

     ArrayList<Rect> list = new ArrayList<>(xCount * yCount);

     for (int i = 0; i < xCount; i++) {
         for (int j = 0; j < yCount; j++) {
             Rect r = new Rect(i * xSize, j * ySize, (i + 1) * xSize, (j + 1) * ySize);
             list.add(r);

         }
     }

     //打亂排序
     Collections.shuffle(list);

     for (final Rect r : list) {
         executorService.execute(new Runnable() {
             @Override
             public void run() {
                 Bitmap bitmap = calculateBitmap(r);
                 syncDraw(r, bitmap);
             }
         });
     }

將Surface切分為條狀的效果如下

bars.gif

上面是繪制一張圖形的方法，改變 calculateBitmap(Rect r, float re, float im) 方法的參數可以得到完全不同的圖形。如果每個線程計算一個參數下的整個圖形，計算完刷新整個Surface，就能看到參數變化的動態效果（即幀動畫，由于計算速度的限制，導致幀數很低-_-!!）：

這里用到生產者-消費者模型，多個線程生產（計算Bitmap），一個線程消費（將Bitmap繪制到SurfaceView上）。Java中一般而言有兩種方法：一是利用wait/notify(notifyAll)機制；二是使用java.util.concurrent包中的對象，如BlockingQueue、ConcurrentMap等。后者能自動處理并發問題，使用起來比較方便，新代碼中沒有必要使用前者。當然后者也是對前者的封裝，最好能了解前者的原理。

構造一個 ConcurrentHashMap<Integer, Bitmap> 用于保存序號和對應的Bitmap圖形
構造一個線程池，在一個固定次數（如500）的循環內，添加線程任務（生產者線程）：根據循環變量生成漸變的參數，計算出對應的Bitmap圖形，然后將循環的次數和Bitmap圖形添加到ConcurrentHashMap中（如果直接繪圖，就不能保證圖形變化跟隨參數變化的順序）
添加消費者線程任務：每個一段時間從ConcurrentHashMap中取出循環變量對應的Bitmap，要用 remove() 而不是 get() ，否則map的大小會不斷增大。如果取出的Bitmap不為空，就繪制到SurfaceView上（因為是單線程操作，所以沒必要用同步方法），否則繼續等待和取出。
注意要先添加消費者線程，再添加生產者線程（我的敘述是反的），否則消費者線程可能擠不進去！

final ConcurrentHashMap<Integer, Bitmap> map = new ConcurrentHashMap<>(10);

        service = Executors.newFixedThreadPool(6);

        service.execute(new Runnable() {
            @Override
            public void run() {
                int i = 0;
                paint = new Paint();
                paint.setColor(Color.RED);
                while (isAvailable.get()) {
                    int waitTime = map.size() == 0 ? 1000 : 1000 / map.size();
                    SystemClock.sleep(waitTime);

                    Bitmap bitmap = map.remove(i);
                    if (bitmap != null) {
                        String text = "(" + String.format("%.5f", C.re + FACTOR_RE * i)
                                +" , " + String.format("%.5f", C.im + FACTOR_IM * i)
                                + ") buffered: " + map.size();

                        drawBitmapAndText(bitmap, text);
                        i++;
                    }

                }
            }
        });

        for (int i = 0; i < 500; i++) {
            final int I = i;
            service.execute(new Runnable() {
                @Override
                public void run() {
                    float re = C.re + FACTOR_RE * I;
                    float im = C.im + FACTOR_IM * I;
                    Bitmap bitmap = calculateBitmap(new Rect(0, 0, width, height), re, im);
                    map.put(I, bitmap);
                }
            });
        }

調整參數的變化范圍后的動畫如下

本文由用戶 fly_xiaosu 自行上傳分享，僅供網友學習交流。所有權歸原作者，若您的權利被侵害，請聯系管理員。

轉載本站原創文章，請注明出處，并保留原始鏈接、圖片水印。

本站是一個以用戶分享為主的開源技術平臺，歡迎各類分享！

本文地址：http://www.baiduhome.net/lib/view/open1482458909558.html

Bitmap 多線程 Android開發移動開發 SurfaceView

Android SurfaceView 多線程繪圖

SurfaceView的基本使用

相關經驗

相關資訊

相關文檔

目錄