【问题标题】:Movable image within a circle圆圈内的可移动图像
【发布时间】:2014-09-20 03:38:54
【问题描述】:

在这张图片中,圆圈是静态的。矩形图像在这个圆圈的后面。我需要在这个圆圈内移动、缩小、放大和平移矩形图像。如何做到这一点?

给我建议如何做到这一点。

提前致谢

【问题讨论】:

  • 给我建议而不是放下投票兄弟。我会改正我的错误

标签: android android-layout crop


【解决方案1】:

按照指南这样做:

  1. 采用相对布局
  2. 在此布局中添加 ImageView。
  3. 现在在其中添加圆形图像。

示例:

      <RelativeLayout>
         <ImageView /> // image which have to apply movement.
         <ImaeView />  // circle shape
      </RelativeLayout>

然后应用下面的代码来使用 Imageview 的移动。

用 OnTouchListener 实现 Activity,然后

         img.setonTouchListener(this);



         @Override
    public boolean onTouch(View v, MotionEvent event) {
        // TODO Auto-generated method stub
     view= (ImageView) v;


        // make the image scalable as a matrix
        view.setScaleType(ImageView.ScaleType.MATRIX);
        float scale;

        // Handle touch events here...
        switch (event.getAction() & MotionEvent.ACTION_MASK) {

        case MotionEvent.ACTION_DOWN: //first finger down only
           savedMatrix.set(matrix);
           start.set(event.getX(), event.getY());
           Log.d(TAG, "mode=DRAG" );
           mode = DRAG;
           break;
        case MotionEvent.ACTION_UP: //first finger lifted
        case MotionEvent.ACTION_POINTER_UP: //second finger lifted
           mode = NONE;
           Log.d(TAG, "mode=NONE" );
           break;
        case MotionEvent.ACTION_POINTER_DOWN: //second finger down
           oldDist = spacing(event); // calculates the distance between two points where user touched.
           Log.d(TAG, "oldDist=" + oldDist);
           // minimal distance between both the fingers
           if (oldDist > 5f) {
              savedMatrix.set(matrix);
              midPoint(mid, event); // sets the mid-point of the straight line between two points where user touched. 
              mode = ZOOM;
              Log.d(TAG, "mode=ZOOM" );
           }
           break;

        case MotionEvent.ACTION_MOVE: 
           if (mode == DRAG) 
           { //movement of first finger
              matrix.set(savedMatrix);
              if (view.getLeft() >= -392)
              {
                 matrix.postTranslate(event.getX() - start.x, event.getY() - start.y);
              }
           }
           else if (mode == ZOOM) { //pinch zooming
              float newDist = spacing(event);
              Log.d(TAG, "newDist=" + newDist);
              if (newDist > 5f) {
                 matrix.set(savedMatrix);
                 scale = newDist/oldDist; //thinking I need to play around with this value to limit it**
                 matrix.postScale(scale, scale, mid.x, mid.y);
              }
           }
           break;
        }

        // Perform the transformation
        view.setImageMatrix(matrix);

        return true; // indicate event was handled
     }

     private float spacing(MotionEvent event) {
        float x = event.getX(0) - event.getX(1);
        float y = event.getY(0) - event.getY(1);
        return FloatMath.sqrt(x * x + y * y);
     }

     private void midPoint(PointF point, MotionEvent event) {
        float x = event.getX(0) + event.getX(1);
        float y = event.getY(0) + event.getY(1);
        point.set(x / 2, y / 2);
     }

希望这对您有所帮助,这是一项简单的任务。

【讨论】:

  • 谢谢 balvinder !.. 这就是我需要的。
  • 但是如果我们使用当时唯一的环形图像,在圆形的imageview后面的imageview的角落,它也显示在圆圈之外,那我们该怎么办?
【解决方案2】:

看看

TouchImageView

您可以使用类缩放和平移图像视图

【讨论】:

  • 谢谢兄弟!我会试试的
【解决方案3】:

这个库正是这样做的ProfileView

它有一个可自定义的圆形视图,其中包含imageview,它是可扩展的、可移动的并且这些事件是自定义的。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2015-06-09
    • 1970-01-01
    • 1970-01-01
    • 2020-04-30
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2022-01-19
    相关资源
    最近更新 更多