Используем Firebase в качестве хранилища изображений для Android-приложения


В этой статье вы узнаете, как извлечь изображение из хранилища Firebase для Android-приложения.


Firebase


Firebase — это платформа для разработки мобильных и веб-приложений, разработанная компанией Firebase в 2011 году и приобретённая Google в 2014 году. По состоянию на октябрь 2018 года платформа Firebase насчитывает 18 продуктов, которые используются в 1,5 миллионах приложений. Она помогает быстро разрабатывать высококачественные приложения, расширять базу пользователей и зарабатывать больше денег.


Glide


Glide — это библиотека для загрузки изображений в Android-приложениях, разработанная компанией Bump Tech и рекомендованная Google. Она используется во многих проектах Google с открытым исходным кодом, включая официальное приложение Google I/O 2014. Glide поддерживает загрузку, декодирование и отображение изображений, видеоизображений и анимированных GIF-файлов.


Настройка Firebase


Давайте настроим Firebase для нашего Android-проекта.


  • Откройте firebase.google.com.


  • Нажмите «Начать проект».


  • Нажмите «Добавить проект».


  • Дайте своему проекту имя.



Имя проекта


  • Нажмите кнопку «Создать проект» внизу.


  • Нажмите на значок Android.



Создание проекта


  • Вы увидите страницу под названием «Добавить Firebase в своё Android-приложение».

Добавить Firebase в своё Android-приложение


  • Добавьте название пакета вашего Android-приложения.

Например > com.example.retrieving_images_from_firebase.


  • Добавьте ключ SHA1 и нажмите «Зарегистрировать приложение».


  • Нажмите кнопку «Скачать google-services.json», чтобы загрузить этот файл.


  • Затем добавьте google-services.json в папку app вашего проекта.



google-services.json


  • Откройте gradle-файл уровня проекта. Добавьте эту зависимость внутрь блока зависимостей:

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

Так это должно выглядеть:


Зависимость


  • Откройте gradle-файл уровня приложения. Добавьте зависимости:

androidTestImplementation 'com.android.support.test:runner:1.0.2'
androidTestImplementation 'com.android.support.test.espresso:espresso-core:3.0.2'
implementation 'com.squareup.picasso:picasso:2.71828'
testImplementation 'junit:junit:4.12'
implementation 'com.github.bumptech.glide:glide:4.7.1'
compile 'com.android.support.constraint:constraint-layout:1.1.3'
compile 'com.google.firebase:firebase-database:11.0.2' 
compile 'com.google.firebase:firebase-storage:11.0.2' 
compile 'com.google.firebase:firebase-auth:11.0.2' 
compile 'com.firebaseui:firebase-ui-database:2.1.0' 

Так это должно выглядеть:


Зависимости


  • Теперь добавьте packagingOptions снизу от блока buildTypes:

packagingOptions {
        exclude 'META-INF/LICENSE'
        exclude 'META-INF/LICENSE-FIREBASE.txt'
        exclude 'META-INF/NOTICE'
    }

Так это должно выглядеть:


packagingOptions



Теперь нажмите на База данных > Правила. Добавьте следующие строки:


service cloud.firestore {
  match /databases/{database}/documents {
    match /{document=**} {
      allow read, write;
    }
  }
}

Нажмите на Хранилище > Правила. Добавьте следующие строки:


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

  • Теперь нажмите на Хранилище > Файлы. Загрузите изображение с помощью кнопки «Загрузить файл».

Загрузка файла


  • Нажмите на любое загруженное изображение. Затем с правой стороны внизу вы найдете Download URL1. Скопируйте это.

Download URL1


Activity_main.xml


Создайте ImageView, в котором будет отображаться изображение.


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

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="RETRIEVE FROM FIREBASE"
        android:gravity="center"
        android:textSize="30dp"
        android:textColor="#000000"/>

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

</LinearLayout>

MainActivity.java


package com.example.retrieving_images_from_firebase;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.ImageView;

import com.bumptech.glide.Glide;

public class MainActivity extends AppCompatActivity {

    ImageView imageView;

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

        imageView=findViewById(R.id.image);

        // URL изображения, который мы получили выше
        String url="https://firebasestorage.googleapis.com/v0/b/retrieve-images-958e5.appspot.com/o/9.PNG?alt=media&token=6bd05383-0070-4c26-99cb-dcb17a23f7eb";

        Glide.with(getApplicationContext()).load(url).into(imageView);
    }
}

Поздравляем! Теперь вы можете запустить ваше приложение.


После запуска приложения вы увидите ваше изображение.


Изображение


Весь код вы можете скачать с нашего репозитория на GitHub.

Комментарии (4)


  1. Vertoletique
    31.05.2019 09:49
    +1

    Я бы добавил еще информацию об SDK для Android, потому как можно и с мобилы аплоадить файлы, так же неплохо было бы дописать про firebase functions и ограничения firebase firestore, потому как для поиграться — демки (функционал firestore с ограничениями по кол-ву запросов и размеру хранилища) хватит, а для полноценного приложения — нет. И это, переходи на androidX уже) И на котлин, а то не модерново)


    1. Skerrigan
      31.05.2019 10:21

      firebase firestore

      Вот только хотел про это написать — была ведь не столь давно иная политика и лимиты были куда гуманнее. В итоге разработчики привыкли по-дефолту использовать firebase для мелко-средних приложений.
      А потом кому-то в голову пришло это все жестко монетизировать — мир со стороны разработчиков поимел мгновенно громадный пласт боли.
      На сегодня, кроме как «поиграться» и даже не знаю, зачем этот firebase остался нужен.


  1. ase21
    01.06.2019 15:58

    Ну хоть бы версии либ последние использовали((


  1. agent10
    02.06.2019 14:52

    включая официальное приложение Google I/O 2014

    5 летней давности?) Ну круто чо…