Android Tutorial

Software Setup and Configuration

Android Studio

File Structure

Components

Core Topics

Layout

View

Button

Intent and Intent Filters

Toast

RecyclerView

Fragments

Adapters

Other UI Component

Image Loading Libraries

Date and Time

Material Design

Bars

Working with Google Maps

Chart

Animation

Database

Advance Android

Jetpack

Architecture

App Publish

App Monetization

How to add a custom-styled Toast in Android

To create a custom-styled Toast in Android, you can inflate a custom XML layout for the Toast. Here's a step-by-step guide:

1. Create the Custom Layout for the Toast

First, create a new XML layout file in your res/layout directory. Let's name it custom_toast_layout.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="#444"
    android:padding="16dp"
    android:orientation="horizontal"
    android:gravity="center_vertical">

    <ImageView
        android:id="@+id/toast_icon"
        android:layout_width="24dp"
        android:layout_height="24dp"
        android:src="@drawable/ic_launcher_foreground" />

    <TextView
        android:id="@+id/toast_text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingStart="16dp"
        android:text="Your Toast Message"
        android:textColor="#FFF" />

</LinearLayout>

Adjust the design as per your requirements.

2. Display the Custom Toast

In your Activity or Fragment, inflate the custom layout and show the custom Toast:

fun showCustomToast(message: String) {
    val layoutInflater = layoutInflater
    val customToastRoot = layoutInflater.inflate(R.layout.custom_toast_layout, null)
    val customToastText: TextView = customToastRoot.findViewById(R.id.toast_text)
    customToastText.text = message

    with(Toast(applicationContext)) {
        setGravity(Gravity.CENTER, 0, 0)
        duration = Toast.LENGTH_LONG
        view = customToastRoot
        show()
    }
}

You can now call the showCustomToast() function to show the custom-styled toast:

showCustomToast("This is a custom toast!")

Note:

While a custom Toast is useful for branding and UI/UX consistency, make sure not to deviate too far from typical Toast appearances so users can easily recognize the feedback mechanism.

  1. Styling Toast messages in Android example code:

    • Description: Styling Toast messages involves changing the appearance of the default Toast. This can include modifying text color, background color, and text size.
    • Code:
      val toast = Toast.makeText(context, "Styled Toast", Toast.LENGTH_SHORT)
      val view = toast.view
      view.setBackgroundColor(ContextCompat.getColor(context, R.color.toastBackground))
      val text = view.findViewById<TextView>(android.R.id.message)
      text.setTextColor(ContextCompat.getColor(context, R.color.toastText))
      text.textSize = 18f
      toast.show()
      
  2. Creating a custom layout for Toast in Android:

    • Description: Customize the layout of a Toast by inflating a custom layout file.
    • Code:
      val inflater = layoutInflater
      val layout: View = inflater.inflate(R.layout.custom_toast_layout, findViewById(R.id.custom_toast_container))
      val toast = Toast(context)
      toast.duration = Toast.LENGTH_SHORT
      toast.view = layout
      toast.show()
      
  3. Customizing duration and position of Toast messages:

    • Description: Adjust the duration and position of a Toast message to meet specific requirements.
    • Code:
      val toast = Toast.makeText(context, "Custom Duration and Position", Toast.LENGTH_LONG)
      toast.setGravity(Gravity.TOP or Gravity.START, 0, 0)
      toast.show()
      
  4. Handling custom animations for Toast in Android:

    • Description: Implement custom animations for Toast to add visual effects when it appears and disappears.
    • Code:
      val toast = Toast.makeText(context, "Custom Animation", Toast.LENGTH_SHORT)
      toast.view.setBackgroundResource(R.drawable.custom_toast_background)
      val animation = AnimationUtils.loadAnimation(context, R.anim.custom_toast_animation)
      toast.view.startAnimation(animation)
      toast.show()
      
  5. Using custom Typeface for Toast text in Android:

    • Description: Apply a custom Typeface (font) to the text of a Toast message.
    • Code:
      val toast = Toast.makeText(context, "Custom Typeface", Toast.LENGTH_SHORT)
      val typeface = Typeface.createFromAsset(assets, "custom_font.ttf")
      val text = toast.view.findViewById<TextView>(android.R.id.message)
      text.typeface = typeface
      toast.show()
      
  6. Creating a rounded corner Toast in Android:

    • Description: Create a Toast with rounded corners by applying a background drawable with rounded corners.
    • Code:
      val toast = Toast.makeText(context, "Rounded Corner Toast", Toast.LENGTH_SHORT)
      val view = toast.view
      val background = ContextCompat.getDrawable(context, R.drawable.rounded_corner_background)
      view.background = background
      toast.show()