在Android中绘制和缩放ImageView和画布

时间:2016-05-03 05:00:32

标签: android canvas imageview zoom

我希望能够在<{1}}和ImageView绘制缩放

我已经可以这样做了,但是当我绘制一些内容然后缩放图像时 - 如下图所示,绘图仍保留在原位:

originalimage

zoomedimage

这是我的代码:

activity_main.xml中

Canvas

MainActivity.java

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity" >
<Button
    android:id="@+id/enable_zoom"
    android:layout_height="wrap_content"
    android:layout_width="wrap_content"
    android:text="disable zoom"/>

<com.zoomtrial2.CustomImageView
    android:id="@+id/zoom_iv"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:src="@drawable/image"
    android:layout_below="@+id/enable_zoom" />

<com.zoomtrial2.DrawableView
    android:id="@+id/drawble_view"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_alignBottom="@+id/zoom_iv"
    android:layout_alignTop="@+id/zoom_iv" />

DrawableView.java

public class MainActivity extends Activity implements View.OnClickListener {

    private Button enableZoomBtn;
    private DrawableView drawbleView;
    private CustomImageView touchImageView;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        drawbleView = (DrawableView) findViewById(R.id.drawble_view);
        enableZoomBtn = (Button) findViewById(R.id.enable_zoom);
        touchImageView = (CustomImageView) findViewById(R.id.zoom_iv);
        enableZoomBtn.setOnClickListener(this);
        drawbleView.setDrawingEnabled(false);
    }
    @Override
    public void onClick(View v) {
        int id = v.getId();
        switch (id) {
            case R.id.enable_zoom:
                if(enableZoomBtn.getText().equals("disable zoom")){
                    touchImageView.setZoomEnable(false);
                    drawbleView.setDrawingEnabled(true);
                    enableZoomBtn.setText("enable zoom");
                } else{
                    touchImageView.setZoomEnable(true);
                    drawbleView.setDrawingEnabled(false);
                    enableZoomBtn.setText("disable zoom");
                }
                break;

            default:
                break;
        }
    }
}

CustomImageView.java

public class DrawableView extends View {
    public int width;
    public  int height;
    private boolean isEditable;
    private Path drawPath;
    private Paint drawPaint;
    private Paint canvasPaint;
    private Canvas drawCanvas;
    private Bitmap canvasBitmap;
    private int paintColor = Color.RED;
    public DrawableView(Context context) {
        super(context);
    }
    public DrawableView(Context context, AttributeSet attrs) {
        super(context, attrs);
        this.canvasPaint = new Paint(Paint.DITHER_FLAG);
        setupDrawing();
    }
    public DrawableView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }
    @Override
    protected void onSizeChanged(int w, int h, int oldw, int oldh) {
        super.onSizeChanged(w, h, oldw, oldh);
        this.height = h;
        this.width = w;
        canvasBitmap = Bitmap.createBitmap(w, h, Bitmap.Config.ARGB_8888);
        drawCanvas = new Canvas(canvasBitmap);
    }
    private void setupDrawing() {
        drawPath = new Path();
        drawPaint = new Paint();
        drawPaint.setColor(paintColor);
        drawPaint.setAntiAlias(true);
        drawPaint.setDither(true);
        drawPaint.setStyle(Paint.Style.STROKE);
        drawPaint.setStrokeJoin(Paint.Join.ROUND);
        drawPaint.setStrokeCap(Paint.Cap.ROUND);
        drawPaint.setStrokeWidth(10);
    }
    public void setDrawingEnabled(boolean isEditable){
        this.isEditable = isEditable;
    }
    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        canvas.drawBitmap(canvasBitmap, 0, 0, canvasPaint);
        canvas.drawPath(drawPath, drawPaint);
    }

    @Override
    public boolean onTouchEvent(MotionEvent event) {
        if(isEditable){
            float touchX = event.getX();
            float touchY = event.getY();
            switch (event.getAction()) {
                case MotionEvent.ACTION_DOWN:
                    drawPath.moveTo(touchX, touchY);
                    break;
                case MotionEvent.ACTION_MOVE:
                    drawPath.lineTo(touchX, touchY);
                    break;
                case MotionEvent.ACTION_UP:
                    drawPath.lineTo(touchX, touchY);
                    drawCanvas.drawPath(drawPath, drawPaint);
                    drawPath = new Path();
                    break;
                default:
                    return false;
            }
        } else{
            return false;
        }
        invalidate();
        return true;
    }
}

1 个答案:

答案 0 :(得分:0)

缩放时,仅调用setImageMatrix(matrix)。这将矩阵设置为图像,然后将其应用。这里的问题是它不会将其应用于您创建的额外路径。您需要做的是将矩阵应用于画布上的各种元素。您永远不会将矩阵应用于路径,因此它们会不同步。您的drawableview onDraw()例程非常适合该代码。您也可以自己绘制位图,然后摆脱图像视图。毕竟,您要做的事情不只是具有一些图像挂钩的视图而已。