So laden Sie Bilder von einer Android-App in Firebase hoch

Firebase ist eine Plattform für die Entwicklung von Mobil- und Webanwendungen. Firebase Storage bietet sichere Dateiuploads und -downloads für Firebase-Apps. In diesem Beitrag erstellen Sie eine Android-Anwendung, mit der Sie Bilder in Firebase Storage hochladen können.

Firebase-Setup

Wenn Sie noch kein Firebase-Konto haben, können Sie auf der Firebase-Startseite ein Konto erstellen.

Wenn Ihr Konto eingerichtet ist, wechseln Sie zu Ihrer Firebase-Konsole und klicken Sie auf Projekt hinzufügen Schaltfläche, um ein neues Projekt hinzuzufügen.

Geben Sie Ihre Projektdetails ein und klicken Sie auf Projekt erstellen Taste, wenn Sie fertig sind. Klicken Sie auf der nächsten Seite auf den Link zu Fügen Sie Firebase zu Ihrer Android-App hinzu.

Geben Sie den Namen Ihres Anwendungspakets ein. Mein Bewerbungspaket ist com.tutsplus.code.android.tutsplusupload. Beachten Sie, dass der Paketname einen Namensraum mit einer eindeutigen Zeichenfolge hat, die Sie oder Ihr Unternehmen identifiziert. Eine einfache Möglichkeit, dies zu finden, besteht darin, Ihr zu öffnen Hauptaktivität Datei und kopieren Sie den Paketnamen von oben.

Wenn Sie fertig sind, klicken Sie auf App registrieren. Auf der nächsten Seite erhalten Sie eine google-services.json auf Ihren Computer herunterladen. Kopieren Sie diese Datei und fügen Sie sie in den App-Ordner Ihrer Anwendung ein. (Der Pfad sollte ungefähr so ​​sein TutsplusUpload / App.)

Legen Sie die Firebase-Berechtigungen fest

Damit Ihre App auf Firebase Storage zugreifen kann, müssen Sie Berechtigungen in der Firebase-Konsole einrichten. Klicken Sie in Ihrer Konsole auf Lager, und klicken Sie dann auf Regeln.

Fügen Sie die Regel unten ein und veröffentlichen Sie sie. 

service firebase.storage match / b / bucket / o match / allPaths = ** Lesen zulassen, schreiben: wenn wahr; 

Dadurch erhalten Sie Lese- und Schreibzugriff auf Ihren Firebase-Speicher.

Erstellen Sie die Anwendung

Öffnen Sie Android Studio und erstellen Sie ein neues Projekt. Sie können Ihr Projekt beliebig anrufen. Ich habe meine angerufen TutsplusUpload.

Bevor Sie fortfahren, müssen Sie einige Abhängigkeiten hinzufügen. Klicken Sie im linken Bereich Ihres Android Studios auf Gradle-Skripte.

Öffnen bauen.gradle (Projekt: TutsplusUpload), und fügen Sie diese Codezeile im Abhängigkeitsblock hinzu.

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

Als nächstes öffnen bauen.gradle (Modul: App) um die Abhängigkeiten für Firebase hinzuzufügen. Diese gehen auch in den Abhängigkeitenblock. 

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

Fügen Sie schließlich außerhalb des Abhängigkeitsblocks das Plugin für hinzu Google-Services.

 Plugin anwenden: "com.google.gms.google-services"

Speichern Sie, wenn Sie fertig sind, und es sollte synchronisiert werden.

Einrichten der Hauptaktivität Layout

Die Anwendung benötigt ein Aktivitätslayout. Es sind zwei Schaltflächen erforderlich, eine zum Auswählen eines Bildes von Ihrem Gerät und die andere zum Hochladen des ausgewählten Bildes. Nachdem Sie das Bild ausgewählt haben, das Sie hochladen möchten, wird das Bild im Layout angezeigt. Mit anderen Worten, das Bild wird nicht vom Layout, sondern von der Aktivität festgelegt.

In deiner Hauptaktivität Layout verwenden Sie zwei Layouts, die das lineare Layout innerhalb des relativen Layouts verschachteln. Fügen Sie zunächst den Code für Ihr relatives Layout hinzu.

  

