Android:如何在 Firebase 存储上上传图片?

androidmobile developmentapps/applications更新于 2026/2/8 22:37:17

什么是 Firebase 存储?

Firebase 是 Google 旗下著名的云平台服务提供商之一，为 Android、iOS 和 Web 应用提供数据库、存储、托管等云服务。本文将详细介绍 Firebase 存储，并介绍如何使用它将图片从 Android 设备上传到 Firebase 存储。

Firebase 存储的实现

我们将创建一个简单的 Android 应用程序，其中只显示两个按钮和一个图片视图。我们将使用一个按钮来选择图片，另一个按钮将图片上传到 Firebase 存储。我们还将使用一个图片视图，用于显示用户从设备中选择的图片。我们将按照分步指南，使用 Kotlin 在 Android 应用程序中实现 Firebase 存储。

步骤 1:在 Android Studio 中创建新项目

导航到 Android Studio 并点击"新建项目"。

点击"新建项目"后，您将看到以下屏幕。

在此屏幕中，我们只需选择"空活动"并点击"下一步"。点击"下一步"后，您将看到以下屏幕。

在此屏幕中，我们只需指定项目名称。然后包名称将自动生成。

注意 - 确保选择"语言"为 Kotlin。

指定所有详细信息后，点击"完成"以创建一个新的 Android Studio 项目。

项目创建完成后，我们将看到两个打开的文件，即 activity_main.xml 和 MainActivity.kt 文件。

步骤 2:将您的项目连接到 Firebase 存储

项目创建完成后，导航到 Android Studio 工具栏中的"工具"选项卡，该选项卡显示在 Android Studio 顶部。在里面点击"Firebase"> 然后点击"Firebase 存储"，您将看到以下屏幕。

之后，您只需点击"连接到 Firebase"即可将您的应用连接到 Firebase。然后，您需要点击"将云存储添加到 Firebase"以向其添加 Firebase 存储依赖项。点击这两个按钮后，您将看到以下屏幕。

现在我们的应用已连接到 Firebase 存储。

步骤 3:使用 activity_main.xml

导航到 activity_main.xml。如果此文件不可见，请打开此文件。在左侧窗格中，导航至 app>res>layout>activity_main.xml 以打开此文件。打开此文件后，将以下代码添加到其中。代码中添加了注释，以便您详细了解。

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
   xmlns:tools="http://schemas.android.com/tools"
   android:layout_width="match_parent"
   android:layout_height="match_parent"
   tools:context=".MainActivity">

   <!-- creating text view for displaying heading-->
   <TextView
      android:id="@+id/idTVHeading"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:layout_margin="20dp"
      android:gravity="center"
      android:text="Firebase Storage in Android"
      android:textAlignment="center"
      android:textAllCaps="false"
      android:textColor="#FF000000"
      android:textSize="20sp"
      android:textStyle="bold" />

   <!-- creating an image view for displaying image-->
   <ImageView
      android:id="@+id/idIVImage"
      android:layout_width="match_parent"
      android:layout_height="300dp"
      android:layout_below="@id/idTVHeading"
      android:layout_margin="10dp"
      android:padding="3dp" />

   <!-- creating a button to choose image-->
   <Button
      android:id="@+id/idBtnChooseImage"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:layout_below="@id/idIVImage"
      android:layout_margin="10dp"
      android:padding="4dp"
      android:text="Choose Image"
      android:textAllCaps="false" />

   <!-- creating a button to upload image-->
   <Button
      android:id="@+id/idBtnUploadImage"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:layout_below="@id/idBtnChooseImage"
      android:layout_margin="10dp"
      android:padding="4dp"
      android:text="Upload Image"
      android:textAllCaps="false" />

</RelativeLayout>

说明− 在上面的代码中，我们创建了一个根布局作为相对布局。在这个布局中，我们创建了一个文本视图来显示应用程序的标题。创建此文本视图后，我们创建了一个图像视图。在这个图像视图中，我们将显示用户从其设备中选择的图像。之后，我们添加了两个按钮。一个按钮用于从用户设备中选择图像，另一个按钮用于将图像上传到 Firebase 存储。

步骤 4:使用 MainActivity.kt 文件

导航至 app>java>您的应用包名称>MainActivity.kt 文件，并向其中添加以下代码。代码中添加了注释，以便您详细了解。

package com.gtappdevelopers.androidapplication

import android.app.ProgressDialog
import android.content.Intent
import android.graphics.Bitmap
import android.net.Uri
import android.os.Bundle
import android.provider.MediaStore
import android.widget.Button
import android.widget.ImageView
import android.widget.Toast
import androidx.appcompat.app.AppCompatActivity
import com.google.firebase.storage.FirebaseStorage
import com.google.firebase.storage.StorageReference
import java.util.*

class MainActivity : AppCompatActivity() {
   // 为按钮、图像视图和文件的 Uri 创建变量。
   lateinit var chooseImageBtn: Button
   lateinit var uploadImageBtn: Button
   lateinit var imageView: ImageView
   var fileUri: Uri? = null;

