Google 致力于为黑人社区推动种族平等。查看具体举措
Diese Seite wurde von der Cloud Translation API übersetzt.
Switch to English

Firebase Android Codelab - Erstellen Sie einen freundlichen Chat

Bildschirmfoto

Bild: Arbeitsfreundliche Chat-App.

Willkommen im Codelab des freundlichen Chats. In diesem Codelab erfahren Sie, wie Sie mithilfe der Firebase-Plattform eine Chat-App für Android erstellen.

Was du lernen wirst

  • Verwendung der Firebase-Authentifizierung, um Benutzern die Anmeldung zu ermöglichen.
  • So synchronisieren Sie Daten mithilfe der Firebase-Echtzeitdatenbank.
  • Speichern von Binärdateien in Firebase Storage.

Was du brauchen wirst

  • Android Studio Version 4.0+.
  • Ein Android-Gerät oder Emulator mit Android 4.4+.
  • Vertrautheit mit der Programmiersprache Kotlin.

Klonen Sie das Repository

Klonen Sie das GitHub-Repository über die Befehlszeile:

$ git clone https://github.com/firebase/codelab-friendlychat-android

In Android Studio importieren

Klicken Sie in Android Studio auf Datei > Öffnen und wählen Sie das Verzeichnis build-android-start ( android_studio_folder ) aus dem Verzeichnis, in das Sie den Beispielcode heruntergeladen haben.

Sie sollten jetzt das build-android-start Projekt in Android Studio geöffnet haben. Machen Sie sich keine Sorgen, wenn eine Warnung google-services.json Datei google-services.json fehlt. Es wird im nächsten Schritt hinzugefügt.

Überprüfen Sie die Abhängigkeiten

In diesem Codelab wurden bereits alle Abhängigkeiten hinzugefügt, die Sie benötigen. Es ist jedoch wichtig zu verstehen, wie Sie das Firebase SDK zu Ihrer App hinzufügen:

build.gradle

buildscript {
    // ...

    dependencies {
        classpath 'com.android.tools.build:gradle:4.1.2'

        // The google-services plugin is required to parse the google-services.json file
        classpath 'com.google.gms:google-services:4.3.5'
        classpath 'com.google.firebase:firebase-crashlytics-gradle:2.5.1'
    }
}

app / build.gradle

plugins {
    id 'com.android.application'
    id 'kotlin-android'
    id 'com.google.firebase.crashlytics'
}

android {
    // ...
}

dependencies {
    // ...

    // Google Sign In SDK
    implementation 'com.google.android.gms:play-services-auth:19.0.0'

    // Firebase SDK
    implementation platform('com.google.firebase:firebase-bom:26.6.0')
    implementation 'com.google.firebase:firebase-database-ktx'
    implementation 'com.google.firebase:firebase-storage-ktx'
    implementation 'com.google.firebase:firebase-auth-ktx'

    // Firebase UI Library
    implementation 'com.firebaseui:firebase-ui-database:7.1.1'
}

// Apply the 'google-services' plugin
apply plugin: 'com.google.gms.google-services'

In diesem Schritt erstellen Sie ein Firebase-Projekt, das während dieses Codelabs verwendet werden soll, und fügen die Projektkonfiguration Ihrer App hinzu.

Erstellen Sie ein neues Projekt

  1. Gehen Sie in Ihrem Browser zur Firebase-Konsole .
  2. Wählen Sie Projekt hinzufügen .
  3. Wählen Sie einen Projektnamen aus oder geben Sie ihn ein. Sie können einen beliebigen Namen verwenden.
  4. Sie benötigen Google Analytics für dieses Projekt nicht, sodass Sie es deaktivieren können, wenn Sie dazu aufgefordert werden.
  5. Klicken Sie auf Projekt erstellen und wenn Ihr Projekt fertig ist, klicken Sie auf Weiter

Fügen Sie Ihrer App Firebase hinzu