Das RelativesLayout nimmt den gesamten vom Gerät zur Verfügung gestellten Platz ein. Das LinearLayout wird in der leben RelativesLayout, und wird die zwei Tasten haben. Die Tasten sollten nebeneinander platziert werden, damit die Ausrichtung für die Tasten verwendet werden kann LinearLayout wird horizontal sein.

Hier ist der Code für das lineare Layout.

  

Aus dem obigen Code können Sie sehen, dass beiden Schaltflächen IDs zugewiesen sind. Die IDs werden verwendet, um die Schaltfläche von der Hauptaktivität aus anzuvisieren, sodass beim Klicken auf die Schaltfläche eine Interaktion ausgelöst wird. Das wirst du bald sehen.

Unter dem LinearLayout, füge den Code für das hinzu Bildansicht.

Sie können auch das sehen Bildansicht hat eine Ich würde; Sie verwenden dies, um das Layout des ausgewählten Bildes zu füllen. Dies wird in der Haupttätigkeit durchgeführt.

Erhalten Hauptaktivität Oben

Navigiere zu deinem Hauptaktivität, und beginnen Sie mit der Deklaration von Feldern. Diese Felder werden zum Initialisieren Ihrer Ansichten verwendet (die Schaltflächen und Bildansicht) sowie die URI, die angibt, wo das Bild ausgewählt wird. Fügen Sie dies Ihrer Hauptaktivität über dem hinzu onCreate Methode.

 private Schaltfläche btnChoose, btnUpload; privates ImageView ImageView; privater Uri-Dateipfad; private final int PICK_IMAGE_REQUEST = 71;

PICK_IMAGE_REQUEST ist der Anforderungscode, der als Instanzvariable definiert ist.

Jetzt können Sie Ihre Ansichten wie folgt initialisieren:

 // Ansichten initialisieren btnChoose = (Button) findViewById (R.id.btnChoose); btnUpload = (Button) findViewById (R.id.btnUpload); imageView = (ImageView) findViewById (R.id.imgView);

Im obigen Code erstellen Sie neue Instanzen von Taste und Bildansicht. Die Instanzen verweisen auf die Schaltflächen, die Sie in Ihrem Layout erstellt haben.

Sie müssen einen Listener festlegen, der auf die Schaltflächen auf Interaktionen wartet. Wenn eine Interaktion stattfindet, möchten Sie eine Methode aufrufen, die entweder die Auswahl eines Bildes aus der Galerie oder das Hochladen des ausgewählten Bildes in Firebase auslöst.

Stellen Sie unter den initialisierten Ansichten den Listener für beide Schaltflächen ein. Der Hörer sieht so aus.

 btnChoose.setOnClickListener (new View.OnClickListener () @Override public void onClick (Ansicht v) selectImage ();); btnUpload.setOnClickListener (new View.OnClickListener () @Override public void onClick (View v) uploadImage (););

Das sollte in der sein onCreate () Methode. Wie bereits erwähnt, rufen beide Tasten eine andere Methode auf. Das Wählen Taste ruft die selectImage () Methode, während die Hochladen Taste ruft die Bild hochladen() Methode. Fügen wir diese Methoden hinzu. Beide Methoden sollten außerhalb des implementiert werden onCreate () Methode.

Beginnen wir mit der Methode, um ein Bild auszuwählen. So sollte es aussehen:

 private void selectImage () Absicht absicht = neu Absicht (); intent.setType ("image / *"); intent.setAction (Intent.ACTION_GET_CONTENT); startActivityForResult (Intent.createChooser (Absicht, "Bild auswählen"), PICK_IMAGE_REQUEST); 

Wenn diese Methode aufgerufen wird, eine neue Absicht Instanz wird erstellt. Der Intent-Typ ist auf image festgelegt, und die Aktion ist so eingestellt, dass etwas Inhalt abgerufen wird. Die Absicht erstellt einen Bildauswahldialog, in dem der Benutzer durch die Gerätegalerie blättern kann, um das Bild auszuwählen. startActivityForResult wird verwendet, um das Ergebnis zu empfangen, das das ausgewählte Bild ist. Um dieses Bild anzuzeigen, verwenden Sie eine aufgerufene Methode onActivityResult.

