title: Android Stretch ImageView to fill width, maintain aspect ratio, align top
body: <p>I'm trying to expand an <code>ImageView</code> that sits inside a <code>RelativeLayout</code>. I want the width to fill the parent while still maintaining the aspect ratio of the image. This sounds an awful lot like I could just use centerCrop in the XML layout file. The difference is that I do not want the image center-aligned. What I want is the image to be aligned to the top of the parent, with any excess on the bottom of the image to be cropped.</p>
  
  <p>Here is the XML:</p>
  
  <pre><code>&lt;RelativeLayout
          android:background="#f00"
          android:id="@+id/skyline_header"
          android:layout_width="match_parent"
          android:layout_height="0dp"
          android:layout_weight="25"&gt;
  
          &lt;ImageView
              android:id="@+id/bg_image"
              android:layout_width="match_parent"
              android:layout_height="match_parent"
              android:src="@drawable/bg_img"/&gt;
  &lt;/RelativeLayout&gt;
  </code></pre>
  
  <p>And here is my code:</p>
  
  <pre><code>final RelativeLayout headerContainer = (RelativeLayout) view.findViewById(R.id.skyline_header);
  final ImageView iv = (ImageView) view.findViewById(R.id.bg_image);
  
  ViewTreeObserver vto = headerContainer.getViewTreeObserver();
  
  vto.addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
  
      @Override
      public void onGlobalLayout() {
  
          headerContainer.getViewTreeObserver().removeOnGlobalLayoutListener(this);
  
          double imgAspectRatio = (double)iv.getMeasuredWidth() / (double)iv.getMeasuredHeight();
  
          int screenWidth = getActivity().getResources().getDisplayMetrics().widthPixels;
  
          Log.d("tag", Integer.toString(iv.getMeasuredWidth()));
          Log.d("tag", Integer.toString(iv.getMeasuredHeight()));
          Log.d("tag", Double.toString(imgAspectRatio));
          Log.d("tag", Integer.toString(screenWidth));
  
          int newHeight = (int) ((double)screenWidth * imgAspectRatio);
  
          img.setLayoutParams(new RelativeLayout.Layout(screenWidth, newHeight));
          img.requestLayout();
      }
  });
  </code></pre>
  
  <p>This code results in exactly what you would see if you just set <code>scaleType="fitCenter"</code>. It fills the height of the container, centers the image, and leaves margins on the left and right. </p>
  
  <p>The output is strange. It shows that the image view has the same width as the screen:</p>
  
  <blockquote>
    <p>1440<br>562<br>
    2.5622775800711746<br>1440<br></p>
  </blockquote>
  
  <p>Hopefully this will communicate conceptually what I have right now:</p>
  
  <p><a href="https://i.stack.imgur.com/HMdgn.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/HMdgn.png" alt="enter image description here"></a></p>
  
  <p>I want the picture to stretch to fill the entire horizontal space (no visible red remaining) without making the swimmer look really freakishly wide (i.e. keep the aspect ratio intact). The water underneath the swimmer can be cropped as needed to maintain the first two requirements.</p>