Bevor Sie mit diesem Schritt beginnen, rufen Sie den SHA1-Hash Ihrer App ab: Führen Sie den folgenden Befehl im Projektverzeichnis aus, um den SHA1 Ihres Debug-Schlüssels zu ermitteln:

./gradlew signingReport

Store: /Users/<username>/.android/debug.keystore
Alias: AndroidDebugKey
MD5: A5:88:41:04:8F:06:59:6A:AE:33:76:87:AA:AD:19:23
SHA1: A7:89:F5:06:A8:07:A1:22:EC:90:6A:A6:EA:C3:D4:8B:3A:30:AB:18
SHA-256: 05:A2:2A:35:EE:F2:51:23:72:4D:72:67:A5:6A:8A:58:22:2C:00:A6:AB:F6:45:D5:A1:82:D8:90:A4:69:C8:FE
Valid until: Wednesday, August 10, 2044

Sie sollten eine Ausgabe wie oben sehen, die wichtige Zeile ist die SHA1 Taste. Wenn Sie Ihren SHA1-Hash nicht finden können, finden Sie auf dieser Seite weitere Informationen.

Führen Sie nun in der Firebase-Konsole die folgenden Schritte aus, um Ihrem Projekt eine Android-App hinzuzufügen:

  1. Klicken Sie im Übersichtsbild Ihres neuen Projekts auf das Android-Symbol, um den Setup-Workflow zu starten: Android App hinzufügen
  2. com.google.firebase.codelab.friendlychat Sie im nächsten Bildschirm com.google.firebase.codelab.friendlychat als Paketnamen für Ihre App ein.
  3. Klicken Sie auf Registrieren App und klicken Sie auf Download von Google-services.json die zum Download google-services - Konfigurationsdatei.
  4. Kopieren Sie die Datei google-services.json in das app Verzeichnis Ihres Projekts. Nachdem die Datei heruntergeladen wurde, können Sie die nächsten in der Konsole angezeigten Schritte überspringen (sie wurden bereits im Build-Android-Start-Projekt für Sie ausgeführt).
  5. Um sicherzustellen, dass alle Abhängigkeiten für Ihre App verfügbar sind, sollten Sie Ihr Projekt an dieser Stelle mit Gradle-Dateien synchronisieren. Wählen Sie in der Android Studio-Symbolleiste Datei > Projekt mit Gradle-Dateien synchronisieren.

Nachdem Sie das Projekt in Android Studio importiert und das google-services Plugin mit Ihrer JSON-Datei konfiguriert haben, können Sie die App zum ersten Mal ausführen.

  1. Starten Sie Ihr Android-Gerät oder Ihren Emulator.
  2. Klicken Sie in Android Studio auf Ausführen (ausführen ) in der Symbolleiste.

Die App sollte auf Ihrem Gerät gestartet werden. Zu diesem Zeitpunkt sollte eine leere Nachrichtenliste angezeigt werden, und das Senden und Empfangen von Nachrichten funktioniert nicht. Im nächsten Abschnitt authentifizieren Sie Benutzer, damit sie den freundlichen Chat verwenden können.

Diese App verwendet die Firebase-Echtzeitdatenbank, um alle Chat-Nachrichten zu speichern. Bevor wir Daten hinzufügen, sollten wir sicherstellen, dass die App sicher ist und nur authentifizierte Benutzer Nachrichten posten können. In diesem Schritt aktivieren wir die Firebase-Authentifizierung und konfigurieren die Sicherheitsregeln für Echtzeitdatenbanken.

Konfigurieren Sie die Firebase-Authentifizierung

Bevor Ihre Anwendung im Namen Ihrer Benutzer auf die Firebase-Authentifizierungs-APIs zugreifen kann, müssen Sie sie aktivieren

  1. Navigieren Sie zur Firebase-Konsole und wählen Sie Ihr Projekt aus
  2. Wählen Sie Authentifizierung
  3. Wählen Sie das Anmelden Registerkarte Methode
  4. Schalten Sie den Google- Schalter auf aktiviert (blau).
  5. Legen Sie eine Support-E-Mail fest.
  6. Drücken Sie im daraufhin angezeigten Dialogfeld auf Speichern

