繁体   English   中英

如何在位图图像上绘制矩形,使图像居中?

[英]How to Draw Rectangle on Bitmap image, keeping image in the centre?

我正在尝试使用onTouchEvent方法在位图图像上绘制一个矩形,因此onTouch图像周围应该有一个矩形。 下面的代码创建了矩形,但是不幸的是,它与图像没有任何关系,无论图像在哪里,它都会在左上角绘制。 我该如何实现?

class DrawingView extends View{

    float x=0f,y=0f;
    float dX,dY;

    public DrawingView(Context context){
        super(context);
        viewCapture = BitmapFactory.decodeResource(context.getResources(), R.id.main);
    }

    public boolean onTouchEvent(MotionEvent event){
        switch(event.getAction()){
            case MotionEvent.ACTION_DOWN:
                dX = this.getX () - (int)event.getX();
                dY = this.getY () - (int)event.getY();
                invalidate();
            break;
            case MotionEvent.ACTION_MOVE:
                x = (int)event.getX();
                y = (int)event.getY();
                y += dY;
                x += dX;
                this.setY(y);
                this.setX(x);
                invalidate();
            break;
            case MotionEvent.ACTION_UP:
                x =(int)event.getX();
                y =(int)event.getY();
                y += dY;
                x += dX;
                this.setY(y);
                this.setX(x);
                invalidate();
            break;
        }
        return true;
    }

    @Override
    public void onDraw(Canvas canvas) {
        Paint paint = new Paint();
        paint.setStyle(Paint.Style.STROKE);
        paint.setColor(Color.BLACK);
        canvas.drawBitmap(viewCapture, x, y, paint);

        canvas.drawRect(x, y, x+viewCapture.getWidth() / 2, y+viewCapture.getHeight()/ 2, paint);
    }
}

无论图像在哪里,它都会绘制在左上角

因为您使用的是位图的一半大小。

canvas.drawRect(x, y, x+viewCapture.getWidth() / 2, y+viewCapture.getHeight()/ 2, paint);
}

在这里,您使用的是viewCapture.getWidth() / 2viewCapture.getHeight()/ 2

您必须使用和高度绘制带有全部Bitmap矩形。

canvas.drawRect(x, y, x+viewCapture.getWidth(), y+viewCapture.getHeight(), paint);

还有一点不要在onDraw方法中初始化Paint对象,因为该方法经常被调用。 通过初始化许多Paint对象,将占用大量内存。

在构造函数中使用初始化Paint的方法。

检查有关CustomView官方文档

编辑:

使用此代码可与TouchEvent一起移动并在Bitmap上绘制边框。

import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.support.annotation.Nullable;
import android.util.AttributeSet;
import android.util.DisplayMetrics;
import android.util.Log;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewGroup;
import android.view.WindowManager;

import com.yousuf.shawon.customviews.R;

import static android.content.Context.WINDOW_SERVICE;

public class DrawingView extends View {

    float dX,dY;
    Bitmap bitMap;
    Paint paint;

    int screenWidth, screenHeight;
    float preX, preY;

    private static final String TAG = "DrawingView";

    public DrawingView(Context context) {
        super(context);
        init(context);
    }

    public DrawingView(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
        init(context);
    }

    public DrawingView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init(context);
    }

    public void init(Context context){


        DisplayMetrics displayMetrics = new DisplayMetrics();
        WindowManager windowManager = (WindowManager) context.getSystemService(WINDOW_SERVICE);
        windowManager.getDefaultDisplay().getMetrics(displayMetrics);

        screenWidth = displayMetrics.widthPixels;
        screenHeight = displayMetrics.heightPixels;

        Log.i(TAG, "init: Screen Width: " + screenWidth + " Screen Height: " + screenHeight);

        paint = new Paint();
        paint.setStyle(Paint.Style.STROKE);
        paint.setColor(Color.RED);
        paint.setStrokeWidth(5);
        bitMap = BitmapFactory.decodeResource(context.getResources(), R.drawable.playbtn);
    }


    public boolean onTouchEvent(MotionEvent event){
        switch(event.getAction()){
            case MotionEvent.ACTION_DOWN:
                preX = event.getRawX();
                preY = event.getRawY();

                try {
                    ViewGroup parent = (ViewGroup) getParent();
                    int bottom = parent.getBottom();
                    screenHeight = bottom;
                }catch (Exception e){

                }

                break;
            case MotionEvent.ACTION_MOVE:

                dX = event.getRawX() - preX ;
                dY = event.getRawY() - preY;

                preX = event.getRawX();
                preY = event.getRawY();

                float newX = getX() + dX;
                float newY = getY() + dY;

                if(( newX  >= 0 && newX < screenWidth-getWidth() ) && ( newY >= 0 && newY < screenHeight - getHeight() )  ){
                    setX(getX() + dX);
                    setY(getY() + dY);
                }

                invalidate();

                break;
            case MotionEvent.ACTION_UP:
                Log.i(TAG, "onTouchEvent: UP");
                break;
        }
        return true;
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        //super.onMeasure(widthMeasureSpec, heightMeasureSpec);

        int contentWidth = bitMap.getWidth() + getPaddingLeft() + getPaddingRight();
        int contentHeight = bitMap.getHeight() + getPaddingTop() + getPaddingBottom();

        int measuredWidth = resolveSize(contentWidth, widthMeasureSpec);
        int measuredHeight = resolveSize(contentHeight, heightMeasureSpec);


        setMeasuredDimension(measuredWidth, measuredHeight);
    }




    @Override
    public void onDraw(Canvas canvas) {
        super.onDraw(canvas);

            float startX = getPaddingLeft() ;
            float startY = getPaddingTop() ;

            canvas.drawBitmap(bitMap, startX  , startY , paint);
            canvas.drawRect(startX, startY, startX + bitMap.getWidth(), startY + bitMap.getHeight(), paint);


    }
}

xml

    <com.yousuf.shawon.customviews.views.DrawingView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:padding="10dp"
    android:layout_margin="10dp"
    />

编辑2:将自定义宽度和高度设置为固定值,以便您轻松拖放。 如果您的位图太大而无法调整其大小并用小Rect绘制

xml使用它

    <com.yousuf.shawon.customviews.views.DrawingView
    android:layout_width="100dp"
    android:layout_height="100dp"
    android:padding="10dp"
    android:layout_margin="10dp"
    android:background="@color/colorAccent"
    />

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM