title: Aspect Fit and Aspect Fill content mode with OpenGL ES 2.0
body: <p>I need to add two new content modes to display my textures with OpenGL ES 2.0 : &quot;Aspect Fit&quot; and &quot;Aspect Fill'.</p>
  <p>Here's an image explaining the different content modes :</p>
  <p><a href="https://i.stack.imgur.com/oNFSF.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/oNFSF.png" alt="" /></a></p>
  <p>I already have the &quot;Scale to fill&quot; content mode, which is the default behavior I guess.</p>
  <p>Here's my basic vertex shader code for textures :</p>
  <pre><code>precision highp float;
  
  attribute vec2 aTexCoordinate;
  varying vec2 vTexCoordinate;
  uniform mat4 uMVPMatrix;
  attribute vec4 vPosition;
  
  void main() {
      vTexCoordinate = aTexCoordinate;
      gl_Position = uMVPMatrix * vPosition;
  }
  </code></pre>
  <p>And here's my fragment shader for textures :</p>
  <pre><code>precision mediump float;
  
  uniform vec4 vColor;
  uniform sampler2D uTexture;
  varying vec2 vTexCoordinate;
  
  void main() {
      // premultiplied alpha
      vec4 texColor = texture2D(uTexture, vTexCoordinate);
      // Scale the texture RGB by the vertex color
      texColor.rgb *= vColor.rgb;
      // Scale the texture RGBA by the vertex alpha to reinstate premultiplication
      gl_FragColor = texColor * vColor.a;
      //gl_FragColor = vec4(1.0, 1.0, 1.0, 1.0);
  }
  </code></pre>
  <p>For the &quot;Aspect Fill&quot; mode, I thought I could play with the texture coordinates to crop the image. But for the &quot;Aspect Fit&quot; mode, I don't have a clear idea on how I could do it in the shaders, and even better with a red background color like in the screenshot.</p>