Wenn Sie später in diesem Codelab Fehler mit der Meldung "CONFIGURATION_NOT_FOUND" erhalten, kehren Sie zu diesem Schritt zurück und überprüfen Sie Ihre Arbeit.

Konfigurieren Sie die Echtzeitdatenbank

Wie bereits erwähnt, speichert diese App Chat-Nachrichten in der Firebase-Echtzeitdatenbank. In diesem Schritt erstellen wir eine Datenbank und konfigurieren die Sicherheit über eine JSON-Konfigurationssprache namens Sicherheitsregeln.

  1. Gehen Sie in der Firebase-Konsole zu Ihrem Projekt und wählen Sie in der linken Navigation Echtzeitdatenbank aus.
  2. Klicken Sie auf Datenbank erstellen, erstellen Sie eine neue Echtzeitdatenbankinstanz, wählen Sie die Region us-central1 und klicken Sie auf Weiter .
  3. Wenn Sie zu Sicherheitsregeln aufgefordert werden, wählen Sie den gesperrten Modus und klicken Sie auf Aktivieren .

Wählen Sie nach dem Erstellen der Datenbank die Registerkarte Regeln und aktualisieren Sie die Regelkonfiguration wie folgt:

{
  "rules": {
    "messages": {
      ".read": "auth.uid != null",
      ".write": "auth.uid != null"
    }
  }
}

Klicken Sie auf "Veröffentlichen", um die neuen Regeln zu veröffentlichen.

Weitere Informationen zur Funktionsweise (einschließlich der Dokumentation zur Variablen "auth") finden Sie in der Firebase- Sicherheitsdokumentation .

Fügen Sie grundlegende Anmeldefunktionen hinzu

Als Nächstes fügen wir der App einen grundlegenden Firebase-Authentifizierungscode hinzu, um Benutzer zu erkennen und einen Anmeldebildschirm zu implementieren.

Suchen Sie nach dem aktuellen Benutzer

MainActivity.kt der MainActivity.kt Klasse zunächst die folgende Instanzvariable MainActivity.kt :

MainActivity.kt

// Firebase instance variables
private lateinit var auth: FirebaseAuth

Ändern Sie nun MainActivity , um den Benutzer zum MainActivity zu senden, wenn er die App öffnet und nicht authentifiziert ist. Fügen Sie der onCreate() -Methode Folgendes hinzu, nachdem die binding an die Ansicht angehängt wurde:

MainActivity.kt

// Initialize Firebase Auth and check if the user is signed in
auth = Firebase.auth
if (auth.currentUser == null) {
    // Not signed in, launch the Sign In activity
    startActivity(Intent(this, SignInActivity::class.java))
    finish()
    return
}

Wir möchten auch überprüfen, ob der Benutzer während onStart() :

MainActivity.kt

public override fun onStart() {
    super.onStart()
    // Check if user is signed in.
    if (auth.currentUser == null) {
        // Not signed in, launch the Sign In activity
        startActivity(Intent(this, SignInActivity::class.java))
        finish()
        return
    }
}

Implementieren Sie dann die getUserPhotoUrl() und getUserName() , um die entsprechenden Informationen zum aktuell authentifizierten Firebase-Benutzer zurückzugeben:

MainActivity.kt

private fun getPhotoUrl(): String? {
    val user = auth.currentUser
    return user?.photoUrl?.toString()
}

private fun getUserName(): String? {
    val user = auth.currentUser
    return if (user != null) {
        user.displayName
    } else ANONYMOUS
}

Implementieren Sie dann die signOut() -Methode, um die signOut() zu handhaben:

MainActivity.kt

private fun signOut() {
    auth.signOut()
    signInClient.signOut()
    startActivity(Intent(this, SignInActivity::class.java))
    finish()
}

Jetzt verfügen wir über die gesamte Logik, um den Benutzer bei Bedarf zum Anmeldebildschirm zu senden. Als nächstes müssen wir den Anmeldebildschirm implementieren, um Benutzer ordnungsgemäß zu authentifizieren.

