【问题标题】:How to find if ACTION_MOVE touch event is on a circular path: Android如何查找 ACTION_MOVE 触摸事件是否在循环路径上:Android
【发布时间】:2016-01-20 19:35:52
【问题描述】:

我正在通过触摸事件围绕圆圈移动图像。 我希望用户触摸图像,当用户在圆圈周围拖动此图像时,它会移动,否则不会移动。

有人可以帮忙计算一下如何检查手指是否沿着圆圈移动,然后他们相应地移动图像。

谢谢。

更新:

我正在尝试围绕一个圆圈旋转图像。它已经放置在圆的边缘。

但在触摸和移动动作时,它以自身为中心,然后开始围绕定义的半径移动。

有人可以看看代码,让我知道我哪里出错了。

谢谢。

@Override
        public boolean onTouch(View v, MotionEvent event) {

            switch (event.getAction()) {

                case MotionEvent.ACTION_DOWN:


                        mInitialX = event.getX();
                        mInitialY = event.getY();

                    break;

                case MotionEvent.ACTION_MOVE:

                    mEndX = event.getX();
                    mEndY = event.getY();

                    float deltaX = mEndX - mInitialX;
                    float deltaY = mEndY - mInitialY;
                    double angleInDegrees = Math.atan(deltaY / deltaX) * 180 / Math.PI;

                    mInitialX = mEndX;
                    mInitialY = mEndY;

                    mCurrTempIndicator.setRotation((float)angleInDegrees);
                    mCurrTempIndicator.setTranslationX((float)(310*(Math.cos(angleInDegrees))));
                    mCurrTempIndicator.setTranslationY((float)(310*(Math.sin(angleInDegrees))));




                    break;

                case MotionEvent.ACTION_UP:
                    allowRotating = true;
                    break;
            }



            return true;
        }

【问题讨论】:

  • 计算圆心与触摸事件发生点之间的距离。如果它在 r-delta, r+delta 范围内,那么你在圆形路径上
  • 可以的。但是我如何在计算坐标中找到圆心
  • 你不知道你在哪里画圈子?
  • 我正在为圆圈加载图像。 (抱歉造成混淆)但不确定坐标中的确切位置。有没有办法通过 onCreate() 中加载的 imageview 找到它?
  • 那你为什么使用imageview而不是直接绘制位图?

标签: android math touch


【解决方案1】:
float dx = event.getX() - circleCenterX
float dy = event.getY() - circleCenterY;

// r is now the radius of the touch event, you can compare it with the radius of your circle to find out if it's close enough
float r = FloatMath.sqrt((dx * dx) + (dy * dy));

if(r > circleRadius - 10 && r < circleRadius + 10){
    // a is now the angle between the center point and the touch point in radians. With 0 being 3 o'clock, -/+PI being 9 o'clock -PI/2 at 12 o'clock and +PI/2 at 6 o'clock.
    float a = Math.atan2(dy, dx);
}

【讨论】:

  • 非常感谢。一个问题,我有一个图像作为圆圈,但不确定屏幕上圆圈的中心。在onCreate()中加载图像时是否可以找到图像的中心
  • 在图像编辑器中手动测量并将这些值保存在某处是最简单的。
【解决方案2】:

添加到上述答案。我进行了一些更改以使其正常工作。在这个我正在制作一个 ImageView 围绕一个固定的中心点旋转,这意味着 ImageView 将沿着圆的圆周移动。

double centerX, centerY; //Center coordinates of the circle
int radius; //Set the radius in pixels

//The view which will revolve on the circumference of the circle
imageView = new ImageView(this);
imageView.setBackgroundResource(android.R.drawable.ic_menu_add); //Set your view icon
imageView.setPadding(10, 10, 10, 10);
relativeLayout.addView(imageView);

//Setting the imageView on the circumference of the circle
imageView.setTranslationX(centerX + radius);
imageView.setTranslationY(centerY);

//Add imageview to the parent layout dynamically(choice)
relativeLayout.addView(imageView);


imageView.setOnTouchListener(new View.OnTouchListener() {
    @Override
    public boolean onTouch(View view, MotionEvent motionEvent) {

        switch (motionEvent.getAction()) {

            case MotionEvent.ACTION_MOVE:
            double dx = motionEvent.getRawX() - centerX;
            double dy = motionEvent.getRawY() - centerY; //Also subtract toolbar height and status bar height if applicable

            //Distance between user's point of touch and circle center
            double distance = Math.sqrt((dx * dx) + (dy * dy));

            if (distance > radius - 200 && distance < radius + 200) {
                double angle = Math.atan2(dy, dx);

                //Getting the point on the circumference of the circle using the angle and the radius
                double x = centerX + radius * Math.cos(angle);
                double y = centerY + radius * Math.sin(angle);

                //Finally move the view along the circimference of the circle as the user drags the view
                imageView.animate().y((float) y).x((float) x).setDuration(0).start();
            }
            break;
        }
        return true;
    }
});

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2015-07-01
    • 1970-01-01
    • 1970-01-01
    • 2019-05-09
    • 1970-01-01
    • 2012-03-12
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多