Receiving imgs from firebase to RecyclewView

Question

my RecyclerView is not showing stored images onFirebase. For more user friendly management my data I use FirebaseUI and for loading my imgs I use GLIDE (GlideApp approach).

so:

MANIFEST:

    <uses-permission android:name="android.permission.GET_ACCOUNTS" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
<uses-permission android:name="android.permission.READ_PROFILE" />
<uses-permission android:name="android.permission.READ_CONTACTS" />
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.CAMERA" />

GRADLE:

    implementation  'com.google.firebase:firebase-core:16.0.1'
implementation  'com.google.firebase:firebase-database:16.0.1'
implementation  'com.google.firebase:firebase-crash:16.0.1'
implementation  'com.google.firebase:firebase-auth:16.0.1'
implementation  'com.google.firebase:firebase-messaging:17.0.0'
implementation  'com.google.firebase:firebase-storage:16.0.1'

implementation 'com.firebaseui:firebase-ui-database:4.0.1'
implementation 'com.firebaseui:firebase-ui-storage:4.0.1'

kapt 'com.github.bumptech.glide:compiler:4.7.1'
implementation 'com.github.bumptech.glide:glide:4.7.1'
implementation 'com.github.bumptech.glide:annotations:4.7.1'
annotationProcessor 'com.github.bumptech.glide:compiler:4.7.1'

my DATABASE:

my FOTOMODEL.CLASS:

public class PhotoModel {

@Exclude private String desc;
@Exclude private String image;
@Exclude private String  title;

public PhotoModel(String desc, String image, String title) {
    this.desc = desc;
    this.image = image;
    this.title = title;
}
//firebase
public PhotoModel (){

}

public String getDesc() {
    return desc;
}

public void setDesc(String desc) {
    this.desc = desc;
}

@Keep
public String getImage() {
    return image;
}
@Keep
public void setImage(String image) {
    this.image = image;
}


public String getTitle() {
    return title;
}

public void setTitle(String title) {
    this.title = title;
}

GLIDE-MODULE :

public void registerComponents(Context context, Glide glide, Registry registry) {
// Register FirebaseImageLoader to handle StorageReference
registry.append(StorageReference.class, InputStream.class,
        new FirebaseImageLoader.Factory());

}

and finally my code :

    private RecyclerView recyclerList;

DatabaseReference mDatabaseStorage ;
FirebaseStorage mFirebaseStorage;
FirebaseRecyclerAdapter  firebaseRecyclerAdapter;
Query query;


@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
    setContentView(R.layout.activity_photo);
    super.onCreate(savedInstanceState);

    mDatabaseStorage = FirebaseDatabase.getInstance().getReference().child("Blog");

    Toolbar toolbar = (Toolbar) findViewById(R.id.myToolbar);
    setSupportActionBar(toolbar);
    toolbar.setNavigationOnClickListener(view -> onBackPressed());

    getSupportActionBar().setDisplayHomeAsUpEnabled(true);

    query = FirebaseDatabase.getInstance().getReference("Blog");

    ChildEventListener childEventListener = new ChildEventListener() {
        @Override
        public void onChildAdded(DataSnapshot dataSnapshot, String previousChildName) {
            // ...
        }

        @Override
        public void onChildChanged(DataSnapshot dataSnapshot, String previousChildName) {
            // ...
        }

        @Override
        public void onChildRemoved(DataSnapshot dataSnapshot) {
            // ...
        }

        @Override
        public void onChildMoved(DataSnapshot dataSnapshot, String previousChildName) {
            // ...
        }

        @Override
        public void onCancelled(DatabaseError databaseError) {
            // ...
        }
    };
    query.addChildEventListener(childEventListener);

    recyclerList = (RecyclerView)findViewById(R.id.recycler_view);
    recyclerList.setHasFixedSize(true);
    recyclerList.setLayoutManager(new LinearLayoutManager(this));
}

