SharedFlow for events in Android Kotlin - UI Render Trace

Component - SharedFlow for events

This UI component demonstrates how SharedFlow is used in Android Kotlin to send and receive one-time events, such as showing a message when a button is clicked. SharedFlow allows multiple parts of the app to listen for these events without losing any.

Widget Tree

Activity
└── ConstraintLayout
    ├── Button (Send Event)
    └── TextView (Event Message)

The main screen is an Activity with a ConstraintLayout. Inside, there is a Button labeled 'Send Event' and a TextView that shows messages when events are received.

Render Trace - 4 Steps

Step 1: Activity

Step 2: Button

Step 3: TextView

Step 4: SharedFlow collector

State Change - Re-render

Trigger:User taps the 'Send Event' button

Before

TextView is empty, no event message shown

→

After

TextView shows 'Event received!' message

Re-renders:TextView updates to display the new event message

UI Quiz - 3 Questions

What happens when the 'Send Event' button is clicked?

A The button disappears from the screen

B The app closes immediately

C An event is emitted to the SharedFlow and the TextView updates

D Nothing changes on the screen

Key Insight

Using SharedFlow for events in Android Kotlin helps keep your UI responsive and clean by separating event emission from UI updates. It ensures that all listeners get notified of events like button clicks without missing any, making your app more reliable and easier to maintain.

Practice

1. What is the primary purpose of using SharedFlow in Android Kotlin apps?

easy

A. To manage background threads automatically

B. To store large amounts of data persistently

C. To send events to multiple listeners safely and efficiently

D. To replace all UI components with reactive streams

Solution

1. Step 1: Understand SharedFlow's role

   SharedFlow is designed to broadcast events to multiple collectors without losing any events.

2. Step 2: Compare with other options

   It is not for data storage, UI replacement, or thread management.

3. Final Answer:

   To send events to multiple listeners safely and efficiently -> Option C

4. Quick Check:

   SharedFlow = event broadcasting [OK]

Hint: SharedFlow broadcasts events to many listeners [OK]

Common Mistakes:

• Confusing SharedFlow with data storage solutions
• Thinking SharedFlow manages threads automatically
• Assuming SharedFlow replaces UI components

2. Which of the following is the correct way to emit an event using a MutableSharedFlow named eventFlow?

easy

A. eventFlow.emit("New Event")

B. eventFlow.collect { "New Event" }

C. eventFlow.send("New Event")

D. eventFlow.postValue("New Event")

Solution

1. Step 1: Identify the correct emission method

   MutableSharedFlow uses emit() to send events.

2. Step 2: Eliminate incorrect methods

   collect() is for receiving, send() is for Channels, and postValue() is for LiveData.

3. Final Answer:

   eventFlow.emit("New Event") -> Option A

4. Quick Check:

   Emit events with emit() [OK]

Hint: Use emit() to send events on SharedFlow [OK]

Common Mistakes:

• Using collect() to send events
• Confusing SharedFlow with Channel's send()
• Using LiveData's postValue() with SharedFlow

3. Given the following code snippet, what will be printed when the event is emitted?

val eventFlow = MutableSharedFlow<String>()

fun observe() {
  eventFlow.collect { println(it) }
}

fun sendEvent() {
  eventFlow.emit("Hello")
}

sendEvent()
observe()

medium

A. Compilation error

B. Hello printed twice

C. No output

D. Hello

Solution

1. Step 1: Analyze suspend function calls

   Both emit() and collect() are suspend functions called from non-suspend functions and top-level code without a coroutine scope.

2. Step 2: Result of invalid calls

   Suspend functions cannot be called from non-suspend contexts, causing a compilation error.

3. Final Answer:

   Compilation error -> Option A

4. Quick Check:

   suspend emit/collect outside coroutine = compile error [OK]

Hint: emit() and collect() must be called in coroutines [OK]

Common Mistakes:

• Overlooking that emit() and collect() are suspend functions
• Assuming the code compiles and runs to test replay behavior
• Forgetting coroutine requirements for Flow operations

4. Identify the problem in this code snippet using SharedFlow:

val eventFlow = MutableSharedFlow<String>()

fun start() {
  eventFlow.emit("Start")
}

fun listen() {
  eventFlow.collect { println(it) }
}

start()
listen()

medium

A. No problem, code works fine

B. collect() is called without a coroutine

C. MutableSharedFlow cannot emit strings

D. emit() is called outside a coroutine

Solution

1. Step 1: Check emit() usage

   emit() is a suspend function and must be called inside a coroutine.

2. Step 2: Check collect() usage

   collect() is also suspend and needs a coroutine, but the question focuses on emit() first.

3. Final Answer:

   emit() is called outside a coroutine -> Option D

4. Quick Check:

   emit() requires coroutine context [OK]

Hint: emit() must run inside a coroutine [OK]

Common Mistakes:

• Calling emit() directly without coroutine
• Ignoring suspend nature of collect()
• Thinking MutableSharedFlow restricts data types

5. You want to show a toast message every time a button is clicked using SharedFlow. Which approach correctly ensures the toast shows for each click even if the UI is recreated?

hard

A. Use a MutableSharedFlow with no replay and emit on button click

B. Use a MutableSharedFlow with replay = 1 and emit on button click

C. Use a StateFlow to hold the last toast message and emit on button click

D. Use LiveData to send the toast message on button click

Solution

1. Step 1: Understand event replay needs

   To show toast after UI recreation, events must replay at least once.

2. Step 2: Choose correct flow type and replay

   MutableSharedFlow with replay=1 replays last event to new collectors, ensuring toast shows.

3. Step 3: Compare other options

   No replay means missed events; StateFlow holds state, not events; LiveData is not SharedFlow.

4. Final Answer:

   Use a MutableSharedFlow with replay = 1 and emit on button click -> Option B

5. Quick Check:

   Replay 1 ensures event delivery after UI recreation [OK]

Hint: Set replay=1 to resend last event to new collectors [OK]

Common Mistakes:

• Using no replay and missing events after UI changes
• Confusing StateFlow state with event replay
• Using LiveData instead of SharedFlow for events