How to set dimensions of a DraweeView to "wrap_content" in the Fresco library

Question

I'm using the Fresco library in my app to load images. The problem is that I can't set my images height to "wrap_content" because "wrap_content" is not supported in the Fresco library. So how can I make my images to look good using a DraweeView? I looked here but I couldn't find a solution to this problem : frescolib/wrap_content

For example:

<com.facebook.drawee.view.SimpleDraweeView
         android:id="@+id/intro_image1"
         android:layout_width="match_parent"
         android:layout_height= // Can't use "wrap_content"
         fresco:placeholderImage="@drawable/placeholder_image" />

BTW the images dimensions are 730*760

score 4 · Accepted Answer · answered Jul 25 '16 at 23:29

Since you already know the exact dimensions of the image, you can simply calculate the aspect ratio of your image and then just set the aspect ratio in XML or Java. This works out-of-the-box and you don't need any custom views or DP / pixel calculations as suggested in other answers.

For your example, this would be w/h = 730/760 = 0.96052631578

Now you can just set it: In XML:

<com.facebook.drawee.view.SimpleDraweeView
    android:id="@+id/my_image_view"
    android:layout_width="match_parent" <!-- or the desired width -->
    android:layout_height="wrap_content"
    fresco:viewAspectRatio="0.96052631578" <!-- your aspect ratio -->
    <!-- other attributes -->

Or in Java:

mSimpleDraweeView.setAspectRatio(0.96052631578f); // or whatever your aspect ratio is

See also http://frescolib.org/docs/using-drawees-xml.html at the very bottom.

score 2 · Answer 2 · answered Jul 20 '16 at 13:23

2

For dp to px and px to dp on all devices, use the following formula:

Convert dp to pixel:

public int dpToPx(int dp) {
DisplayMetrics displayMetrics = getContext().getResources().getDisplayMetrics();
int px = Math.round(dp * (displayMetrics.xdpi / DisplayMetrics.DENSITY_DEFAULT));       
return px;
}

Convert pixel to dp:

public int pxToDp(int px) {
DisplayMetrics displayMetrics = getContext().getResources().getDisplayMetrics();
int dp = Math.round(px / (displayMetrics.xdpi / DisplayMetrics.DENSITY_DEFAULT));
return dp;
}

SimpleDraweeView does not directly allow wrap_content as dimension. The work around is to extend the class as the answer above clearly indicates.

Use the formula to correctly find your needed metric and set the Layout parameters for your draweeview programmatically.

answered Jul 20 '16 at 13:23

Kushan

5,855
3
31
45

Thank you looks very good but what should I put in the `android:layout_height` in the xml file? I can't leave it empty – Itiel Maimon Jul 20 '16 at 13:40
And how can I set the height of the draweeview programmatically? – Itiel Maimon Jul 20 '16 at 13:44
I'm not sure about setting the size of DraweeView, instead what you can do is, put it inside another view say a LinearLayout and use its Params to set its height and width to the found ones. Keep the Drawee to match_parent and it will match your set parent bounds that should work out well. – Kushan Jul 20 '16 at 17:02
see : http://stackoverflow.com/questions/6798867/android-how-to-programmatically-set-the-size-of-a-layout to set bounds of a linear layout. set it like this and keep inner drawee to match parent :) – Kushan Jul 20 '16 at 17:03
Glad to help :) well since you accepted another answer, this at least deserves an uptick ;) – Kushan Jul 20 '16 at 18:55
Of course!!! I accepted the other answer because I think that it's the best way to solve this problem for other developers that don't know the dimensions of the images. – Itiel Maimon Jul 20 '16 at 19:31

How to set dimensions of a DraweeView to "wrap_content" in the Fresco library

2 Answers2