@Override
protected void onStart() {
    super.onStart();

    FirebaseRecyclerOptions<PhotoModel> options = new FirebaseRecyclerOptions.Builder<PhotoModel>()
                    .setQuery(query, PhotoModel.class)
                    .build();

    mFirebaseStorage = FirebaseStorage.getInstance();

    firebaseRecyclerAdapter = new FirebaseRecyclerAdapter<PhotoModel, PhotoViewHolder>(options) {

        @Override
        public void onError(DatabaseError e) {
            Log.e("FirebaseRecyclerAdapter", e.toString());
        }
        @NonNull
        @Override
        public PhotoViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
            View view = LayoutInflater.from(parent.getContext())
                    .inflate(R.layout.recycler_single_photo_row, parent, false);
            return new PhotoViewHolder (view) ;
        }
        @Override
        protected void onBindViewHolder(@NonNull PhotoViewHolder holder, int position, @NonNull PhotoModel model) {

            Uri myUri = Uri.parse(model.getImage().toString());
            Log.i("ImageFromModel", model.getImage().toString());

           GlideApp.with(getApplicationContext())
                    .load(myUri)
                    .centerCrop()
                    .error(R.drawable.ic_error_black_24dp)
                    .listener(new RequestListener<Drawable>() {
                        @Override
                        public boolean onLoadFailed(@Nullable GlideException e, Object model, Target<Drawable> target, boolean isFirstResource) {
                            Log.e("TAG_FROM_GLIDE", "Error loading image", e);
                            return false;
                        }

                        @Override
                        public boolean onResourceReady(Drawable resource, Object model, Target<Drawable> target, DataSource dataSource, boolean isFirstResource) {
                            return false;
                        }
                    })
                    .fitCenter()
                    .into(holder.firebaseImages);

        }

    };

    recyclerList.setAdapter(firebaseRecyclerAdapter);
    firebaseRecyclerAdapter.startListening();
}



public static class PhotoViewHolder extends RecyclerView.ViewHolder {

    public  ImageView firebaseImages;


    View globalView;

    public PhotoViewHolder(View itemView) {
        super(itemView);

        this.firebaseImages = (ImageView) itemView.findViewById(R.id.imageFirebase);
        globalView = itemView;
    }

    public void setTitle (String title){
        TextView post_name = (TextView) globalView.findViewById(R.id.photo_name);
        post_name.setText(title);
    }
    public void setDesc (String desc){
        TextView post_desc = (TextView) globalView.findViewById(R.id.photo_desc);
        post_desc.setText(desc);
    }



}

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    getMenuInflater().inflate(R.menu.main_menu,menu);
    return true;
}

@Override
public boolean onOptionsItemSelected(MenuItem item) {

    if ( item.getItemId() == R.id.addPhotoActivity) {
        Intent intent = new Intent(PhotoActivity.this, AddNewPhotoActivity.class);
        startActivity(intent);
    }
    return true;
}

my logcat from Glide(listener):

06-25 11:09:20.853 3460-3460/com.example.htw.mytestapp E/TAG_FROM_GLIDE: Error loading image
class com.bumptech.glide.load.engine.GlideException: Failed to load resource
There were 3 causes:
java.io.FileNotFoundException(No such file or directory)
java.io.FileNotFoundException(No such file or directory)
java.io.FileNotFoundException(No such file or directory)
 call GlideException#logRootCauses(String) for more detail
  Cause (1 of 4): class com.bumptech.glide.load.engine.GlideException: Fetching data failed, class java.io.InputStream, LOCAL
There was 1 cause:
java.io.FileNotFoundException(No such file or directory)
 call GlideException#logRootCauses(String) for more detail
    Cause (1 of 1): class java.io.FileNotFoundException: No such file or directory
  Cause (2 of 4): class com.bumptech.glide.load.engine.GlideException: Fetching data failed, class android.os.ParcelFileDescriptor, LOCAL
There was 1 cause:
java.io.FileNotFoundException(No such file or directory)
 call GlideException#logRootCauses(String) for more detail
    Cause (1 of 1): class java.io.FileNotFoundException: No such file or directory
  Cause (3 of 4): class com.bumptech.glide.load.engine.GlideException: Fetching data failed, class android.content.res.AssetFileDescriptor, LOCAL
There was 1 cause:
java.io.FileNotFoundException(No such file or directory)
 call GlideException#logRootCauses(String) for more detail
    Cause (1 of 1): class java.io.FileNotFoundException: No such file or directory
  Cause (4 of 4): class com.bumptech.glide.load.engine.GlideException: Failed LoadPath{StringUri->Object->Drawable}, LOCAL
    Cause (1 of 2): class com.bumptech.glide.load.engine.GlideException: Failed DecodePath{StringUri->Drawable->Drawable}
    Cause (2 of 2): class com.bumptech.glide.load.engine.GlideException: Failed DecodePath{StringUri->Bitmap->Drawable}

LOG from Log.i("ImageFromModel", model.getImage().toString());

