Logo

dev-resources.site

for different kinds of informations.

CMPToast: Toasts for Compose Multiplatform Projects

Published at
9/30/2024
Categories
toast
composemultiplatform
cmp
kmp
Author
Mobile innovation Network
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")
}

Ā 
šŸ–„ļø 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
)

Ā 
ā³ 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
)

Ā 
šŸ“ 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
)

Ā 
šŸŽÆ CenterĀ Toast
To center the toast on the screen:

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

Ā 
šŸŽØ 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)
)

Ā 

āš™ļø 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]

Featured ones: