Thursday, 2 August 2018

Android Zoomable endless rings

I am trying to create an endless zoomable rings, something like this -

enter image description here

Whenever a user pinch zooms, new small circle at the center is created and the outer circle grows bigger. I am using pinch zoom in relative layout to create the following effect, but not able to achieve it properly. I have created a repo for this, let me know if you can help https://github.com/rohankandwal/zoomable-growing-circles

Update:- Changed dispatchDraw method on the mentioned stackoverflow answer -

protected void dispatchDraw(Canvas canvas) {
    Paint myPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
    myPaint.setStyle(Paint.Style.STROKE);
    int strokeWidth = 4;  // or whatever
    myPaint.setStrokeWidth(strokeWidth);
    myPaint.setColor(0xffff0000);   //color.RED
    float radius = (float) (0.5 * (width + height) * 2.5);
    for (int i = 1; i <= 51; i=i+10) {
      canvas.drawCircle(canvas.getWidth() / 2, canvas.getWidth() / 2, (radius) + mScaleFactor + i,
        myPaint);
    }
    canvas.save();
    super.dispatchDraw(canvas);
    canvas.restore();
  }

This code allows circle to grow -

Original image without pinch zoom

Image without zoom

Image when pinch zoomed

Image with zoom

As you can see, zoom is working, but don't know how to create new circles when zoomed at certain level.



from Android Zoomable endless rings

No comments:

Post a Comment