Skip to content

Modernize chat example #5594

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
kropp wants to merge 2 commits into
base: master
Choose a base branch
from
Open

Modernize chat example #5594

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
9adad53
modernize chat example
kropp May 6, 2026
4e9b290
move dependencies to Gradle version catalog
kropp May 6, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 3 additions & 0 deletions examples/chat/gradle/libs.versions.toml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,9 @@ compose = "1.9.1"
kotlinxDatetime = "0.5.0"

[libraries]
activity-compose = { module = "androidx.activity:activity-compose", version = "1.7.2" }
appcompat = { module = "androidx.appcompat:appcompat", version = "1.6.1" }
core-ktx = { module = "androidx.core:core-ktx", version = "1.10.1" }
compose-ui = { module = "org.jetbrains.compose.ui:ui", version.ref = "compose" }
kotlinx-datetime = { module = "org.jetbrains.kotlinx:kotlinx-datetime", version.ref = "kotlinxDatetime" }
compose-desktop = { module = "org.jetbrains.compose.desktop:desktop", version.ref = "compose" }
Expand Down
4 changes: 0 additions & 4 deletions examples/chat/iosApp/iosApp.xcodeproj/project.pbxproj
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,6 @@
/* Begin PBXBuildFile section */
184880BA0E9910C2B5012412 /* KotlinToSwiftHelper.swift in Sources */ = {isa = PBXBuildFile; fileRef = 18488D89B8500CD7696A04EB /* KotlinToSwiftHelper.swift */; };
1848810122D49D4AD3668D91 /* ComposeViewControllerToSwiftUI.swift in Sources */ = {isa = PBXBuildFile; fileRef = 18488656503C85EEDA66341D /* ComposeViewControllerToSwiftUI.swift */; };
184881FBE98BA5BF02A0A186 /* GradientTemplate.swift in Sources */ = {isa = PBXBuildFile; fileRef = 1848892FA748717E4087E7D7 /* GradientTemplate.swift */; };
1848823F43E447F9A8B4AC7C /* YetAnotherSwiftUIScreen.swift in Sources */ = {isa = PBXBuildFile; fileRef = 18488451271FAAD8FA34A2FB /* YetAnotherSwiftUIScreen.swift */; };
184882D8AF2A7A3642004010 /* ComposeInsideSwiftUIScreen.swift in Sources */ = {isa = PBXBuildFile; fileRef = 18488CAB0978B80826E5BBB4 /* ComposeInsideSwiftUIScreen.swift */; };
2152FB042600AC8F00CF470E /* iOSApp.swift in Sources */ = {isa = PBXBuildFile; fileRef = 2152FB032600AC8F00CF470E /* iOSApp.swift */; };
Expand All @@ -19,7 +18,6 @@
/* Begin PBXFileReference section */
18488451271FAAD8FA34A2FB /* YetAnotherSwiftUIScreen.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = YetAnotherSwiftUIScreen.swift; sourceTree = "<group>"; };
18488656503C85EEDA66341D /* ComposeViewControllerToSwiftUI.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = ComposeViewControllerToSwiftUI.swift; sourceTree = "<group>"; };
1848892FA748717E4087E7D7 /* GradientTemplate.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = GradientTemplate.swift; sourceTree = "<group>"; };
18488CAB0978B80826E5BBB4 /* ComposeInsideSwiftUIScreen.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = ComposeInsideSwiftUIScreen.swift; sourceTree = "<group>"; };
18488D89B8500CD7696A04EB /* KotlinToSwiftHelper.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = KotlinToSwiftHelper.swift; sourceTree = "<group>"; };
2152FB032600AC8F00CF470E /* iOSApp.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = iOSApp.swift; sourceTree = "<group>"; };
Expand Down Expand Up @@ -66,7 +64,6 @@
18488D89B8500CD7696A04EB /* KotlinToSwiftHelper.swift */,
18488CAB0978B80826E5BBB4 /* ComposeInsideSwiftUIScreen.swift */,
18488451271FAAD8FA34A2FB /* YetAnotherSwiftUIScreen.swift */,
1848892FA748717E4087E7D7 /* GradientTemplate.swift */,
3251B1332AA8C2AA001521C0 /* ContentView.swift */,
);
path = iosApp;
Expand Down Expand Up @@ -176,7 +173,6 @@
184880BA0E9910C2B5012412 /* KotlinToSwiftHelper.swift in Sources */,
184882D8AF2A7A3642004010 /* ComposeInsideSwiftUIScreen.swift in Sources */,
1848823F43E447F9A8B4AC7C /* YetAnotherSwiftUIScreen.swift in Sources */,
184881FBE98BA5BF02A0A186 /* GradientTemplate.swift in Sources */,
);
runOnlyForDeploymentPostprocessing = 0;
};
Expand Down
8 changes: 5 additions & 3 deletions examples/chat/iosApp/iosApp/ComposeInsideSwiftUIScreen.swift
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,9 +14,11 @@ struct ComposeInsideSwiftUIScreen: View {

struct ComposeLayer: View {
var body: some View {
GradientTemplate(title: "The Composers Chat") {
NavigationView {
ComposeViewControllerToSwiftUI()
.ignoresSafeArea(.keyboard) // Compose have own keyboard handler
.ignoresSafeArea() // Extend Compose background behind nav title and tab bar; Compose handles its own keyboard
.navigationTitle("The Composers Chat")
.navigationBarTitleDisplayMode(.inline)
}
}
}
Expand All @@ -29,7 +31,7 @@ struct TextInputLayer: View {
VStack {
Spacer()
HStack {
TextField("Type message...", text: $textState, axis: .vertical)
TextField("Type message…", text: $textState, axis: .vertical)
.focused($textFieldFocused)
.lineLimit(3)
if (!textState.isEmpty) {
Expand Down
26 changes: 0 additions & 26 deletions examples/chat/iosApp/iosApp/GradientTemplate.swift
View file
Open in desktop

This file was deleted.

4 changes: 3 additions & 1 deletion examples/chat/iosApp/iosApp/YetAnotherSwiftUIScreen.swift
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,10 +2,12 @@ import SwiftUI

struct YetAnotherSwiftUIScreen: View {
var body: some View {
GradientTemplate(title: "SwiftUI") {
NavigationView {
VStack {
Text("Yet another SwiftUI screen")
}
}
.navigationTitle("Swift UI View")
.navigationBarTitleDisplayMode(.inline)
}
}
4 changes: 2 additions & 2 deletions examples/chat/jsApp/build.gradle.kts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,8 +13,8 @@ kotlin {
val jsMain by getting {
dependencies {
implementation(project(":shared"))
implementation(compose.ui)
implementation(compose.foundation)
implementation(libs.compose.ui)
implementation(libs.compose.foundation)
}
}
}
Expand Down
6 changes: 3 additions & 3 deletions examples/chat/shared/build.gradle.kts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -59,9 +59,9 @@ kotlin {
}
val androidMain by getting {
dependencies {
api("androidx.activity:activity-compose:1.7.2")
api("androidx.appcompat:appcompat:1.6.1")
api("androidx.core:core-ktx:1.10.1")
api(libs.activity.compose)
api(libs.appcompat)
api(libs.core.ktx)
}
}
val iosMain by creating {
Expand Down
Binary file modified examples/chat/shared/src/commonMain/composeResources/drawable/background.jpg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
9 changes: 7 additions & 2 deletions examples/chat/shared/src/commonMain/kotlin/ChatApp.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
import androidx.compose.foundation.Image
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.PaddingValues
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.material.LocalTextStyle
import androidx.compose.material.MaterialTheme
Expand All @@ -17,6 +18,7 @@ import androidx.compose.runtime.getValue
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import chat_mpp.shared.generated.resources.*
import chat_mpp.shared.generated.resources.Res
Expand Down Expand Up @@ -64,7 +66,10 @@ fun ChatAppWithScaffold(displayTextField: Boolean = true) {

@OptIn(ExperimentalResourceApi::class)
@Composable
fun ChatApp(displayTextField: Boolean = true) {
fun ChatApp(
displayTextField: Boolean = true,
contentPadding: PaddingValues = PaddingValues(0.dp),
) {
val state by store.stateFlow.collectAsState()
Theme {
Surface {
Expand All @@ -74,7 +79,7 @@ fun ChatApp(displayTextField: Boolean = true) {
modifier = Modifier.fillMaxSize()
) {
Box(Modifier.weight(1f)) {
Messages(state.messages)
Messages(state.messages, contentPadding = contentPadding)
}
if (displayTextField) {
SendMessage { text ->
Expand Down
7 changes: 6 additions & 1 deletion examples/chat/shared/src/commonMain/kotlin/Messages.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
import androidx.compose.foundation.Image
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.PaddingValues
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.height
Expand All @@ -23,7 +24,10 @@ import org.jetbrains.compose.resources.ExperimentalResourceApi
import org.jetbrains.compose.resources.painterResource

@Composable
internal inline fun Messages(messages: List<Message>) {
internal inline fun Messages(
messages: List<Message>,
contentPadding: PaddingValues = PaddingValues(0.dp),
) {
val listState = rememberLazyListState()
if (messages.isNotEmpty()) {
LaunchedEffect(messages.last()) {
Expand All @@ -32,6 +36,7 @@ internal inline fun Messages(messages: List<Message>) {
}
LazyColumn(
modifier = Modifier.fillMaxSize().padding(start = 4.dp, end = 4.dp),
contentPadding = contentPadding,
verticalArrangement = Arrangement.spacedBy(8.dp),
state = listState,
) {
Expand Down
8 changes: 7 additions & 1 deletion examples/chat/shared/src/iosMain/kotlin/main.ios.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,8 +1,14 @@
import androidx.compose.foundation.layout.WindowInsets
import androidx.compose.foundation.layout.asPaddingValues
import androidx.compose.foundation.layout.systemBars
import androidx.compose.ui.window.ComposeUIViewController
import platform.UIKit.UIViewController

fun ChatViewController(): UIViewController = ComposeUIViewController {
ChatApp(displayTextField = false)
ChatApp(
displayTextField = false,
contentPadding = WindowInsets.systemBars.asPaddingValues(),
)
}

fun sendMessage(text: String) {
Expand Down
Loading