title: Display the selected portion of the image
body: <p>I am implementing scroll and crop functionality.
  Have attached a screenshot for reference.</p>
  
  <p>What I am trying to achieve is:</p>
  
  <ol>
  <li><p>When a user drags her finger on the bigger image, I need to zoom the selected area.</p></li>
  <li><p>I need to place a rectangular box indicating the area that is selected.</p></li>
  <li><p>User should be able to change the size of this box by entering different values in an editText.</p></li>
  <li><p>On confirmation I want to crop and send the selected area to my server.</p></li>
  </ol>
  
  <p>****Problem that I am facing:****</p>
  
  <ol>
  <li><p>I am not able to place this rectangular box on the selected area.</p></li>
  <li><p>I need help understanding how can I change size of this rectangular box when values in an EditText changes.</p></li>
  <li><p>When I drag on the bigger image, I am able to zoom only for the one third of th image on the left. The other two third does not zoom out.</p></li>
  </ol>
  
  <p><a href="https://i.stack.imgur.com/LU9Gg.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/LU9Gg.png" alt=""></a></p>
  
  <p>This is my OnTouchListener in Activity</p>
  
  <pre><code>  mural.setOnTouchListener(new View.OnTouchListener() {
          @Override
          public boolean onTouch(View view, MotionEvent event) {
  
              int topParam = mural.getPaddingTop();
              int rightParam = mural.getPaddingRight();
              int maxTopParam = topParam + mural.getMaxHeight();
              int maxRightParam = rightParam + mural.getMaxWidth();
  
              int x = 0, y = 0;
  
              Matrix m = new Matrix();
              if (event.getX() &gt; topParam &amp;&amp; event.getX() &lt; maxTopParam) {
                  x = (int) event.getX();
  
              }
  
              if (event.getY() &gt; maxRightParam &amp;&amp; event.getY() &lt; rightParam) {
                  y = (int) event.getY();
  
              }
              mBitmap = ((BitmapDrawable) mural.getDrawable()).getBitmap();
              Bitmap croppedBitmap = Bitmap.createBitmap(mBitmap, x, y, 80, 80, m, true);
              croped.setImageBitmap(croppedBitmap);
  
              return true;
          }
      });
  </code></pre>
  
  <p>This is my XML file</p>
  
  <pre><code>&lt;LinearLayout
      xmlns:android="http://schemas.android.com/apk/res/android"
      xmlns:app="http://schemas.android.com/apk/res-auto"
      xmlns:tools="http://schemas.android.com/tools"
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      android:orientation="vertical"
      tools:context="com.outlineindia.zooming_drag_touch_crop_portion_image_examaple.MainActivity"&gt;
  
      &lt;ImageView
          android:layout_gravity="left"
          android:layout_marginBottom="20dp"
          android:visibility="visible"
          android:id="@+id/cropedmg"
          android:layout_marginTop="20dp"
          android:layout_width="match_parent"
          android:layout_height="wrap_content" /&gt;
  
      &lt;ImageView
  
          android:visibility="visible"
          android:id="@+id/mural"
          android:src="@drawable/muraltheme"
          android:layout_width="match_parent"
          android:layout_height="wrap_content" /&gt;
  
  &lt;/LinearLayout&gt;
  </code></pre>