使用Glide&存储和显示图像FireBase安卓

时间:2018-06-12 11:54:10

标签: android database firebase firebase-storage android-glide

我正在尝试使用Glide&上传和显示个人资料图片火力地堡。上传部分成功运行。但是,如果我尝试从数据库中加载该图像,它显示为空白。我的动机是在用户进入活动一次时加载profile_image,他可以点击现有图像并根据自己的意愿进行更改。

我的代码

public class User extends AppCompatActivity {

    private ImageView imageView;
    private Uri filePath;
    private final int PICK_IMAGE_REQUEST = 71;
    StorageReference storageReference;

    private void loadImage(){

        Bundle bundle = getIntent().getExtras();
        assert bundle != null;
        final String retrievedName = bundle.getString("Name");

        // Reference to an image file in Cloud Storage
        StorageReference storageReference  = FirebaseStorage.getInstance().getReference().child(retrievedName).child("images/profile_image");
        imageView = findViewById(R.id.profile_image);

    // Load the image using Glide
        Glide.with(User.this.getApplicationContext())
                .load(storageReference)
                .into(imageView );
    }


    private void uploadImage() {

        if(filePath != null)
        {

            Bundle bundle = getIntent().getExtras();
            assert bundle != null;
            final String retrievedName = bundle.getString("Name");

            storageReference = FirebaseStorage.getInstance().getReference();

            StorageReference ref = storageReference.child(retrievedName).child("images/profile_image");
            ref.putFile(filePath)
                    .addOnSuccessListener(new OnSuccessListener<UploadTask.TaskSnapshot>() {
                        @Override
                        public void onSuccess(UploadTask.TaskSnapshot taskSnapshot) {
                            Toast.makeText(User.this, "Uploaded", Toast.LENGTH_SHORT).show();
                        }
                    })
                    .addOnFailureListener(new OnFailureListener() {
                        @Override
                        public void onFailure(@NonNull Exception e) {
                            Toast.makeText(User.this, "Failed "+e.getMessage(), Toast.LENGTH_SHORT).show();
                        }
                    });
        }
    }

    private void chooseImage() {
        Intent intent = new Intent();
        intent.setType("image/*");
        intent.setAction(Intent.ACTION_GET_CONTENT);
        startActivityForResult(Intent.createChooser(intent, "Select Picture"), PICK_IMAGE_REQUEST);
    }

    protected void onActivityResult(int requestCode, int resultCode, Intent data) {
        super.onActivityResult(requestCode, resultCode, data);
        if(requestCode == PICK_IMAGE_REQUEST && resultCode == RESULT_OK
                && data != null && data.getData() != null )
        {
            filePath = data.getData();
            try {
                Bitmap bitmap = MediaStore.Images.Media.getBitmap(getContentResolver(), filePath);
                imageView.setImageBitmap(bitmap);

                uploadImage();
            }
            catch (IOException e)
            {
                e.printStackTrace();
            }
        }
    }

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_user);
        imageView = findViewById(R.id.profile_image);

        loadImage();

        imageView.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {

                    chooseImage();
            }
        });
    }

}

2 个答案:

答案 0 :(得分:1)

正如官方firebase文档HERE中所述,您应该getDownloadURL()照片将照片传递到您的滑动库,这样滑行就会显示您的图像

在此行中添加getDownloadUrl();

    StorageReference ref = storageReference.child(retrievedName).child("images/profile_image").getDownloadUrl();

然后只需用滑行来调用你的图像

// Load the image using Glide
Glide.with(this /* context */)
        .using(new FirebaseImageLoader())
        .load(ref)
        .into(imageView);

要使用FirebaseImageLoader(),请记住将其添加到您的gradle中

dependencies {
    // FirebaseUI Storage only
    compile 'com.firebaseui:firebase-ui-storage:0.6.0'
}

关注如何从StorageReference

加载图片的THIS GitHub链接

另一种更简单的方法是获取DownloadUrl并在滑行中使用它

ref.putFile(filePath)
                .addOnSuccessListener(new OnSuccessListener<UploadTask.TaskSnapshot>() {
                    @Override
                    public void onSuccess(UploadTask.TaskSnapshot taskSnapshot) {
                         @SuppressWarnings("VisibleForTests") Uri downloadUrl = 
                     taskSnapshot.getDownloadUrl();
                    uploadImageUrl = downloadUrl.toString();
                Toast.makeText(getApplicationContext(), "url to your file..."+uploadImageUrl, Toast.LENGTH_SHORT).show();
                    }
                })
                .addOnFailureListener(new OnFailureListener() {
                    @Override
                    public void onFailure(@NonNull Exception e) {
                        Toast.makeText(User.this, "Failed "+e.getMessage(), Toast.LENGTH_SHORT).show();
                    }
                });

uploadImageUrl是一个全局变量private String uploadImageUrl;

然后只需将滑动的图片网址加载到您的imageView

Glide.with(this /* your_context */)
    .load(uploadImageUrl)
    .centerCrop()
    .into(imageView)

答案 1 :(得分:1)

最后我得到了解决方案。

在上传部分,我在实时数据库中添加了网址

Legal

加载时我使用了来自数据库的这个Url并在Glide中使用

url_db = FirebaseDatabase.getInstance().getReference().child(retrievedName).child("Url");
        StorageReference ref = FirebaseStorage.getInstance().getReference().child(retrievedName).child("images/profile_image");
        ref.putFile(filePath)
                .addOnSuccessListener(new OnSuccessListener<UploadTask.TaskSnapshot>() {
                    @Override
                    public void onSuccess(UploadTask.TaskSnapshot taskSnapshot) {
                        @SuppressWarnings("VisibleForTests") Uri downloadUrl =
                                taskSnapshot.getDownloadUrl();
                        uploadImageUrl = downloadUrl.toString();

                        url_db.setValue(uploadImageUrl);
                    }
                })
                .addOnFailureListener(new OnFailureListener() {
                    @Override
                    public void onFailure(@NonNull Exception e) {
                        Toast.makeText(User.this, "Failed " + e.getMessage(), Toast.LENGTH_SHORT).show();
                    }
                });

感谢支持人员。