Restrict image inside FrameLayout so it can't be dragged outside of it in Android

Question

I'm using FrameLayout having shadow inside layout. On Top of FrameLayout, I've added ImageView which is draggable around the screen & Resizable.

I've given FrameLayout : android:layout_width & android:layout_heightto fill_parent to consume the area of screen. It was necessary to fulfil the app requirement.

Question

How can I restrict Image not to be draggable outside theFrameLayout?

Pic 1 and Pic 2:

Pic 3:

@kabuko : I'm using `Matrix` on `ImageView`and adding `onTouchListener` to it. But My OP is Very different from your comment — Vikalp Patel, Feb 22 '13 at 19:30
It's actually very relevant. If you could include your code for that it'd be easier to help you, but basically the approach would be to not *always* drag, but only do so within certain bounds. You'd check in `onTouch` whether `event.getX()` and `event.getY()` are within an acceptable range (i.e. the bounds of your FrameLayout, maybe +/- the half the width/height of your image). — kabuko, Feb 22 '13 at 19:34
@kabuko : thanks for pointing in to very direction which i need to be. But how can i bound `event.get()` up to `FrameLayout` region?? — Vikalp Patel, Feb 22 '13 at 19:44
@kabuko: getting size of `FrameLayout` and restricting seems difficult as retrieving size of `ImageView` is as same as `FrameLayout`. Is there any way to go through it?? — Vikalp Patel, Feb 23 '13 at 15:22

score 0 · Accepted Answer · answered Apr 09 '13 at 09:43

Adding limitation to draggable views with reference to its size and touch points had fix my problem.

So What i need to do is just get the touch points compare it with framelayout boundraies, depends upon the scenario sets the limitation to draggable view.

Code is something like these worked perferctly for me ::

public boolean onTouch(View paramView, MotionEvent event)
    {
      ImageView view = (ImageView)paramView;
      switch (event.getAction() & MotionEvent.ACTION_MASK)


case MotionEvent.ACTION_MOVE:

          if (mode == DRAG) {
/*
* Restricting Image not to be draggable outside of FrameLayout
*/
              matrix.set(savedMatrix); //Top
              if(event.getY()==0)
              {
                  matrix.postTranslate(event.getX()+15-start.x, 0+15);
                  Log.d("Top", "Top...");
              }
              else if(event.getX()==0) //Left
              {
                  matrix.postTranslate(0+15, event.getY()-start.y+15);
                  Log.d("LEFT", "Left...");
              }
              else if((event.getY()-ImageHeight)>fm.getHeight()) //Bottom
              {
                  matrix.postTranslate(event.getX()-start.x+15, fm.getHeight()-ImageHeight+15);
                  Log.d("BOTTOM", "Bottom...");
              }
              else if((event.getX()-ImageWidth)>fm.getWidth()) //Right
              {
                  matrix.postTranslate(fm.getWidth()-ImageWidth+15, event.getY()-start.y+15);
                  Log.d("RIGHT", "Right....");
              }
              else if(event.getY()==0 && (event.getX()-ImageWidth)>fm.getWidth()) //Top -Right
              {
                  matrix.postTranslate(fm.getWidth()-ImageWidth-15, 15);
              }
              else if(event.getY()==0 &&event.getX()==0) //Top-Left
              {
                  matrix.postTranslate(15, 15);
              }
              else if((event.getY()-ImageHeight)>fm.getHeight() && event.getX()==0) //Bottom-Left
              {
                  matrix.postTranslate(15, fm.getHeight()-ImageHeight-15);
              }
              else if((event.getX()-ImageWidth)>fm.getWidth() && (event.getY()-ImageHeight)>fm.getHeight())
              {
                  matrix.postTranslate(fm.getWidth()-ImageWidth-15, fm.getHeight()-ImageHeight-15);
              }
              else
              {
                  matrix.postTranslate(event.getX() - start.x, event.getY() - start.y);  
                  Log.d("ACTION_MOVE", "Starting Point::"+start.x+","+start.y+" Ending Point::"+event.getX()+","+event.getY());
                  Log.d("ACTION_DOWN", "FrameLayout::"+fm.getWidth()+" ,"+fm.getHeight()+" ImageView:: "+view.getWidth()+", "+view.getHeight());

              }
          }
          else if (mode == ZOOM) {

              float newDist = spacing(event);
              Log.d(TAG, "newDist=" + newDist);
              if (newDist > 10f) {

                  matrix.set(savedMatrix);
                  float scale = newDist / oldDist;
                  matrix.postScale(scale, scale, mid.x, mid.y);
              }
          }
          break;
           }  
      view.setImageMatrix(matrix);
      return true;       
    }

@Vikalp Patel also have a look at my question here. http://stackoverflow.com/questions/38999891/bound-a-view-to-drag-inside-relativelayout — Zar E Ahmer, Aug 18 '16 at 06:50

Restrict image inside FrameLayout so it can't be dragged outside of it in Android

Question

1 Answers1