如何从 FirebaseStorage 检索图像并将其显示在 Canvas 中?
How do I retrieve an image from FirebaseStorage and show it in a Canvas?
我的应用程序将图像存储在 FirebaseFirestore 中;它们可以是 jpg 或 png 格式。我有一个 Activity 在 Canvas
上绘制网格,我想将图像放入网格中。整个网格 + 图像称为 ImageGrid,定义如下(为了便于阅读,省略了一些内容):
public class ImageGrid extends View {
private final Context mContext;
private int mNumRows, mNumCols;
private float canvas_height, canvas_width;
private final Paint mPaint;
private float image_cell_size;
private String[][] image_urls;
public ImageGrid(Context thisContext, AttributeSet attrs) {
super(thisContext, attrs);
mContext = getContext();
mPaint = new Paint();
}
public void setSize(int numRows, int numCols) {
mNumRows = numRows;
mNumSts = numCols;
invalidate();
}
public void setImages(String[][] images) {
image_urls = images;
}
// DRAW GRID FUNCTIONS set up the grid and add the images
protected void onDraw(Canvas canvas) {
canvas_height = canvas.getHeight();
canvas_width = canvas.getWidth();
get_cell_size(); // Get the size of the cells
// image_cell_size has now been set by get_cell_size
// Draw axes & chart
draw_images(canvas); // Draw the images
}
// Draw images
private void draw_images(final Canvas canvas) {
if (mChart == null) return;
final Resources resources = mContext.getResources();
FirebaseStorage mStorage = FirebaseStorage.getInstance();
final StorageReference mStorageRef = mStorage.getReference();
for (int rr = 0; rr < mNumRows; rr++) {
for (int cc = 0; cc < mNumSts; cc++) {
String drawableUrl = image_urls[rr][cc];
if(drawableUrl != null) {
* THIS IS WHERE I NEED TO GET THE IMAGE AND DISPLAY IT *
}
}
}
}
}
所以,在网上搜索如何获取图像然后在 Canvas 上绘制之后,我有这个:
mStorageRef.child(drawableUrl)
.getDownloadUrl()
.addOnSuccessListener(
new OnSuccessListener<Uri>() {
public void onSuccess(Uri uri) {
Glide.with(getContext())
.asBitmap()
.load(uri)
.into(new CustomTarget<Bitmap>() {
public void onResourceReady(
Bitmap resource,
Transition<? super Bitmap> transition) {
Drawable d = new BitmapDrawable(getResources(), resource);
d.setBounds(
cc * cell_size,
rr * cell_size,
(cc + 1)*cell_size,
(rr + 1) * cell_size);
d.draw(canvas);
}}});
这将从数据库中检索图像;当我检查调试器时,d
看起来不错——它包含正确的图像。然后我使用 setBounds 设置图像的角 - 再次,与 canvas 的大小和我要适应的图像数量相比,这里计算的值看起来是正确的。最后,图像应该是在 canvas 上绘制 - 没有错误消息,但什么也没有出现。
我真的不知道接下来要检查什么,或者还可以尝试什么。谁能提出任何可行的建议?
好的,我明白了。问题是 canvas
必须在 draw_images
中声明为 final,因为它是从内部 class 中访问的。这意味着内部 class 无法更新它。
因此,我创建了一个名为 mDrawables
的 class 变量,它是 Drawables
的数组。然后我在 setImages
中一次检索一个 Drawables
并将它们存储在 mDrawables
中。当每个被检索时,我更新到目前为止已检索的数量的计数;一旦这等于图像总数,我就使 ImageGrid
.
无效
然后在 draw_images
中,当遍历单元格时,我在 mDrawables
中已经有了可绘制对象,可以直接从那里使用它们。
我的应用程序将图像存储在 FirebaseFirestore 中;它们可以是 jpg 或 png 格式。我有一个 Activity 在 Canvas
上绘制网格,我想将图像放入网格中。整个网格 + 图像称为 ImageGrid,定义如下(为了便于阅读,省略了一些内容):
public class ImageGrid extends View {
private final Context mContext;
private int mNumRows, mNumCols;
private float canvas_height, canvas_width;
private final Paint mPaint;
private float image_cell_size;
private String[][] image_urls;
public ImageGrid(Context thisContext, AttributeSet attrs) {
super(thisContext, attrs);
mContext = getContext();
mPaint = new Paint();
}
public void setSize(int numRows, int numCols) {
mNumRows = numRows;
mNumSts = numCols;
invalidate();
}
public void setImages(String[][] images) {
image_urls = images;
}
// DRAW GRID FUNCTIONS set up the grid and add the images
protected void onDraw(Canvas canvas) {
canvas_height = canvas.getHeight();
canvas_width = canvas.getWidth();
get_cell_size(); // Get the size of the cells
// image_cell_size has now been set by get_cell_size
// Draw axes & chart
draw_images(canvas); // Draw the images
}
// Draw images
private void draw_images(final Canvas canvas) {
if (mChart == null) return;
final Resources resources = mContext.getResources();
FirebaseStorage mStorage = FirebaseStorage.getInstance();
final StorageReference mStorageRef = mStorage.getReference();
for (int rr = 0; rr < mNumRows; rr++) {
for (int cc = 0; cc < mNumSts; cc++) {
String drawableUrl = image_urls[rr][cc];
if(drawableUrl != null) {
* THIS IS WHERE I NEED TO GET THE IMAGE AND DISPLAY IT *
}
}
}
}
}
所以,在网上搜索如何获取图像然后在 Canvas 上绘制之后,我有这个:
mStorageRef.child(drawableUrl)
.getDownloadUrl()
.addOnSuccessListener(
new OnSuccessListener<Uri>() {
public void onSuccess(Uri uri) {
Glide.with(getContext())
.asBitmap()
.load(uri)
.into(new CustomTarget<Bitmap>() {
public void onResourceReady(
Bitmap resource,
Transition<? super Bitmap> transition) {
Drawable d = new BitmapDrawable(getResources(), resource);
d.setBounds(
cc * cell_size,
rr * cell_size,
(cc + 1)*cell_size,
(rr + 1) * cell_size);
d.draw(canvas);
}}});
这将从数据库中检索图像;当我检查调试器时,d
看起来不错——它包含正确的图像。然后我使用 setBounds 设置图像的角 - 再次,与 canvas 的大小和我要适应的图像数量相比,这里计算的值看起来是正确的。最后,图像应该是在 canvas 上绘制 - 没有错误消息,但什么也没有出现。
我真的不知道接下来要检查什么,或者还可以尝试什么。谁能提出任何可行的建议?
好的,我明白了。问题是 canvas
必须在 draw_images
中声明为 final,因为它是从内部 class 中访问的。这意味着内部 class 无法更新它。
因此,我创建了一个名为 mDrawables
的 class 变量,它是 Drawables
的数组。然后我在 setImages
中一次检索一个 Drawables
并将它们存储在 mDrawables
中。当每个被检索时,我更新到目前为止已检索的数量的计数;一旦这等于图像总数,我就使 ImageGrid
.
然后在 draw_images
中,当遍历单元格时,我在 mDrawables
中已经有了可绘制对象,可以直接从那里使用它们。