SurfaceTextureレンダラ （ 連続画像を画面に描画 )

SurfaceTexture に出力した画像を、画面に描画する方法を解説します。

前項「SurfaceTextureレンダラ （ 画像を１度だけ画面に描画 )」で作成したSurfaceTextureレンダラは、画像を１度だけ画面に描画するレンダラであり、画面に描画される画像が変わることはありませんでした。
本項では、SurfaceTextureレンダラを、連続画像を画面に描画するものに変更します。

解説

前項に対する処理の変更は以下です。

• 連続で「Surfaceでの描画」が行われるように、「Surfaceでの描画」関数の末尾に、0.1秒（100ミリ秒）後に、再度「Surfaceでの描画」を呼び出す処理を追加します。
• 「SurfaceTextureRenderer」クラスの「Surfaceでの描画」を、乱数を用いた描画に変更します。
• 「SurfaceTextureRenderer」クラスのメンバーに、乱数オブジェクトと、Handlerオブジェクトの変数を追加します。

実装

アプリの仕様

• アプリを起動すると、メインアクティビティが表示される。
• 背景色は、灰色。
• 0.1秒（100ミリ秒）ごとに、矩形と円が、ランダムな色、位置、大きさで表示される。

プロジェクトを開く

「SurfaceTextureレンダラ （ 画像を１度だけ画面に描画 )」で作成したプロジェクトを開きます。

クラスメンバー変数の追加

「SurfaceTextureRenderer」クラスのメンバーに、乱数オブジェクトと、Handlerオブジェクト、Runnableオブジェクト（とrun関数の定義）を追加します。

class SurfaceTextureRenderer implements GLSurfaceView.Renderer, SurfaceTexture.OnFrameAvailableListener { （・・・略・・・） // ランダムサークル描画用メンバ変数 private final Paint m_paint = new Paint(); private final Random m_random = new Random(); private final Handler m_handlerDrawInSurface = new Handler( Looper.getMainLooper() ); private final Runnable m_runnableDrawInSurface = new Runnable() { @Override public void run() { drawInSurface(); m_handlerDrawInSurface.postDelayed( m_runnableDrawInSurface, 100 ); } }; // シェーダーコード （・・・略・・・）

「Cannot resolve symbol」エラーは、「Alt + Enter」で、必要なクラスをimportします。

「Surfaceでの描画」関数の変更

「SurfaceTextureRenderer」クラスの「Surfaceでの描画」を、乱数を用いた描画に変更します。
連続で「Surfaceでの描画」が行われるように、「Surfaceでの描画」関数の末尾に、0.1秒（100ミリ秒）後に、再度「Surfaceでの描画」を呼び出す処理を追加します。

// Surfaceでの描画 private void drawInSurface() { Log.d( TAG, "drawInSurface" ); Log.d( TAG, "Thread name = " + Thread.currentThread().getName() ); // Thread name = GLThread XXXX Canvas canvas = m_surface.lockCanvas( null ); // 全体塗りつぶし canvas.drawColor( Color.rgb( 128, 128, 128 ) ); // 矩形 m_paint.setColor( Color.rgb( m_random.nextInt( 255 ), m_random.nextInt( 255 ), m_random.nextInt( 255 ) ) ); m_paint.setStyle( Paint.Style.FILL ); int iX = m_random.nextInt( m_iTextureWidth ); int iY = m_random.nextInt( m_iTextureWidth ); int iHalfWidth = m_random.nextInt( 200 ); int iHalfHeight = m_random.nextInt( 200 ); canvas.drawRect( iX - iHalfWidth, iY - iHalfHeight, iX + iHalfWidth, iY + iHalfHeight, m_paint ); // 円 m_paint.setColor( Color.rgb( m_random.nextInt( 255 ), m_random.nextInt( 255 ), m_random.nextInt( 255 ) ) ); m_paint.setStyle( Paint.Style.STROKE ); m_paint.setStrokeWidth( 30 ); int iRadius = m_random.nextInt( 200 ); canvas.drawCircle( m_random.nextInt( m_iTextureWidth ), m_random.nextInt( m_iTextureHeight ), iRadius, m_paint ); m_surface.unlockCanvasAndPost( canvas ); m_handler.postDelayed( new Runnable() { @Override public void run() { drawInSurface(); } }, 100 ); }

リビルドし、エラー、警告がないことを確認します。

実行

Android端末にて、動作確認。



アプリを起動すると、メインアクティビティが表示されます。
背景色は、灰色。
0.1秒（100ミリ秒）ごとに、矩形と円が、ランダムな色、位置、大きさで表示されます。

ダウンロード

サンプルコード

関連ページ

SurfaceTextureレンダラ （ 画像を１度だけ画面に描画 )

SurfaceTextureレンダラ （ 連続画像を画面に描画 ) - 本ページ

SurfaceTextureレンダラ （ 頂点バッファオブジェクトの利用 )