完全カスタムコントロール-カスタムレーダースキャンコントロール(Shader、Matrixの学習)

カスタムレーダスキャンコントロール
効果の表示
効果図
知識点に触れる
Shaderクラス
Androidでは、画像やジオメトリをレンダリングするためのShaderクラスが用意されています.

Shaderクラスを使用して画像レンダリングを行う場合は、まずShaderオブジェクトを構築し、次にペイントのsetShader()メソッドでレンダリングオブジェクトを設定し、最後にこのペイントオブジェクトを画面に描画すればよい.

Shaderクラスは、5つの直接サブクラス

を含む

BitmapShaderイメージレンダリング

ComposeShaderブレンドレンダリング

LinearGradientリニアレンダリング

RadialGradientリングレンダリング

SweepGradient勾配レンダリングSweepGradientは、スキャンレンダリングとも呼ばれ、ある中心でx軸の正方向を反時計回りに1周回転することによって形成されるスキャン効果のレンダリング形式を指す.

//  (cx,cy)         ，         360   。color0           ，color1           。
public SweepGradient(float cx, float cy, int[] colors, float[] positions)
public SweepGradient(float cx, float cy, int color0, int color1)

画像レンダリングの詳細
Matrixクラス
Matrixはマトリックスであり,主な機能は座標マッピング,数値変換である.

Matrixクラスには4種類の基本変換があります

平行シフトsetTranslate()平行移動は、x軸およびy軸上で画像を簡単に移動することを意味する.

スケールsetScale()パラメータとして2つの浮動小数点数を使用し、各軸で発生したスケール量を表します.

回転setRotate()回転の角度を表す浮動小数点数を使用します.既定のポイント(0,0)の周囲では、正の数は時計回りに画像を回転させ、負の数は逆の時計回りに画像を回転させます.既定のポイントは画像の左上隅です.

誤切setSkew()正接変換の場合、数学的にはShear mappingまたはTransvectionとも呼ばれ、比較的特殊な線形変換である.

Matrixの原理
実現構想.

新規RadarView 4クラス継承View

onDraw()メソッドを書き換え、4つの鋸歯のない中空の円環を描き、2本の直線

を描きます.

最大円を半径とする実心グラデーション

を描く.

行列を作成し、キャンバスを回転し、再描画し、Handlerでループ

を実現する.
1.初期化データ

public RadarView4(Context context) {
        this(context, null);
    }
 
    public RadarView4(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }
 
    public RadarView4(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
 
        //     onDraw       ，                   
        init();
 
        //          
        mHandler.post(run);
    }
 
    private void init() {
        //      
        mCirclePaint = new Paint();
        mCirclePaint.setColor(Color.GRAY);
        //       
        mCirclePaint.setStrokeWidth(3);
        //       
        mCirclePaint.setAntiAlias(true);
        //      
        mCirclePaint.setStyle(Paint.Style.STROKE);
 
        //       
        mShaderPaint = new Paint();
        mShaderPaint.setAntiAlias(true);
        //           
        mShaderPaint.setStyle(Paint.Style.FILL);
    }

2.描画開始

protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        w = getMeasuredWidth();//  view   
        h = getMeasuredHeight();//  view   
 
        //      
        canvas.drawCircle(w / 2, h / 2, w / 12, mCirclePaint);
        canvas.drawCircle(w / 2, h / 2, w / 6, mCirclePaint);
        canvas.drawCircle(w / 2, h / 2, w / 4, mCirclePaint);
        canvas.drawCircle(w / 2, h / 2, w / 3, mCirclePaint);
        //     
        canvas.drawLine(w / 2 - w / 3, h / 2, w / 2 + w / 3, h / 2, mCirclePaint);
        canvas.drawLine(w / 2, h / 2 - w / 3, w / 2, h / 2 + w / 3, mCirclePaint);
 
        //        
        if (mShader == null)
            //      ，      ->      
            mShader = new SweepGradient(w / 2, h / 2, Color.TRANSPARENT, getResources().getColor(R.color.RED));
 
        //      
        mShaderPaint.setShader(mShader);
        //         
        canvas.concat(mMatrix);
        //       
        canvas.drawCircle(w / 2, h / 2, w / 3, mShaderPaint);
    }

3.Handlerループ描画による回転

private Handler mHandler = new Handler();
Runnable run = new Runnable() {
 
  @Override
   public void run() {
      start++;
      mMatrix = new Matrix();
      //         
      mMatrix.setRotate(start, w / 2, h / 2);
      //  ui
      postInvalidate();
      //    360 ，     
      start = start == 360 ? 0 : start;
      //    
      postDelayed(this, 10);
    }
};

ここはプロジェクトの住所です.
リファレンスhttp://blog.csdn.net/itjianghuxiaoxiong/article/details/50207009 http://www.jianshu.com/p/4918034e3f0e# http://blog.csdn.net/sahadev_/article/details/50432764