アンドロイド

5つのマップがAndroidCanvasの座標変換を学習します（回転変換スケール）



Five Maps Learn Coordinate Translation Android Canvas



会社のプロジェクトを作成するときは、垂直のSeekBarを描画する必要があります。最初は、xmlファイルにandroid：rotate = '-90'構成を追加するのは簡単ですが、後で多くの問題が見つかります。最後に、Canvas.rotate（）とCanvas.translate（）の組み合わせを使用したオンライン検索データにより、垂直方向のSeekBarレイアウトを実現します。

A.Canvasの座標系の概要



一般的に、カスタムビューキャンバスの表示領域はビューの領域であり、サイズは幅*高さです。

@Override protected synchronized void onDraw(Canvas canvas) { super.onDraw(canvas) Paint p = new Paint() p.setColor(getResources().getColor(R.color.yellow)) canvas.drawRect(0, 0, 200, 100, p) }

Canvas座標系の頂点は左上隅（0、0）の位置にあり、X軸は右、Y軸は下にあります。



2. Canvasのrotate（）、translate（）、scale（）などのメソッド。

1.Canvas.rotate（）

2つの図は、canvas.rotate（90）とcanvas.rotate（-90）の後にグラフィックがどのように表示されるかを示しています。ただし、どの変換後も、表示領域は元のキャンバスの領域のままであるため、この変換では画面に何も表示されないことに注意してください。

2.Canvas.translate（）



canvas.translate（100,100）の変換後、キャンバス全体がxとyの正の方向に100度移動します。

Canvas.translate（-100、-100）は、100をXとYの負の方向に移動して、Rectの一部が可視範囲に入らないようにします。

3.Canvas.scale（）

左の画像はcanvas.scale（0.5f、0.5f）の後に得られたグラフです。キャンバスと上のRectの幅と高さの両方が半分であることがわかります。

上の図は、canvas.scale（2f、2f）の後に取得されたグラフィックです。キャンバスと上記のRectの幅と高さが2倍になっていることがわかります。また、レクには見えない部分があることがわかります。スコープ、超過分は表示されません。

三。水平SeekBarは垂直SeekBarになります

上の図に示すように、水平方向のSeekBarは、canvas.rotate（-90）およびcanvas.translate（-200、0）によって垂直方向に作成できます。座標系が変更されたため、平行移動を変更すると、canvas.translate（0、200）ではなくcanvas.translate（-200、0）になることに注意してください。

ここで注意すべき最も重要なことは、rotate（）変換後の軸の位置です。キャンバスが回転すると、軸も回転します。