https://kazzz.hatenablog.com/entry/20121127/p1

昨日も書いたが、iOSで書いたカスタムビューをandroidに移植している。
主な機能としては、昨日も書いたように画像のプレビューの他に、

- タップした箇所にポインタ(円)を描画
- ポインタ同士を線分で描画して接続
- 3点以上をタップした際にポインタで閉じた領域を塗り潰し

これらを実装している。
つまり、タップに合わせて、円と線を描画する必要がある訳だ。

カスタムビューでの独自の描画はandroidもiOSも非常によく似ている。

android

@Override
protected void onDraw(Canvas canvas) {
    //canvasを使って描画
}

iOS

- (void)drawRect:(CGRect)rect {
    [super drawRect:rect];
    CGContextRef ctx = UIGraphicsGetCurrentContext();
    //CGContextRefを使って描画
}

両プラットホームとも、このようにフレームワークからのコールバックメソッドをオーバライドすることでビューに直接描画を実行することができる。

更には両プラットホームとも線、円、多角形などのシェイプの描画を行う命令があり、一連の操作をまとめて実行することのできる「パス」というベクタグラフィクス風のメソッドがあるのも同じである。

パスを使って円を描画する

android

@Override
protected void onDraw(Canvas canvas) {
    canvas.drawColor(Color.WHITE);
    Paint paint = new Paint();
    paint.setAntiAlias(true);
    paint.setColor(Color.BLUE);
    path.addCircle(10, 10, 10, Path.Direction.CCW);
    canvas.drawPath(path, paint);
}

iOS

- (void)drawRect:(CGRect)rect
{
    CGContextRef ctx = UIGraphicsGetCurrentContext();
    CGContextAddEllipseInRect(ctx, rect);
    CGContextSetFillColorWithColor(ctx, [UIColor blueColor].CGColor);
    CGContextFillPath(ctx);
}

とよく似たプログラミング方法なのだが、大きな違いがあった。　と、今日はここで時間切れ。