   override fun onCreate(savedInstanceState: Bundle?) {
      super.onCreate(savedInstanceState)
      setContentView(R.layout.activity_main)
      // 在下面一行初始化按钮和图像视图的变量。
      chooseImageBtn = findViewById(R.id.idBtnChooseImage)
      uploadImageBtn = findViewById(R.id.idBtnUploadImage)
      imageView = findViewById(R.id.idIVImage)

        // 下面一行，为选择图片按钮添加点击监听器。
        chooseImageBtn.setOnClickListener {
        // 下面一行，调用 Intent 从手机存储中获取图片。
        val intent = Intent()
        // 下面一行，设置我们要选择的文件类型，在本例中，我们选择图片。
        intent.type = "image/*"
        // 下面一行，我们设置获取内容的操作。
        intent.action = Intent.ACTION_GET_CONTENT
        // 下面一行，调用启动 Activity 获取结果，选择图片。
         startActivityForResult(
            // 在下面的行中创建选择器来选择图像。
            Intent.createChooser(
               intent,
               "Pick your image to upload"
            ),
            22
         )
      }

      // 在下面的行中添加点击监听器来上传图像。
      uploadImageBtn.setOnClickListener {
         // 在下面的行中调用上传图像按钮来上传我们的图像。
         uploadImage()
      }
   }

   // 在下面的行中添加活动结果方法，当用户选择图像时调用此方法。
   override fun onActivityResult(requestCode: Int, resultCode: Int, data: Intent?) {
      super.onActivityResult(requestCode, resultCode, data)
      // 下面我们检查结果是否正确
      if (requestCode == 22 && resultCode == RESULT_OK && data != null && data.data != null) {
         // 在下面一行中，使用我们从 intent 获取的数据初始化文件 uri
         fileUri = data.data
         try {
            // 下面的行从文件 uri 获取图像的位图。
            val bitmap: Bitmap = MediaStore.Images.Media.getBitmap(contentResolver, fileUri);
            // 在下面的行中为我们的图像视图设置位图。
            imageView.setImageBitmap(bitmap)
         } catch (e: Exception) {
            // 处理下面一行的异常
            e.printStackTrace()
         }
      }
   }

   // 在下面创建一个函数来上传我们的图像。
   fun uploadImage() {
      // 在下面一行检查我们的文件 uri 是否为空。
      if (fileUri != null) {
         // 上传图像时在下面的行显示进度对话框。
         val progressDialog = ProgressDialog(this)
         //在下面的行中设置进度对话框的标题和消息并显示我们的进度对话框。
         progressDialog.setTitle("Uploading...")
         progressDialog.setMessage("Uploading your image..")
         progressDialog.show()

         // 在下面的行中为 Firebase 存储创建一个存储引用，并在其中创建一个子项
         // 随机 uuid。
         val ref: StorageReference = FirebaseStorage.getInstance().getReference()
         .child(UUID.randomUUID().toString())
         // 在下面的行中添加一个文件到我们的存储中。
         ref.putFile(fileUri!!).addOnSuccessListener {
            // 文件上传时调用此方法。
            // 在这种情况下，我们将关闭进度对话框并显示一条 Toast 消息
            progressDialog.dismiss()
            Toast.makeText(applicationContext, "Image Uploaded..", Toast.LENGTH_SHORT).show()
         }.addOnFailureListener {
            // 当文件上传失败时调用此方法。
            // 在这种情况下，我们将关闭对话框并显示 toast 消息
            progressDialog.dismiss()
            Toast.makeText(applicationContext, "Fail to Upload Image..", Toast.LENGTH_SHORT)
            .show()
         }
      }
   }
}

说明− 在上面的代码中，我们首先为图像视图、上传图像按钮、选择图像按钮以及文件 URI 变量创建变量。然后在 onCreate 方法中，我们使用在 activity_main.xml 中指定的 ID 初始化这些变量。

接下来，我们为选择图像按钮添加一个点击监听器。在 onclick 方法中，我们为 Intent 创建一个变量，并将其类型设置为"图像"，因为我们想要选择图像。然后，我们设置其操作以获取图像。之后，我们设置结果的启动活动以显示图像选择器。在其中，我们创建一个图像选择器，用于从用户的设备中选择图像。

之后，我们创建一个 onActivityResult 方法，在该方法中，我们将用户选择的图像设置到图像视图中。在此方法中，我们首先从选择的图像中获取数据，并将其设置为文件 URI。之后，我们根据该文件 URI 创建一个位图，并将该位图设置到我们的图像视图中，以便在图像视图中显示所选图像。

之后，我们创建一个上传图像的方法。在此方法中，我们检查文件 URI 是否为空。如果为空，我们将在下一行显示一个进度条来显示图像上传的进度。在此进度对话框中，我们显示进度对话框的标题和消息。然后，在下面一行中，我们创建一个存储引用变量，以获取我们必须上传图像的引用。在此引用中，我们指定一个随机 uuid 来上传图像。之后，我们调用 put file 方法将文件上传到 Firebase 存储。此方法有两个回调，一个是 onSuccessListner。当图像上传成功时会调用此方法，并在此方法中显示一个 toast 消息并关闭进度对话框。另一个方法是 onFailureListner。当图像上传操作失败时会调用此方法。在这种情况下，我们也显示提示消息并关闭进度对话框。

步骤 5:向 AndroidManifest.xml 文件添加权限

导航至 app>AndroidManifest.xml，并添加以下互联网和读取存储权限。

<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />

第 6 步:在 Firebase 控制台上配置 Firebase 存储

导航至 https://console.firebase.google.com/ 访问 Firebase 控制台。请确保您使用与 Android Studio 中相同的帐户登录。然后，导航至 Firebase 控制台左侧窗格中的"构建"选项。点击"存储"为您的项目添加 Firebase 存储。之后，点击"开始"选项，您将看到以下屏幕。