English | 简体中文
A beautiful, customizable Toast library for Kotlin Multiplatform Compose with support for Android, iOS, Desktop, Web, and WASM.
Experience all the Toast features directly in your browser!
- ✅ Kotlin Multiplatform - Works on Android, iOS, Desktop, Web, and WASM
- 🎨 Fully Customizable - Custom colors, icons, and layouts
- 📍 Multiple Positions - Top, Center, Bottom
- ⚡ Action Buttons - Add interactive action buttons to your toasts
- 🔄 Queue Management - Automatic toast queue with smooth transitions
- 🎭 Built-in Types - Success, Error, Warning, Info with default styling
- 🪟 Dialog Support - Works correctly inside Dialogs across all platforms
- 🎯 Type-Safe API - Kotlin-first API with default parameters
Add it in your root build.gradle.kts at the end of repositories:
allprojects {
repositories {
maven { url = uri("https://jitpack.io") }
}
}Or in settings.gradle.kts:
dependencyResolutionManagement {
repositories {
maven { url = uri("https://jitpack.io") }
}
}In your module's build.gradle.kts:
kotlin {
sourceSets {
commonMain {
dependencies {
implementation("com.github.ocnyang:ComposeToast:1.0.0")
}
}
}
}Replace ocnyang with your actual GitHub username and 1.0.0 with the desired version or tag.
@Composable
fun App() {
MaterialTheme {
ProvideToastManager {
YourAppContent()
}
}
}// Success Toast
Toast.showSuccess("Operation completed!")
// Error Toast
Toast.showError("Something went wrong!")
// Warning Toast
Toast.showWarning("Please check your input")
// Info Toast
Toast.showInfo("Processing your request...")
// Custom Toast
Toast.show(
message = "Custom message",
imageVector = Icons.Default.Star,
backgroundColor = Color.Blue,
textColor = Color.White,
duration = 3000L,
position = ToastPosition.TOP
)Toast.show(
message = "Item deleted from cart",
actions = arrayOf(
ActionData("Undo") {
Toast.showSuccess("Action undone!")
}
)
)// Top position
Toast.show("Message at top", position = ToastPosition.TOP)
// Center position
Toast.show("Message at center", position = ToastPosition.CENTER)
// Bottom position (default)
Toast.show("Message at bottom", position = ToastPosition.BOTTOM)Toast.show(
message = "This stays for 6 seconds",
duration = 6000L
)For proper Toast display in Dialogs (especially on Android/iOS):
var showDialog by remember { mutableStateOf(false) }
WithToastComposable(show = showDialog) { toastManager ->
AlertDialog(
onDismissRequest = { showDialog = false },
title = { Text("Dialog Example") },
text = {
DialogToastContent(toastManager = toastManager) {
Text("Click the button to show a toast!")
}
},
confirmButton = {
Button(onClick = {
toastManager.showSuccess("Toast from Dialog!")
}) {
Text("Show Toast")
}
}
)
}You can provide a completely custom Toast layout:
ProvideToastManager(
toastContent = { toastData, maxWidth, onDismiss ->
CustomToastContent(toastData, maxWidth, onDismiss)
}
) {
YourAppContent()
}@Composable
fun MyScreen() {
val toastManager = rememberToastManager()
Button(onClick = {
toastManager.showSuccess("Clicked!")
}) {
Text("Click Me")
}
}Toast.show()- Show custom toastToast.showSuccess()- Show success toastToast.showError()- Show error toastToast.showWarning()- Show warning toastToast.showInfo()- Show info toastToast.clear()- Clear all toasts
Use when you need more control or working with Dialogs:
toastManager.showToast()- Show custom toasttoastManager.showSuccess()- Show success toasttoastManager.showError()- Show error toasttoastManager.showWarning()- Show warning toasttoastManager.showInfo()- Show info toasttoastManager.dismissCurrent()- Dismiss current toasttoastManager.clear()- Clear all toasts
ProvideToastManager- Setup toast manager at app rootWithToastComposable- Provide isolated toast manager for dialogsDialogToastContent- Wrapper for dialog content with toast supportrememberToastManager- Get current toast manager instance
| Platform | Support |
|---|---|
| Android | ✅ |
| iOS | ✅ |
| Desktop | ✅ |
| Web (JS) | ✅ |
| WASM | ✅ |
MIT License - see LICENSE file for details
Contributions are welcome! Please feel free to submit a Pull Request.