Litho image from remote URL

Question

I am trying to load an image from remote URL into Litho Image widget but Litho widget has "drawable" as the only prop to set image. Have any one tried to set image from remote URL inside Litho Image widget?

score 2 · Answer 1 · answered Nov 23 '17 at 05:25

2

You can use a FrescoComponent that will use the Fresco image loading library to download and render the image. In alternative you can use the integration with Glide: https://github.com/pavlospt/litho-glide/tree/master/litho-glide

answered Nov 23 '17 at 05:25

Pasquale Anatriello

2,355
1
16
16

score 0 · Answer 2 · answered Nov 22 '19 at 06:16

Litho-Fresco does not have support for remote image. You have to add implementation 'com.facebook.fresco:fresco:1.13.0' alongwith implementation 'com.facebook.litho:litho-fresco:0.31.0' in your gradle. And then you can load remote images by following way :

@LayoutSpec
object MovieComponentSpec {

fun getImageController(imageUrl : String) = Fresco.newDraweeControllerBuilder()
    .setUri(imageUrl)
    .build()


@JvmStatic
@OnCreateLayout
internal fun onCreateLayout(
    c: ComponentContext,
    @Prop title: String,
    @Prop imageUrl: String
): Component {

    return Column.create(c)
        .paddingDip(ALL, 16f)
        .backgroundColor(Color.WHITE)
        .child(
            FrescoImage.create(c).controller(getImageController(imageUrl))
        )
        .child(
            Text.create(c)
                .text(title)
                .textSizeSp(10f)
        )
        .build()
    }

}

score -2 · Accepted Answer · answered Oct 25 '17 at 18:02

If you really want to use Litho, you can download the image, and convert it to a Drawable object.

public static Drawable drawableFromUrl(String url) throws IOException {
    Bitmap b = null;

    HttpURLConnection connection = (HttpURLConnection) new URL(url).openConnection();
    connection.connect();
    InputStream input = connection.getInputStream();

    b = BitmapFactory.decodeStream(input);

    return new BitmapDrawable(b);
}

Note that you need to call this method in a seperate Thread or AsyncTask since this is a network operation.

Thanks Giovanni. I was looking if there is any other way to achieve this instead of creating a Drawable object for every URL — Saravanan Kathiresan, Oct 28 '17 at 10:36

Litho image from remote URL

3 Answers3