Remote Config in Android Kotlin - Mini App: Build & Ship

Build: Remote Config Demo

This screen fetches and applies remote configuration values to update the UI dynamically without app updates.

Target UI

-------------------------
| Remote Config Demo    |
|-----------------------|
| Welcome message:      |
| "Loading..."          |
|                       |
| Button: Fetch Config  |
-------------------------

Display a welcome message text that updates based on remote config value.

Add a button labeled 'Fetch Config' that fetches remote config values when tapped.

Use Firebase Remote Config to fetch a string value with key 'welcome_message'.

Show 'Loading...' initially before fetching config.

Update the welcome message text with the fetched value or default if fetch fails.

Starter Code

Android Kotlin

package com.example.remoteconfigdemo

import android.os.Bundle
import androidx.appcompat.app.AppCompatActivity
import android.widget.Button
import android.widget.TextView

class MainActivity : AppCompatActivity() {
    private lateinit var welcomeTextView: TextView
    private lateinit var fetchButton: Button

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        welcomeTextView = findViewById(R.id.welcomeTextView)
        fetchButton = findViewById(R.id.fetchButton)

        welcomeTextView.text = "Loading..."

        fetchButton.setOnClickListener {
            // TODO: Fetch remote config and update welcomeTextView
        }
    }
}

Task 1

Task 2

Task 3

Task 4

Solution

Android Kotlin

package com.example.remoteconfigdemo

import android.os.Bundle
import androidx.appcompat.app.AppCompatActivity
import android.widget.Button
import android.widget.TextView
import com.google.firebase.remoteconfig.FirebaseRemoteConfig
import com.google.firebase.remoteconfig.FirebaseRemoteConfigSettings

class MainActivity : AppCompatActivity() {
    private lateinit var welcomeTextView: TextView
    private lateinit var fetchButton: Button
    private lateinit var remoteConfig: FirebaseRemoteConfig

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        welcomeTextView = findViewById(R.id.welcomeTextView)
        fetchButton = findViewById(R.id.fetchButton)

        // Initialize Firebase Remote Config
        remoteConfig = FirebaseRemoteConfig.getInstance()

        // Set default values
        val defaults = mapOf("welcome_message" to "Welcome to the app!")
        remoteConfig.setDefaultsAsync(defaults)

        welcomeTextView.text = "Loading..."

        fetchButton.setOnClickListener {
            // Fetch remote config values
            remoteConfig.fetchAndActivate().addOnCompleteListener(this) { task ->
                if (task.isSuccessful) {
                    val message = remoteConfig.getString("welcome_message")
                    welcomeTextView.text = message
                } else {
                    welcomeTextView.text = "Welcome to the app!"
                }
            }
        }
    }
}

We start by initializing the Firebase Remote Config instance. Then, we set a default value for the key "welcome_message" so the app has a fallback message.

When the user taps the 'Fetch Config' button, the app calls fetchAndActivate() to get the latest remote config values from Firebase.

If fetching succeeds, we update the welcome message text with the fetched value. If it fails, we show the default welcome message.

This approach lets the app update text dynamically without needing an app update.

Final Result

Completed Screen

-------------------------
| Remote Config Demo    |
|-----------------------|
| Welcome message:      |
| "Welcome to the app!" |
|                       |
| Button: Fetch Config  |
-------------------------

Initially, the welcome message shows 'Loading...'.

When user taps 'Fetch Config', the app fetches remote config from Firebase.

If successful, the welcome message updates to the fetched string.

If fetch fails, the welcome message shows the default text.

Stretch Goal

Add a loading indicator that shows while fetching remote config values.

💡 Hint

Use a ProgressBar view and toggle its visibility before and after fetch.