DEV Community

Cover image for CMPToast: Toasts for Compose Multiplatform Projects
Mobile innovation Network
Mobile innovation Network

Posted on

4

CMPToast: Toasts for Compose Multiplatform Projects

🍞️ CMPToast is a Compose Multiplatform library that simplifies the creation of toasts in your mobile applications. CMPToast stands out for a number of reasons:

  • Cross-platform support: Works on both Android and iOS, making it perfect for Compose Multiplatform projects.
  • Customization: Easily tailor toasts with properties like background color, text size, and position.
  • Lightweight: CMPToast is designed to be light and efficient, so it won't affect your app's performance.
  • Simple integration: Just add the dependency, and you're good to go!

 

🚀 Getting Started with CMPToast

To get started with CMPToast, simply add the following dependency to your project's build.gradle.kts file:

commonMain.dependencies {
    implementation("network.chaintech:cmptoast:1.0.1")
}
Enter fullscreen mode Exit fullscreen mode

 
🖥️ Platforms Supported

  • Android 🤖
  • iOS 🍎

 

🎨 Customizing CMPToast

Let's dive into some practical examples of how to customize your toasts in CMPToast.

 
⏳ Short Toast
To show a toast with a short duration, you can use the following:

showToast(
    message = "This is Short Toast",
    backgroundColor = Color.White,
    textColor = Color.Black,
    duration = ToastDuration.Short
)
Enter fullscreen mode Exit fullscreen mode

 
⏳ Long Toast
If you need the toast to stay on the screen longer, here's how to show a long-duration toast:

showToast(
    message = "This is Long Toast",
    backgroundColor = Color.White,
    textColor = Color.Black,
    duration = ToastDuration.Long
)
Enter fullscreen mode Exit fullscreen mode

 
📍 Top Toast
To position the toast at the top of the screen, use the gravity property:

showToast(
    message = "This is Top Toast",
    backgroundColor = Color.White,
    textColor = Color.Black,
    gravity = ToastGravity.Top
)
Enter fullscreen mode Exit fullscreen mode

 
🎯 Center Toast
To center the toast on the screen:

showToast(
    message = "This is Center Toast",
    backgroundColor = Color.White,
    textColor = Color.Black,
    gravity = ToastGravity.Center
)
Enter fullscreen mode Exit fullscreen mode

 
🎨 Colored Toast
If you want to give your toast a custom color, you can easily do so:

showToast(
    message = "This is Colored Toast",
    backgroundColor = Color(0xFF27AD9D)
)
Enter fullscreen mode Exit fullscreen mode

 

⚙️ Customizable Properties

CMPToast provides several properties that allow you to fully customize your toast notifications.

  • message (String): The message text that will be displayed in the toast.
  • gravity (ToastGravity): Specifies where the toast will appear on the screen. You can position it at the top, center, or bottom using values like ToastGravity.Top, ToastGravity.Center, and ToastGravity.Bottom.
  • backgroundColor (Color): Allows you to customize the background color of the toast.
  • textColor (Color): Lets you change the color of the message text.
  • duration (ToastDuration): Controls how long the toast will be displayed. You can choose between ToastDuration.Short and ToastDuration.Long.
  • padding (ToastPadding?): Optional padding for the toast content to adjust the spacing.
  • textSize (TextUnit): Sets the size of the message text.
  • topPadding (Int): Adds extra padding to the top of the toast for further positioning customization.
  • bottomPadding (Int): Adds extra padding to the bottom of the toast.
  • cornerRadius (Int?): Optionally rounds the corners of the toast by specifying a corner radius.

 

Checkout the complete code on Github:
[https://github.com/Chaintech-Network/CMPToast]

Head over to the repository to try it out and contribute to the project!

Feel free to give it a star ⭐ and explore how CMPToast can elevate your user experience with customizable toast notifications in Compose Multiplatform projects.


Connect with us 👇

[https://www.linkedin.com/showcase/mobile-innovation-network/]

[https://github.com/Chaintech-Network]

Heroku

Build apps, not infrastructure.

Dealing with servers, hardware, and infrastructure can take up your valuable time. Discover the benefits of Heroku, the PaaS of choice for developers since 2007.

Visit Site

Top comments (0)

AWS Security LIVE!

Tune in for AWS Security LIVE!

Join AWS Security LIVE! for expert insights and actionable tips to protect your organization and keep security teams prepared.

Learn More

👋 Kindness is contagious

Dive into an ocean of knowledge with this thought-provoking post, revered deeply within the supportive DEV Community. Developers of all levels are welcome to join and enhance our collective intelligence.

Saying a simple "thank you" can brighten someone's day. Share your gratitude in the comments below!

On DEV, sharing ideas eases our path and fortifies our community connections. Found this helpful? Sending a quick thanks to the author can be profoundly valued.

Okay