onActivityResult empfängt einen Anforderungscode, einen Ergebniscode und die Daten. Bei dieser Methode prüfen Sie, ob der Anforderungscode gleich ist PICK_IMAGE_REQUEST, mit dem Ergebniscode gleich RESULT_OK und die verfügbaren Daten. Wenn dies alles wahr ist, möchten Sie das ausgewählte Bild im anzeigen Bildansicht.

Unter dem selectImage () fügen Sie den folgenden Code hinzu.

 @Override protected void onActivityResult (int requestCode, int resultCode, Absichtsdaten) 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 (); 

Hochladen der Datei in Firebase

Jetzt können wir die Methode zum Hochladen des Bildes in Firebase implementieren. Zuerst müssen Sie die für Firebase benötigten Felder angeben. Tun Sie dies unter den anderen Feldern, die Sie für Ihre Klasse deklariert haben.

 // Firebase FirebaseStorage-Speicher; StorageReference StorageReference;

Lager wird verwendet, um ein zu erstellen FirebaseStorage zum Beispiel während storageReference zeigt auf die hochgeladene Datei. In deinem onCreate () Methode, fügen Sie den Code hinzu, um das zu erstellen FirebaseStorage Instanz und erhalten Sie die Speicherreferenz. Referenzen können als Verweise auf eine Datei in der Cloud angesehen werden.

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

Hier ist was der Bild hochladen() Methode sollte aussehen.

 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 (neuer OnSuccessListener() @Override public void onSuccess (UploadTask.TaskSnapshot taskSnapshot) progressDialog.dismiss (); Toast.makeText (MainActivity.this, "Uploaded", Toast.LENGTH_SHORT) .show (); . .addOnFailureListener (neuer OnFailureListener () @Override public void onFailure (@NonNull-Exception e) progressDialog.dismiss (); Toast.makeText (MainActivity.this, "Failed" + e.getMessage (), Toast.LENGT.) ) .show ();) .addOnProgressListener (neuer OnProgressListener() @Override public void onProgress (UploadTask.TaskSnapshot taskSnapshot) doppelter Fortschritt = (100.0 * taskSnapshot.getBytesTransferred () / taskSnapshot .getTotalByteCount ()); progressDialog.setMessage ("Uploaded" + (int) progress + "%"); ); 

Wenn der Bild hochladen() Methode wird aufgerufen, eine neue Instanz von ProgressDialog wird initialisiert. Eine Textnachricht, die den Benutzer darüber informiert, dass das Bild hochgeladen wird, wird angezeigt. Dann ein Hinweis auf das hochgeladene Bild, storageReference.child (), wird verwendet, um auf die hochgeladene Datei in zuzugreifen Bilder Mappe. Dieser Ordner wird automatisch erstellt, wenn das Bild hochgeladen wird. Listener werden ebenfalls mit Toast-Nachrichten hinzugefügt. Diese Meldungen werden abhängig vom Status des Uploads angezeigt.

Berechtigung in der App setzen

Schließlich müssen Sie die Erlaubnis einholen, die Ihre Anwendung verwenden wird. Andernfalls können Benutzer Ihrer Anwendung ihre Gerätegalerie nicht durchsuchen und mit Ihrer Anwendung eine Verbindung zum Internet herstellen. Dies ist ganz einfach - fügen Sie einfach Folgendes in Ihre ein AndroidManifest Datei. Fügen Sie es direkt über dem ein Anwendung Element-Tag.

  

Damit wird die Erlaubnis zur Nutzung des Internets und zum Lesen des externen Speichers verlangt.

App testen

Starten Sie jetzt Ihre Anwendung! Sie sollten in der Lage sein, ein Bild auszuwählen und es erfolgreich in Firebase hochzuladen. Um das hochgeladene Bild zu bestätigen, gehen Sie zurück zu Ihrer Konsole und checken Sie das ein Dateien Teil Ihres Speichers.

Fazit

Firebase bietet Entwicklern viele Vorteile, darunter auch das Hochladen von Dateien mit Speicherplatz. Um Bilder von Ihrer Android-Anwendung hochzuladen, müssen Sie mit Aktivitäten und Absichten arbeiten. Durch das Befolgen dieses Tutorials haben Sie Ihr Verständnis von Aktivitäten und Absichten vertieft. Ich hoffe, dass es Ihnen gefallen hat!

!