Implementieren Sie den Anmeldebildschirm

Öffnen Sie die Datei SignInActivity.kt . Hier wird eine einfache Anmeldeschaltfläche verwendet, um die Authentifizierung zu initiieren. In diesem Schritt implementieren Sie die Logik für die Anmeldung bei Google und verwenden dann dieses Google-Konto, um sich bei Firebase zu authentifizieren.

Fügen Sie eine Auth-Instanzvariable in der SignInActivity Klasse unter dem Kommentar // Firebase instance variables :

SignInActivity.kt

// Firebase instance variables
private lateinit var auth: FirebaseAuth

Bearbeiten Sie anschließend die onCreate() -Methode, um Firebase auf dieselbe Weise wie in MainActivity zu initialisieren:

SignInActivity.kt

// Initialize FirebaseAuth
auth = Firebase.auth

Starten Sie als Nächstes die Anmeldung bei Google. Aktualisieren Sie die signIn() -Methode so, dass sie folgendermaßen aussieht:

SignInActivity.kt

private fun signIn() {
    val signInIntent = signInClient.signInIntent
    startActivityForResult(signInIntent, RC_SIGN_IN)
}

Implementieren Sie als onActivityResult() Methode onActivityResult() , um das onActivityResult() zu verarbeiten. Wenn das Ergebnis der Google-Anmeldung erfolgreich war, verwenden Sie das Konto zur Authentifizierung bei Firebase:

SignInActivity.kt

public override fun onActivityResult(requestCode: Int, resultCode: Int, data: Intent?) {
    super.onActivityResult(requestCode, resultCode, data)

    // Result returned from launching the Intent in signIn()
    if (requestCode == RC_SIGN_IN) {
        val task = GoogleSignIn.getSignedInAccountFromIntent(data)
        try {
            // Google Sign In was successful, authenticate with Firebase
            val account = task.getResult(ApiException::class.java)
            firebaseAuthWithGoogle(account)
        } catch (e: ApiException) {
            // Google Sign In failed, update UI appropriately
            Log.w(TAG, "Google sign in failed", e)
        }
    }
}

Implementieren Sie die Methode firebaseAuthWithGoogle() , um sich mit dem in Google angemeldeten Konto zu authentifizieren:

SignInActivity.kt

private fun firebaseAuthWithGoogle(acct: GoogleSignInAccount?) {
    Log.d(TAG, "firebaseAuthWithGoogle:" + acct?.id)
    val credential = GoogleAuthProvider.getCredential(acct?.idToken, null)
    auth.signInWithCredential(credential)
        .addOnSuccessListener(this) {
            // If sign in succeeds the auth state listener will be notified and logic to
            // handle the signed in user can be handled in the listener.
            Log.d(TAG, "signInWithCredential:success")
            startActivity(Intent(this@SignInActivity, MainActivity::class.java))
            finish()
        }
        .addOnFailureListener(this) { e -> // If sign in fails, display a message to the user.
            Log.w(TAG, "signInWithCredential", e)
            Toast.makeText(
                this@SignInActivity, "Authentication failed.",
                Toast.LENGTH_SHORT
            ).show()
        }
}

Das ist es! Sie haben die Authentifizierung mit Google als Identitätsanbieter in nur wenigen Methodenaufrufen implementiert, ohne dass eine serverseitige Konfiguration verwaltet werden muss.

Testen Sie Ihre Arbeit

Führen Sie die App auf Ihrem Gerät aus. Sie sollten sofort zum Anmeldebildschirm weitergeleitet werden. Tippen Sie auf die Google-Anmeldeschaltfläche. Sie sollten dann zum Nachrichtenbildschirm weitergeleitet werden, wenn alles gut funktioniert hat.

In diesem Schritt fügen wir Funktionen zum Lesen und Anzeigen von Nachrichten hinzu, die in der Echtzeitdatenbank gespeichert sind.

