title: Android Fresco: drawing different kind of image shapes
body: <p>Fresco has built-in support for circular images and rounded corner, but what about other shapes such as diamond or parallelogram, etc?</p>
  
  <p>It's simple to do with the standard ImageView via custom drawable that uses BitmapShader. For example, the following custom Drawable receives the image Bitmap and a slope height to make a an ImageView look like this picture:</p>
  
  <p><a href="https://i.stack.imgur.com/59zzh.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/59zzh.png" alt="enter image description here"></a></p>
  
  <pre><code>public class MaskDrawable extends Drawable {
      private Paint mPaint;
      private Path mPath;
      private int mSlopeHeight;
  
      public MaskDrawable(Bitmap bitmap, int slopeHeight) {
          BitmapShader shader = new BitmapShader(bitmap, Shader.TileMode.CLAMP, Shader.TileMode.CLAMP);
          mPaint = new Paint();
          mPaint.setAntiAlias(true);
          mPaint.setShader(shader);
          mSlopeHeight = slopeHeight;
  
          mPath = new Path();
      }
  
      @Override
      public void draw(Canvas canvas) {
          Rect bounds = getBounds();
  
          mPath.moveTo(0, 0);
          mPath.lineTo(0, bounds.bottom);
          mPath.lineTo(bounds.right, bounds.bottom - mSlopeHeight);
          mPath.lineTo(bounds.right, 0);
          canvas.drawPath(mPath, mPaint);
      }
  </code></pre>
  
  <p>To do that with Fresco, I need the Bitmap of the image, but I'm not sure how to do that. I read that I can get the Bitmap directly from the ImagePipeline, but that are many gotchas that comes with it. In one case, the returned Bitmap is short lived and shouldn't be used to draw on the screen where in the other case I get a CloseableReference which I need to release at some point which isn't clear to me. What I have seen on the net so far is code similar to this for getting the Bitmap:</p>
  
  <pre><code>ImagePipeline imagePipeline = Fresco.getImagePipeline();
  
          ImageRequest imageRequest = ImageRequestBuilder
                  .newBuilderWithSource(uri)
                  .setRequestPriority(Priority.HIGH)
                  .setLowestPermittedRequestLevel(ImageRequest.RequestLevel.FULL_FETCH)
                  .build();
  
          DataSource&lt;CloseableReference&lt;CloseableBitmap&gt;&gt; dataSource = imagePipeline.fetchDecodedImage(imageRequest, getContext());
  
          DataSubscriber&lt;CloseableReference&lt;CloseableBitmap&gt;&gt; dataSubscriber =
                  new BaseDataSubscriber&lt;CloseableReference&lt;CloseableBitmap&gt;&gt;() {
                      @Override
                      protected void onNewResultImpl(DataSource&lt;CloseableReference&lt;CloseableBitmap&gt;&gt; dataSource) {
                          mBitmapRef = dataSource.getResult();
                          // Get the bitmap here and use it in my custom drawable?
                      }
  
                      @Override
                      protected void onFailureImpl(DataSource&lt;CloseableReference&lt;CloseableBitmap&gt;&gt; dataSource) {
                      }
                  };
  
          dataSource.subscribe(dataSubscriber, UiThreadImmediateExecutorService.getInstance());
  </code></pre>
  
  <p>I haven't tried that yet and was wondering if somebody can provide a working solution instead of the bits and bytes I've gathered so far from different places. It has to be done right or else I can easily leak memory, which beats the whole idea of using Fresco from the first place.</p>