如何从Android应用程序将图像上传到Firebase

Firebase是一个移动和Web应用程序开发平台,Firebase Storage为Firebase应用程序提供安全的文件上传和下载。 在本文中,您将构建一个能够将图像上传到Firebase Storage的Android应用程序。

Firebase设定

如果您还没有Firebase帐户,则可以在Firebase主页上创建一个。

设置帐户后,转到Firebase控制台 ,然后单击“ 添加项目”按钮以添加新项目。

Firebase主页

输入您的项目详细信息,完成后单击“ 创建项目”按钮。 在下一页上,单击“将Firebase添加到您的Android应用程序”的链接。

创建项目选项

输入您的应用程序包名称。 我的应用程序包是com.tutsplus.code.android.tutsplusupload 。 请注意,程序包名称使用唯一的字符串命名,用于标识您或您的公司。 一种简单的查找方法是打开MainActivity文件并从顶部复制包名称。

将Firebase添加到您的Android应用

完成后,点击Register App 。 在下一页上,将为您提供google-services.json以下载到您的计算机。 将该文件复制并粘贴到应用程序的应用程序文件夹中。 (路径应类似于TutsplusUpload / app 。)

设置Firebase权限

要允许您的应用访问Firebase存储,您需要在Firebase控制台中设置权限。 在控制台中,单击“ 存储” ,然后单击“ 规则”

Firebase存储权限规则

粘贴以下规则并发布。

service firebase.storage {
  match /b/{bucket}/o {
    match /{allPaths=**} {
      allow read, write: if true;
    }
  }
}

这将允许对Firebase存储的读写访问。

创建应用程序

打开Android Studio,然后创建一个新项目。 您可以根据需要调用项目。 我叫我TutsplusUpload

在继续之前,您需要添加几个依赖项。 在Android Studio的左侧面板上,点击Gradle脚本

buildgradle文件

打开构建。 gradle (Project: TutsplusUpload ,并将这一行代码添加到dependencies块中。

classpath 'com.google.gms:google-services:3.0.0'

接下来,打开构建。 gradle (Module:app)添加Firebase的依赖项。 这些也进入依赖关系块。

compile 'com.google.firebase:firebase-storage:9.2.1'
  compile 'com.google.firebase:firebase-auth:9.2.1'

最后,在依赖关系块之外,添加Google Services插件。

apply plugin: 'com.google.gms.google-services'

完成后保存,它应该同步。

设置MainActivity布局

该应用程序将需要一种活动布局。 需要两个按钮-一个用于从设备中选择图像,另一个用于上载所选图像。 选择要上传的图像后,该图像将显示在布局中。 换句话说,将不会从布局而是从活动设置图像。

MainActivity布局中,将使用两种布局-将线性布局嵌套在相对布局内。 首先为您的相对布局添加代码。

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

</RelativeLayout>

RelativeLayout占用设备提供的整个空间。 LinearLayout将位于RelativeLayout内部,并且具有两个按钮。 按钮应并排放置,因此用于LinearLayout的方向将为水平。

这是线性布局的代码。

<LinearLayout
        android:id="@+id/layout_button"
        android:orientation="horizontal"
        android:layout_alignParentTop="true"
        android:weightSum="2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <Button
            android:id="@+id/btnChoose"
            android:text="Choose"
            android:layout_weight="1"
            android:layout_width="0dp"
            android:layout_height="wrap_content" />

        <Button
            android:id="@+id/btnUpload"
            android:text="Upload"
            android:layout_weight="1"
            android:layout_width="0dp"
            android:layout_height="wrap_content" />
    </LinearLayout>

从上面的代码中,您可以看到两个按钮都分配了ID。 ID将用于从主要活动中定位按钮,以便在单击按钮时启动交互。 您很快就会看到。

LinearLayout ,添加ImageView的代码。

<ImageView
        android:id="@+id/imgView"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

您还可以看到ImageView有一个id ; 您将使用它来填充所选图像的布局。 这将在主要活动中完成。

启动MainActivity

导航到MainActivity ,然后从声明字段开始。 这些字段将用于初始化视图(按钮和ImageView ),以及用于指示将从何处拾取图像的URI。 将此添加到onCreate方法上方的主要活动中。

private Button btnChoose, btnUpload;
  private ImageView imageView;

  private Uri filePath;

  private final int PICK_IMAGE_REQUEST = 71;

PICK_IMAGE_REQUEST是定义为实例变量的请求代码。

现在,您可以像这样初始化视图:

//Initialize Views
    btnChoose = (Button) findViewById(R.id.btnChoose);
    btnUpload = (Button) findViewById(R.id.btnUpload);
    imageView = (ImageView) findViewById(R.id.imgView);

在上面的代码中,您正在创建ButtonImageView新实例。 实例指向您在布局中创建的按钮。

您必须设置一个侦听器,以侦听按钮上的交互。 发生交互时,您想调用一个方法,该方法触发从图库中选择图像或触发将所选图像上载到Firebase。

在初始化的视图下,设置两个按钮的侦听器。 听众看起来像这样。

btnChoose.setOnClickListener(new View.OnClickListener() {
      @Override
      public void onClick(View v) {
        chooseImage();
      }
    });

    btnUpload.setOnClickListener(new View.OnClickListener() {
      @Override
      public void onClick(View v) {
        uploadImage();
      }
    });

这应该在onCreate()方法中。 正如我上面提到的,两个按钮都调用不同的方法。 选择按钮调用chooseImage()方法,而上按钮调用uploadImage()方法。 让我们添加这些方法。 两种方法都应在onCreate()方法之外实现。

让我们从选择图像的方法开始。 这是它的外观:

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);
  }