Beispielnachrichten importieren

  1. Wählen Sie in der Firebase-Konsole im linken Navigationsmenü die Option Echtzeitdatenbank aus.
  2. Wählen Sie im Überlaufmenü der Registerkarte Daten die Option JSON importieren .
  3. Navigieren Sie zur Datei initial_messages.json im Stammverzeichnis des geklonten Repositorys und wählen Sie sie aus.
  4. Klicken Sie auf Importieren .

Daten lesen

Nachrichten synchronisieren

In diesem Abschnitt fügen wir Code hinzu, der neu hinzugefügte Nachrichten zur App-Benutzeroberfläche synchronisiert, indem:

  • Initialisieren der Firebase-Echtzeitdatenbank und Hinzufügen eines Listeners, um Änderungen an den Daten zu verarbeiten.
  • Aktualisieren des RecyclerView Adapters, damit neue Nachrichten angezeigt werden.
  • Hinzufügen der Datenbankinstanzvariablen zu Ihren anderen Firebase-Instanzvariablen in der MainActivity Klasse:

MainActivity.kt

// Firebase instance variables
// ...
private lateinit var db: FirebaseDatabase
private lateinit var adapter: FriendlyMessageAdapter

Ändern Sie die onCreate() -Methode Ihrer MainActivity unter dem Kommentar // Initialize Realtime Database and FirebaseRecyclerAdapter mit dem unten definierten Code. Dieser Code fügt alle vorhandenen Nachrichten aus der Echtzeitdatenbank hinzu und wartet dann auf neue untergeordnete Einträge unter dem messages in Ihrer Firebase-Echtzeitdatenbank. Für jede Nachricht wird der Benutzeroberfläche ein neues Element hinzugefügt:

MainActivity.kt

// Initialize Realtime Database
db = Firebase.database
val messagesRef = db.reference.child(MESSAGES_CHILD)

// The FirebaseRecyclerAdapter class and options come from the FirebaseUI library
// See: https://github.com/firebase/FirebaseUI-Android
val options = FirebaseRecyclerOptions.Builder<FriendlyMessage>()
    .setQuery(messagesRef, FriendlyMessage::class.java)
    .build()
adapter = FriendlyMessageAdapter(options, getUserName())
binding.progressBar.visibility = ProgressBar.INVISIBLE
manager = LinearLayoutManager(this)
manager.stackFromEnd = true
binding.messageRecyclerView.layoutManager = manager
binding.messageRecyclerView.adapter = adapter

// Scroll down when a new message arrives
// See MyScrollToBottomObserver for details
adapter.registerAdapterDataObserver(
    MyScrollToBottomObserver(binding.messageRecyclerView, adapter, manager)
)

Implementieren Sie als Nächstes in der FriendlyMessageAdapter.kt Klasse die bind() -Methode in der inneren Klasse MessageViewHolder() :

FriendlyMessageAdapter.kt

inner class MessageViewHolder(private val binding: MessageBinding) : ViewHolder(binding.root) {
    fun bind(item: FriendlyMessage) {
        binding.messageTextView.text = item.text
        setTextColor(item.name, binding.messageTextView)

        binding.messengerTextView.text = if (item.name == null) ANONYMOUS else item.name
        if (item.photoUrl != null) {
            loadImageIntoView(binding.messengerImageView, item.photoUrl!!)
        } else {
            binding.messengerImageView.setImageResource(R.drawable.ic_account_circle_black_36dp)
        }
    }
    ...
}

Wir müssen auch Nachrichten anzeigen, die Bilder sind. Implementieren Sie daher auch die bind() -Methode in der inneren Klasse ImageMessageViewHolder() :

FriendlyMessageAdapter.kt

inner class ImageMessageViewHolder(private val binding: ImageMessageBinding) :
    ViewHolder(binding.root) {
    fun bind(item: FriendlyMessage) {
        loadImageIntoView(binding.messageImageView, item.imageUrl!!)

        binding.messengerTextView.text = if (item.name == null) ANONYMOUS else item.name
        if (item.photoUrl != null) {
            loadImageIntoView(binding.messengerImageView, item.photoUrl!!)
        } else {
            binding.messengerImageView.setImageResource(R.drawable.ic_account_circle_black_36dp)
        }
    }
}

