在 RecyclerView 中显示 firebase 存储图像

Question

您好，我之前问过一个关于使用 Firebase 数据库中的 Base64 显示图像的问题。建议使用 firebase 存储。我重新编写了我的代码，所有内容都按原样加载到 firebase 存储和数据库中。我遇到的问题是，当我保存数据时，没有任何内容填充到我的 recyclerview 中。一切都是空白。

如果你能为我提供任何帮助来让它工作，那就太好了。谢谢

编辑：在我的 activity class 中，我正在调用一个按钮点击监听器来激活相机。拍照后，它会保存到 Firebase 存储中。然后我从 Storage 下载图像并将其显示在 recyclerview 中。我理解上传部分，但我很难理解下载和显示部分。谢谢

viewholder:绑定方法

public void bind (ImageProgress progress){

    Glide.with(activity).load("").into(image);
 }
}

适配器

  @Override
public ProgressViewHolder onCreateViewHolder(ViewGroup parent, int viewType){
    return new ProgressViewHolder(activity, activity.getLayoutInflater().inflate(R.layout.weight_progress_list, parent, false));

主要activityclass

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

    saveButton = (Button) findViewById(R.id.saveButton);
    progressStatusEditText = (EditText) findViewById(R.id.progressStatusEditText);
    progressList = (RecyclerView) findViewById(R.id.progressList);
    mImageButton = (ImageButton) findViewById(R.id.takePictureButton);
    capturedImage=(ImageView)findViewById(R.id.capturedImageView);

    LinearLayoutManager layoutManager = new LinearLayoutManager(this);
    progressList.setHasFixedSize(false);
    progressList.setLayoutManager(layoutManager);

    //take picture button
    mImageButton.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {
            openCamera();
        }
    });


    mDatabaseReference = database.getReference("Progress");

    saveButton.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {
            //get current user
            FirebaseUser user =FirebaseAuth.getInstance().getCurrentUser();
            String uid = user.getUid();
            ImageProgress progress = new ImageProgress(uid, progressStatusEditText.getText().toString());
            mDatabaseReference.push().setValue(progress);
            progressStatusEditText.setText("");
        }
    });
}

private void openCamera() {
    Intent intent = new Intent(MediaStore.ACTION_IMAGE_CAPTURE);
    startActivityForResult(intent, REQUEST_IMAGE_CAPTURE);
}

@Override
public void onActivityResult(int requestCode, int resultCode, Intent data) {
    if (requestCode == REQUEST_IMAGE_CAPTURE && resultCode == RESULT_OK) {

        Uri cameraImageURI = data.getData();
        //reference where images will be stored
        mStorageReference = storage.getReference("Progress Images");
        //reference to store file
        final StorageReference cameraImageRef = mStorageReference.child(cameraImageURI.getLastPathSegment());
        //upload to firebase storage
        cameraImageRef.putFile(cameraImageURI)
                .addOnSuccessListener(this, new OnSuccessListener<UploadTask.TaskSnapshot>() {
                    @Override
                    public void onSuccess(UploadTask.TaskSnapshot taskSnapshot) {
                        Uri downloadUrl = taskSnapshot.getDownloadUrl();
                        progressStatusEditText.setText(downloadUrl.toString());
                    }
                });
}

Answer 1

我建议您在 RecyclerView.ViewHolder 上添加 setImage 方法，并将图像的 url 存储在您在 FirebaseRecyclerAdapter 中检索的对象中。

就我而言，我使用 Glide 来管理我的应用程序的图像：

我的 ViewHolder 示例：

public class UserListViewHolder extends RecyclerView.ViewHolder {
private final View mView;
private static final int POST_TEXT_MAX_LINES = 6;
private ImageView mIconView;
private TextView mAuthorView;
private UserClickListener mListener;

public UserListViewHolder(View itemView) {
    super(itemView);
    mView = itemView;
    mIconView = (ImageView) mView.findViewById(R.id.user_image_profile);
    mAuthorView = (TextView) mView.findViewById(R.id.user_text_profile);
    mView.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            mListener.onUserClick();
        }
    });
}

public void setIcon(String url) {
    GlideUtil.loadProfileIcon(url, mIconView);//       
}

public void setPostClickListener(UserClickListener listener) {
    mListener = listener;
}


public void setText(final String text) {
    if (text == null || text.isEmpty()) {
        mAuthorView.setVisibility(View.GONE);
        return;
    } else {
        mAuthorView.setVisibility(View.VISIBLE);
        mAuthorView.setText(text);
        mAuthorView.setMaxLines(POST_TEXT_MAX_LINES);
    }
}

public interface UserClickListener {
    void onUserClick();
}
}

