Images loaded from firestore with Picasso not showing in cardview

Question

I am loading images into CardView with Picasso from Firebase but the images are not showing

I am following this guide: How to display data from Firestore in a RecyclerView with Android?. However images are still not visible.

cardview layout

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_marginVertical="8dp"
    app:cardCornerRadius="6dp">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <ImageView
            android:id="@+id/imageCardView"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:scaleType="fitCenter"
            android:contentDescription="@string/user_image" />

        <TextView
            android:id="@+id/textView"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_margin="4dp"
            android:textAlignment="center"
            android:textColor="#fff"
            android:textSize="20sp" />

    </LinearLayout>

</android.support.v7.widget.CardView>

the adapter I am using

adapter = new FirestoreRecyclerAdapter<Post, PostViewHolder>(options) {
            @Override
            protected void onBindViewHolder(@NonNull PostViewHolder postViewHolder, int position, @NonNull Post post) {
                postViewHolder.setPostImage(post.getImageUrl_1());
            }

            @NonNull
            @Override
            public PostViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
                View view = LayoutInflater.from(parent.getContext())
                        .inflate(R.layout.card_view_layout, parent, false);
                return new PostViewHolder(view);
            }
        };
        recyclerView.setAdapter(adapter);

The code to load images.

void setPostImage(final String imageURL) {
    ImageView imageView = view.findViewById(R.id.imageCardView);
    //imageView.setImageBitmap(getBitmapFromURL(imageURL));
    Picasso.with(view.getContext())
           .load(imageURL)
           .into(imageView);
    imageView.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {
            Toast.makeText(view.getContext(), imageURL, Toast.LENGTH_SHORT).show();
        }
    });
}

I would expect that the images from my Firebase Storage would load into my cardViews, but they are not visible. However I know that they are loading into the image views because the correct number of cardviews are loading based on the number of pictures in storage and when clicking on the imageview the correct urls are shown in the toast. If there is anything else I should add please let me know. Any help would be greatly appreciated.

Edit:

I added the .placeholder() to Picasso and it is now showing the placeholder however when I click the image the toast still displays the url to storage.

Did you try using Glide instead of Picasso? Can you add code for R.layout.card_view_layout? — Vedprakash Wagh, Jun 05 '19 at 20:15
Can you add code for PostViewHolder? where and how are you calling setPostImage()? — Vedprakash Wagh, Jun 05 '19 at 20:20
setPostImage() is called within PostViewHolder and that is all that is there aside from a constructor and variables — David, Jun 05 '19 at 20:23

score 1 · Accepted Answer · answered Jun 06 '19 at 17:18

1

I found the issue I was having. Turns our the link that I was sending to Picasso was not the one I was looking for. The following question best describes my issue: How to get URL from Firebase Storage getDownloadURL. However, Thanks to Dor for providing help using Picasso properly.

answered Jun 06 '19 at 17:18

David

769
1
6
28

Thanks a lot, Had the same issue. (I've followed your link and it worked) Also I've deleted `recyclerview.hasfixedsize(true))`. – Mxwan Jul 24 '19 at 10:33

score 0 · Answer 2 · edited Jun 05 '19 at 20:57

0

It's seems like picasso changed the function with to get link so maybe try something like this

Picasso.get()
    .load(imageURL)
    .placeholder(some place holder image)
    .fit()
    .into(imageView);

edited Jun 05 '19 at 20:57

JeremyW

5,157
6
29
30

answered Jun 05 '19 at 20:15

Dor

657
1
5
11

Thank you for your answer however I get the error "cannot resolve method 'get()'" – David Jun 05 '19 at 20:20
what version of picasso are u using? latest is picasso:2.71828 can be seen here: https://github.com/square/picasso – Dor Jun 05 '19 at 20:22
I am using 2.71828 get() now works but I am getting the same error. – David Jun 05 '19 at 20:30
What error you get? In the past i used it inside getView and it worked for me – Dor Jun 05 '19 at 20:35
My mistake, I am not getting an error, however I am still not seeing my images. What do you mean by getView? – David Jun 05 '19 at 20:38
1. try add a place holder and tell me if u see it - .placeholder(some place holder image) 2. try move the picasso function to onBindViewHolder – Dor Jun 05 '19 at 20:40
Yes I edited my question above. The adapter that I am using is from the FirebaseUI Library: https://github.com/firebase/FirebaseUI-Android/blob/master/firestore/src/main/java/com/firebase/ui/firestore/FirestoreRecyclerAdapter.java – David Jun 05 '19 at 20:43
in my experience the images might not shown right away... try waiting a few secs and see if the place holder changes – Dor Jun 05 '19 at 20:46
I let it sit for several minutes, still did not change – David Jun 05 '19 at 20:51
did u remember to add permission to manifest? can you give me the link to the image u r trying to display? i want to reproduce the issue. – Dor Jun 06 '19 at 06:35

score 0 · Answer 3 · answered Jun 05 '19 at 21:08

0

Since Android P, network security config is needed in order to handle all http requests, maybe is something related to that. You can check this solutions

answered Jun 05 '19 at 21:08

joseph.dev89

21
4

Thank you for comment but this did not fix it. – David Jun 05 '19 at 21:18

Images loaded from firestore with Picasso not showing in cardview

3 Answers3