【问题标题】:Resizeable Rectangle Overlay in AndroidAndroid中可调整大小的矩形覆盖
【发布时间】:2023-03-09 10:10:01
【问题描述】:

我正在尝试制作一个用户单击图像的应用程序。 点击图片后应该会出现3个矩形,可以根据图片中的文字移动和调整大小。

所以我的问题是如何在视图上制作这 3 个矩形以从图像的一部分中选择文本

请帮我解决这个问题

【问题讨论】:

    标签: android android-studio user-interaction


    【解决方案1】:

    这不是你想要的,但这个例子展示了如何在ImageView 上绘制一个矩形并缩放/移动它:

    public class OverlayImageView extends ImageView {
    
        private static final int INVALID_POINTER_ID = -1;
    
        private float mPosX;
        private float mPosY;
    
        private float mLastTouchX;
        private float mLastTouchY;
        private int mActivePointerId = INVALID_POINTER_ID;
    
        private ScaleGestureDetector mScaleDetector;
        private float mScaleFactor = 1.f;
    
        private Rect mInitialRect;
        private Paint mDrawPaint;
    
        public OverlayImageView(Context context) {
            this(context, null, 0);
        }
    
        public OverlayImageView(Context context, AttributeSet attrs) {
            this(context, attrs, 0);
        }
    
        public OverlayImageView(Context context, AttributeSet attrs, int defStyle) {
            super(context, attrs, defStyle);
            mScaleDetector = new ScaleGestureDetector(context, new ScaleListener());
    
            mDrawPaint = new Paint();
            mDrawPaint.setColor(Color.RED);
            mDrawPaint.setStyle(Paint.Style.STROKE);
            mDrawPaint.setStrokeWidth(5);
            mInitialRect = new Rect(10, 10, 100, 100);
        }
    
        @Override
        public boolean onTouchEvent(@NonNull MotionEvent ev) {
            // Let the ScaleGestureDetector inspect all events.
            mScaleDetector.onTouchEvent(ev);
    
            final int action = ev.getAction();
            switch (action & MotionEvent.ACTION_MASK) {
                case MotionEvent.ACTION_DOWN: {
                    final float x = ev.getX();
                    final float y = ev.getY();
    
                    mLastTouchX = x;
                    mLastTouchY = y;
                    mActivePointerId = ev.getPointerId(0);
                    break;
                }
    
                case MotionEvent.ACTION_MOVE: {
                    final int pointerIndex = ev.findPointerIndex(mActivePointerId);
                    final float x = ev.getX(pointerIndex);
                    final float y = ev.getY(pointerIndex);
    
                    // Only move if the ScaleGestureDetector isn't processing a gesture.
                    if (!mScaleDetector.isInProgress()) {
                        final float dx = x - mLastTouchX;
                        final float dy = y - mLastTouchY;
    
                        mPosX += dx;
                        mPosY += dy;
    
                        invalidate();
                    }
    
                    mLastTouchX = x;
                    mLastTouchY = y;
    
                    break;
                }
    
                case MotionEvent.ACTION_UP: {
                    mActivePointerId = INVALID_POINTER_ID;
                    break;
                }
    
                case MotionEvent.ACTION_CANCEL: {
                    mActivePointerId = INVALID_POINTER_ID;
                    break;
                }
    
                case MotionEvent.ACTION_POINTER_UP: {
                    final int pointerIndex = (ev.getAction() & MotionEvent.ACTION_POINTER_INDEX_MASK)
                            >> MotionEvent.ACTION_POINTER_INDEX_SHIFT;
                    final int pointerId = ev.getPointerId(pointerIndex);
                    if (pointerId == mActivePointerId) {
                        // This was our active pointer going up. Choose a new
                        // active pointer and adjust accordingly.
                        final int newPointerIndex = pointerIndex == 0 ? 1 : 0;
                        mLastTouchX = ev.getX(newPointerIndex);
                        mLastTouchY = ev.getY(newPointerIndex);
                        mActivePointerId = ev.getPointerId(newPointerIndex);
                    }
                    break;
                }
            }
    
            return true;
        }
    
        @Override
        public void onDraw(@NonNull Canvas canvas) {
            super.onDraw(canvas);
    
            canvas.save();
            canvas.translate(mPosX, mPosY);
            canvas.scale(mScaleFactor, mScaleFactor);
            canvas.drawRect(mInitialRect, mDrawPaint);
            canvas.restore();
        }
    
        private class ScaleListener extends ScaleGestureDetector.SimpleOnScaleGestureListener {
            @Override
            public boolean onScale(ScaleGestureDetector detector) {
                mScaleFactor *= detector.getScaleFactor();
    
                // Don't let the object get too small or too large.
                mScaleFactor = Math.max(0.1f, Math.min(mScaleFactor, 10.0f));
    
                invalidate();
                return true;
            }
        }
    }
    

    【讨论】:

    • 感谢您的帮助。我已经制作了矩形,但是当我尝试添加这些矩形时,我想要三个可聚焦的矩形,一个是可聚焦的,而另外两个不起作用。帮助,如何添加两个可调整大小的矩形。
    • @Corrupt 您可以存储矩形数组并在 onTouchEvent 内部检测哪个位于 MotionEvent。并在 onDraw 方法中绘制每个带有缩放的矩形。
    猜你喜欢
    • 2012-07-05
    • 1970-01-01
    • 2022-01-21
    • 1970-01-01
    • 2013-03-16
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-04-18
    相关资源
    最近更新 更多