这是我的数据库调用：

 private FirebaseRecyclerAdapter<Person, UserListViewHolder> getFirebaseRecyclerAdapter(Query query) {
    return new FirebaseRecyclerAdapter<Person, UserListViewHolder>(
            Person.class, R.layout.user_row_item, UserListViewHolder.class, query) {

        @Override
        protected void populateViewHolder(UserListViewHolder viewHolder, Person model, int position) {
            setupUser(viewHolder, model, position, null);
        }

    };
}

private void setupUser(final UserListViewHolder UserViewHolder, final Person user, final int position, final String inPostKey) {
    final String postKey;
    if (mAdapter instanceof FirebaseRecyclerAdapter) {
        postKey = ((FirebaseRecyclerAdapter) mAdapter).getRef(position).getKey();
    } else {
        postKey = inPostKey;
    }
    FirebaseUtil.getUsersRef().child(postKey).addListenerForSingleValueEvent(new ValueEventListener() {
        @Override
        public void onDataChange(final DataSnapshot dataSnapshot) {
            UserViewHolder.setPostClickListener(new UserListViewHolder.UserClickListener() {
                @Override
                public void onUserClick() {
                    mGroup.addUserToGroup(dataSnapshot.getKey());
                }
            });
            UserViewHolder.setIcon(dataSnapshot.child("photoUrl").getValue(String.class));
            UserViewHolder.setText(dataSnapshot.child("displayName").getValue(String.class));

        }

        @Override
        public void onCancelled(DatabaseError databaseError) {

        }
    });
}

您只需按照从 Firebase 检索数据时设置其他值的方式设置图像，但在将图像上传到云端后使用您已经为该图像生成的新 URL。

也许您可以找到另一种方法来设置 url，但我建议您将其保留为自定义对象中的另一个参数，如果您想多次检索该数据，请保持动态，即使你没有上传图片。

Answer 2

已经有一个用于此目的的官方实现。

https://github.com/firebase/quickstart-android/tree/master/storage

基本思路是将图像上传到 firebase 存储并将图像 url 存储到数据库，然后通过此 link 下载它。

在 MyDownloadService.java class mStorageRef.child(downloadPath).getStream 方法中使用了但我使用 getBytes 方法实现不处理输入流。因为可以很容易地用 Glide 加载字节。任务完成后，它会发送一个以字节为包的广播意图。您可以随时随地收听广播接收器，以便在下载图像时加载图像。

public class DownloadService extends Service{

    private StorageReference mStorageRef;

    @Override
    public void onCreate() {
        super.onCreate();

        // Initialize Storage
        mStorageRef = FirebaseStorage.getInstance().getReference();

    }

    @Override
    public int onStartCommand(Intent intent, int flags, int startId) {
     if (ACTION_DOWNLOAD.equals(intent.getAction())) {


        mStorage.child(downloadPath).getBytes(10*1024*1024).addOnSuccessListener(new OnSuccessListener<byte[]>() {
            @Override
            public void onSuccess(byte[] bytes) {
                Log.d(TAG, "download:SUCCESS " + bytes.length);

                // Send success broadcast with number of bytes downloaded
                Intent broadcast = new Intent(ACTION_COMPLETED);
                broadcast.putExtra(EXTRA_DOWNLOAD_BYTES, bytes);
                broadcast.putExtra(EXTRA_DOWNLOAD_INDEX, uid);
                LocalBroadcastManager.getInstance(getApplicationContext())
                        .sendBroadcast(broadcast);

                // Mark task completed
                taskCompleted();
            }
        }).addOnFailureListener(new OnFailureListener() {
                @Override
                public void onFailure(@NonNull Exception exception) {
                    Log.w(TAG, "download:FAILURE", exception);

                    // Send failure broadcast
                    Intent broadcast = new Intent(ACTION_ERROR);
                    broadcast.putExtra(EXTRA_DOWNLOAD_PATH, downloadPath);
                    LocalBroadcastManager.getInstance(getApplicationContext())
                    .sendBroadcast(broadcast);

                    // Mark task completed
                    taskCompleted();
                }
            });
    }

    }

Answer 3

使用自定义列表适配器处理 listview 并使用 GLIDE 处理 imageView，它提供了简单的方法来加载带有存储的图像 link。

http://wptrafficanalyzer.in/blog/listview-with-images-and-text-using-simple-adapter-in-android/

Link 使用 imageview 和 textview 创建列表适配器

https://firebase.google.com/docs/storage/android/download-files

Link 将 firebase sorage 图像保存到外部存储器

你只需要将想要的图片调用到列表视图中的特定视图

在 RecyclerView 中显示 firebase 存储图像

displaying firebase storage images in a RecyclerView

android

firebase

android-recyclerview

firebase-storage