调用此方法时,将创建一个新的Intent实例。 意向类型设置为图像,其动作设置为获取某些内容。 目的创建一个图像选择器对话框,允许用户浏览设备库以选择图像。 startActivityForResult用于接收结果,即选定的图像。 要显示此图像,您将使用一种名为onActivityResult的方法。

onActivityResult接收请求代码,结果代码和数据。 在这种方法中,您将检查请求代码是否等于PICK_IMAGE_REQUEST ,结果代码等于RESULT_OK和可用数据。 如果所有这些都成立,那么您想在ImageView显示选定的图像。

chooseImage()方法下面,添加以下代码。

@Override
  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);
      }
      catch (IOException e)
      {
        e.printStackTrace();
      }
    }
  }

将文件上传到Firebase

现在,我们可以实现将图像上传到Firebase的方法。 首先,声明Firebase所需的字段。 在您为课程声明的其他字段下方执行此操作。

//Firebase
  FirebaseStorage storage;
  StorageReference storageReference;

storage将用于创建FirebaseStorage实例,而storageReference将指向上传的文件。 在您的onCreate()方法中,添加用于执行此操作的代码-创建FirebaseStorage实例并获取存储引用。 引用可以看作是指向云中文件的指针。

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

这是uploadImage()方法的外观。

private void uploadImage() {

    if(filePath != null)
    {
      final ProgressDialog progressDialog = new ProgressDialog(this);
      progressDialog.setTitle("Uploading...");
      progressDialog.show();

      StorageReference ref = storageReference.child("images/"+ UUID.randomUUID().toString());
      ref.putFile(filePath)
              .addOnSuccessListener(new OnSuccessListener<UploadTask.TaskSnapshot>() {
                @Override
                public void onSuccess(UploadTask.TaskSnapshot taskSnapshot) {
                  progressDialog.dismiss();
                  Toast.makeText(MainActivity.this, "Uploaded", Toast.LENGTH_SHORT).show();
                }
              })
              .addOnFailureListener(new OnFailureListener() {
                @Override
                public void onFailure(@NonNull Exception e) {
                  progressDialog.dismiss();
                  Toast.makeText(MainActivity.this, "Failed "+e.getMessage(), Toast.LENGTH_SHORT).show();
                }
              })
              .addOnProgressListener(new OnProgressListener<UploadTask.TaskSnapshot>() {
                @Override
                public void onProgress(UploadTask.TaskSnapshot taskSnapshot) {
                  double progress = (100.0*taskSnapshot.getBytesTransferred()/taskSnapshot
                          .getTotalByteCount());
                  progressDialog.setMessage("Uploaded "+(int)progress+"%");
                }
              });
    }
  }

调用uploadImage()方法时,将初始化ProgressDialog的新实例。 显示向用户显示正在上传图像的文本通知。 然后,对上载图像的引用storageReference.child()用于访问images文件夹中的上载文件。 上传图像后会自动创建此文件夹。 还添加了侦听器以及吐司消息。 根据上载状态显示这些消息。

在应用程序中设置权限

最后,您需要请求您的应用程序将使用的权限。 否则,您的应用程序用户将无法浏览其设备库并无法通过您的应用程序连接到Internet。 这样做很容易-只需将以下内容粘贴到AndroidManifest文件中即可。 将其粘贴在application元素标签上方。

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

这请求使用互联网和读取外部存储的权限。

测试应用

现在继续运行您的应用程序! 您应该能够选择图像并将其成功上传到Firebase。 要确认上传的图像,请返回控制台并检入存储的“ 文件”部分。

完成的应用程序

结论

Firebase为开发人员提供了很多好处,其中带有存储的文件上传就是其中之一。 从Android应用程序上传图像需要您使用“活动和意图”。 通过遵循本教程,您对活动和意图的理解得到了加深。 我希望你喜欢它!

翻译自: https://code.tutsplus.com/tutorials/image-upload-to-firebase-in-android-application--cms-29934

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值