content://com.example.htw.mytestapp.provider/my_images/Android/data/com.example.htw.mytestapp/files/Pictures/JPEG_20180613_104007_-1022454302.jpg content://com.example.htw.mytestapp.provider/my_images/Android/data/com.example.htw.mytestapp/files/Pictures/JPEG_20180613_104052_-450216218.jpg content://com.example.htw.mytestapp.provider/my_images/Android/data/com.example.htw.mytestapp/files/Pictures/JPEG_20180613_104118_1956285222.jpg content://com.example.htw.mytestapp.provider/my_images/Android/data/com.example.htw.mytestapp/files/Pictures/JPEG_20180619_114556_5693763765908649752.jpg content://com.example.htw.mytestapp.provider/my_images/Android/data/com.example.htw.mytestapp/files/Pictures/JPEG_20180621_123728_-880882730.jpg

I try also :

StorageReference storage = mFirebaseStorage.getReference().child(model.getImage()); + GlideApp.with(getApplicationContext()) .load(storage)

but not work log:

06-25 11:42:49.454 17886-17886/com.example.htw.mytestapp E/TAG_FROM_GLIDE: Error loading image
class com.bumptech.glide.load.engine.GlideException: Failed to load resource
There was 1 cause:
com.google.firebase.storage.StorageException(Object does not exist at location.)
 call GlideException#logRootCauses(String) for more detail
  Cause (1 of 1): class com.bumptech.glide.load.engine.GlideException: Fetching data failed, class java.io.InputStream, REMOTE
There was 1 cause:
com.google.firebase.storage.StorageException(Object does not exist at location.)
 call GlideException#logRootCauses(String) for more detail
    Cause (1 of 1): class com.google.firebase.storage.StorageException: Object does not exist at location.

I have not used Glide before but have another method of getting image bitmap from the url if you would not mind i can post the code here — Samuel Moshie, Jun 25 '18 at 12:13

Gastón Saillén · Answer 1 · 2018-06-25T12:56:23.973

0

Your download url link inside your firebase database is not what you need, instead of content: example ... you will need just the pure link of your photo

you need this url

edited Jun 25 '18 at 12:56

answered Jun 25 '18 at 12:48

Gastón Saillén

12,319
5
67
77

I don't need the URL of a single file but of an entire storage folder to load into GlideApp method load. – htw Jun 25 '18 at 14:12
1

you should store each image url like you are doing and retrieve each of those urls, you cant load bunch of photos from inside a folder in your storage – Gastón Saillén Jun 25 '18 at 14:19
I sholud get content://com.example.htw.mytestapp.provider/my_images/Android/data/com.example.htw.mytestapp/files/Pictures/JPEG_20180613_104007_-1022454302.jpg and others to put them into some object ( List ?) and then put this list to GlideApp.load ? some example can you provide ? – htw Jun 25 '18 at 16:21
sorry but that is not how firebase works with glide, glide just opens an image from an URL or just a drawable from your app, if you want to load images from firebase you should get the download url of the photo, check this video i made, is in spanish but it will help you know how it works , part 1 https://www.youtube.com/watch?v=pNleQQhVfd0&t and part 2 https://www.youtube.com/watch?v=rYfNRh0HjeI – Gastón Saillén Jun 25 '18 at 16:24
I saw your video, but there was no ansewr, put single file is simple work, I was ask for something more complex – htw Jun 26 '18 at 16:14
Just create push keys with all your image urls and then retrieve one by one and put it inside each view – Gastón Saillén Jun 26 '18 at 16:17

score 0 · Answer 2 · answered Jun 25 '18 at 13:04

To load the Bitmap from the url

try {
                    String imageUrl = "your/url/image.jpg";
                    InputStream in = (InputStream) new URL(imageUrl).getContent();
                    Bitmap bitmap = BitmapFactory.decodeStream(in);
//Store your bitmap for reuse
                    container.bitmap = bitmap;
                    in.close();
                } catch (Exception e) {
                    e.printStackTrace();
                }

Then you can use ImageView.setImageBitmap(container.bitmap);

score 0 · Answer 3 · answered Jun 26 '18 at 16:28

SOLUTION !

global verible:

private String uploadImageUrl;

add im my addPhotoButton method:

newPostDatabase.child("url_link").setValue(uploadImageUrl);

add in:

filepatch.putFile(photoURI).addOnSuccessListener

add this:

          filepatch.getDownloadUrl().addOnSuccessListener(new OnSuccessListener<Uri>() {
                    @Override
                    public void onSuccess(Uri uri) {
                        Uri downloadUrl = uri;
                        uploadImageUrl = downloadUrl.toString();
                        Log.i("photoURI",uploadImageUrl ) ;
                    }
                });

Receiving imgs from firebase to RecyclewView

3 Answers3