Starten und beenden Sie schließlich in MainActivity Abhören von Updates aus der Firebase-Echtzeitdatenbank. Aktualisieren Sie die onPause() und onResume() in MainActivity wie MainActivity :

MainActivity.kt

public override fun onPause() {
    adapter.stopListening()
    super.onPause()
}

public override fun onResume() {
    super.onResume()
    adapter.startListening()
}

Testnachrichtensynchronisierung

  1. Klicken Sie auf Ausführen (ausführen ).
  2. Kehren Sie in der Firebase-Konsole zum Abschnitt Echtzeitdatenbank zurück und fügen Sie manuell eine neue Nachricht mit der ID -ABCD . Bestätigen Sie, dass die Nachricht in Ihrer Android-App angezeigt wird:

Herzlichen Glückwunsch, Sie haben Ihrer App gerade eine Echtzeitdatenbank hinzugefügt!

Implementieren Sie das Senden von Textnachrichten

In diesem Abschnitt fügen Sie App-Benutzern die Möglichkeit hinzu, Textnachrichten zu senden. Das folgende Codefragment wartet auf Klickereignisse auf der Schaltfläche "Senden", erstellt ein neues FriendlyMessage Objekt mit dem Inhalt des Nachrichtenfelds und sendet die Nachricht an die Datenbank. Die push() -Methode fügt dem Pfad des push() Objekts eine automatisch generierte ID hinzu. Diese IDs sind sequentiell, wodurch sichergestellt wird, dass die neuen Nachrichten am Ende der Liste hinzugefügt werden.

Aktualisieren Sie den Klick-Listener der Schaltfläche "Senden" in der Methode " onCreate() " in der MainActivity Klasse. Dieser Code befindet sich bereits am Ende der onCreate() -Methode. Aktualisieren Sie den onClick() Body so, dass er mit dem folgenden Code übereinstimmt:

MainActivity.kt

// Disable the send button when there's no text in the input field
// See MyButtonObserver for details
binding.messageEditText.addTextChangedListener(MyButtonObserver(binding.sendButton))

// When the send button is clicked, send a text message
binding.sendButton.setOnClickListener {
    val friendlyMessage = FriendlyMessage(
        binding.messageEditText.text.toString(),
        getUserName(),
        getPhotoUrl(),
        null /* no image */
    )
    db.reference.child(MESSAGES_CHILD).push().setValue(friendlyMessage)
    binding.messageEditText.setText("")
}

Implementieren Sie das Senden von Bildnachrichten

In diesem Abschnitt fügen Sie App-Benutzern die Möglichkeit hinzu, Bildnachrichten zu senden. Das Erstellen einer Bildnachricht erfolgt mit den folgenden Schritten:

  • Bild auswählen
  • Bildauswahl handhaben
  • Schreiben Sie eine temporäre Bildnachricht in die Echtzeitdatenbank
  • Beginnen Sie mit dem Hochladen des ausgewählten Bildes
  • Aktualisieren Sie die URL der Bildnachricht nach Abschluss des Uploads auf die des hochgeladenen Bildes

Bild auswählen

Um Bilder hinzuzufügen, verwendet dieses Codelab Cloud Storage for Firebase. Cloud Storage ist ein guter Ort, um die Binärdaten Ihrer App zu speichern.

Wählen Sie in der Firebase-Konsole im linken Navigationsbereich Speicher aus. Klicken Sie anschließend auf Erste Schritte , um den Cloud-Speicher für Ihr Projekt zu aktivieren. Befolgen Sie die Schritte in der Eingabeaufforderung anhand der vorgeschlagenen Standardeinstellungen.

Behandeln Sie die Bildauswahl und schreiben Sie eine temporäre Nachricht

