sams-w
sams-w

Reputation: 55

Drawing to the screen - need to be able to zoom and pinch

I'm currently drawing to the screen in my app. The user can draw a rectangle representing a room of their home but currently they are limited to the initial space.

What is the best way of making the screen simply a "window" onto a much larger canvas that the user can scroll, zoom etc. around while drawing? (I appreciate there would have to be a "drawing" touch mode and a "moving" touch mode)

Also, the canvas is a custom View class:

class HomerView extends View { // the custom View for drawing on
    // set up Bitmap, canvas, path and paint
    private Bitmap myBitmap; // the initial image we turn into our canvas
    private Canvas myCanvas; // the canvas we are drawing on
    private Rect myRect; // the mathematical path of the lines we draw
    private Paint myBitmapPaint; // the paint we use to draw the bitmap

    // get the width of the entire tablet screen
    private int screenWidth = getContext().getResources()
            .getDisplayMetrics().widthPixels;
    // get the height of the entire tablet screen
    private int screenHeight = getContext().getResources()
            .getDisplayMetrics().heightPixels;

    public HomerView(Context context) { // constructor of HomerView
        super(context);
        myBitmap = Bitmap.createBitmap(screenWidth, screenHeight,
                Bitmap.Config.ARGB_8888); // set our drawable space - the bitmap which becomes the canvas we draw on
        myCanvas = new Canvas(myBitmap); // set our canvas to our bitmap which we just set up
        myRect = new Rect(); // make a new rect
        myBitmapPaint = new Paint(Paint.DITHER_FLAG); // set dither to ON in our saved drawing - gives better color interaction
    }

    protected void onDraw(Canvas canvas) { // method used when we want to draw something to our canvas
        canvas.drawColor(Color.TRANSPARENT); // sets canvas colour
        canvas.drawBitmap(myBitmap, 0, 0, myBitmapPaint); // save the canvas to bitmap - the numbers are the x, y coords we are drawing from
        canvas.drawRect(myRect, myPaint); // draw the rectangle that the user has drawn using the paint we set up
    }

    @Override
    protected void onSizeChanged(int w, int h, int oldw, int oldh) { // if screen size changes, alter the bitmap size
        super.onSizeChanged(w, h, oldw, oldh);
        /*myBitmap = Bitmap.createBitmap(screenWidth, screenHeight,
                Bitmap.Config.ARGB_8888);
        myCanvas = new Canvas(myBitmap);*/
    }

            public void drawApplianceIcon() {
        myCanvas.drawBitmap(bmp, iX - 50, iY - 50, myBitmapPaint);
        makeToast("Lamp Drawn To Canvas");
    }


    // these variables are needed in touch listening
    private int mX, mY, iX, iY; // current x,y and initial x,y
    private static final float TOUCH_TOLERANCE = 4;

private void touch_start {} // touch methods
private void touch_move {}
private void touch_up {}

This is declared in onCreate like this:

 View drawingAreaView = new HomerView(this);
 setContentView(drawingAreaView);

How can I adapt my code so that it becomes a scrollable window?

Upvotes: 0

Views: 780

Answers (1)

Edward van Raak
Edward van Raak

Reputation: 4920

During initialization of the view try this?

setHorizontalScrollBarEnabled(true);
setVerticalScrollBarEnabled(true);

I guess you will also need http://developer.android.com/reference/android/view/ScaleGestureDetector.html

And some kind of Viewport logic that holds all the locations.

Also found this.

Android: Enable Scrollbars on Canvas-Based View

Upvotes: 1

Related Questions