Sobald der Benutzer ein Bild ausgewählt hat, wird startActivityForResult() aufgerufen. Dies ist bereits im Code am Ende der onCreate() -Methode onCreate() . Es startet die MainActivity ‚s onActivityResult() Methode. Mit dem folgenden Codefragment schreiben Sie eine Nachricht mit einer temporären Bild-URL in die Datenbank, die angibt, dass das Bild hochgeladen wird.

MainActivity.kt

override fun onActivityResult(requestCode: Int, resultCode: Int, data: Intent?) {
    super.onActivityResult(requestCode, resultCode, data)
    Log.d(TAG, "onActivityResult: requestCode=$requestCode, resultCode=$resultCode")
    if (requestCode == REQUEST_IMAGE) {
        if (resultCode == RESULT_OK && data != null) {
            val uri = data.data
            Log.d(TAG, "Uri: " + uri.toString())
            val user = auth.currentUser
            val tempMessage =
                FriendlyMessage(null, getUserName(), getPhotoUrl(), LOADING_IMAGE_URL)
            db.reference.child(MESSAGES_CHILD).push()
                .setValue(
                    tempMessage,
                    DatabaseReference.CompletionListener { databaseError, databaseReference ->
                        if (databaseError != null) {
                            Log.w(
                                TAG, "Unable to write message to database.",
                                        databaseError.toException()
                                    )
                                    return@CompletionListener
                                }

                                // Build a StorageReference and then upload the file
                                val key = databaseReference.key
                                val storageReference = Firebase.storage
                                    .getReference(user!!.uid)
                                    .child(key!!)
                                    .child(uri!!.lastPathSegment!!)
                                putImageInStorage(storageReference, uri, key)
                            })
        }
    }
}

Laden Sie das Bild hoch und aktualisieren Sie die Nachricht

Fügen Sie putImageInStorage() die Methode putImageInStorage() MainActivity . Es wird in onActivityResult() aufgerufen, um den Upload des ausgewählten Bildes zu onActivityResult() . Sobald der Upload abgeschlossen ist, aktualisieren Sie die Nachricht, um das entsprechende Bild zu verwenden.

MainActivity.kt

private fun putImageInStorage(storageReference: StorageReference, uri: Uri, key: String?) {
    // First upload the image to Cloud Storage
    storageReference.putFile(uri)
        .addOnSuccessListener(
            this
        ) { taskSnapshot -> // After the image loads, get a public downloadUrl for the image
            // and add it to the message.
            taskSnapshot.metadata!!.reference!!.downloadUrl
                .addOnSuccessListener { uri ->
                    val friendlyMessage =
                        FriendlyMessage(null, getUserName(), getPhotoUrl(), uri.toString())
                    db.reference
                        .child(MESSAGES_CHILD)
                        .child(key!!)
                        .setValue(friendlyMessage)
                }
        }
        .addOnFailureListener(this) { e ->
            Log.w(
                TAG,
                "Image upload task was unsuccessful.",
                e
            )
        }
}

Testen Sie das Senden von Nachrichten

  1. Drücke denausführen Schaltfläche " Ausführen" .
  2. Geben Sie eine Nachricht ein und klicken Sie auf die Schaltfläche "Senden". Die neue Nachricht sollte in der App-Benutzeroberfläche und in der Firebase-Konsole sichtbar sein.
  3. Tippen Sie auf das Bild "+", um ein Bild von Ihrem Gerät auszuwählen. Die neue Nachricht sollte zuerst mit einem Platzhalterbild und dann mit dem ausgewählten Bild sichtbar sein, sobald der Bild-Upload abgeschlossen ist. Die neue Nachricht sollte auch in der Firebase-Konsole, als Objekt in der Datenbank und als Blob im Speicher sichtbar sein.

Sie haben gerade eine Echtzeit-Chat-Anwendung mit Firebase erstellt!

Was du gelernt hast

  • Firebase-Authentifizierung
  • Firebase-Echtzeitdatenbank
  • Cloud-Speicher für Firebase

Versuchen Sie als Nächstes, Firebase zu Ihrer eigenen Android-App hinzuzufügen! Um mehr über Firebase zu erfahren, besuchen Sie firebase.google.com