1. Home
  2. Training Library
  3. Programming
  4. Programming Courses
  5. User Interactions in Android App Development

Snackbar Messages in Android App Development

Contents

keyboard_tab

The course is part of this learning path

Snackbar Messages in Android App Development
Overview
Difficulty
Intermediate
Duration
31m
Students
3
Description

This course covers the different types of messages that you can use in your Android app, namely toast messages, snackbar messages, and dialog messages.

Intended Audience

This course is intended for anyone who wants to learn how to start building their own apps on Android.

Prerequisites

To get the most out of this course, you should have some basic knowledge of the fundamentals of Android.

Resources

Course GitHub repo: https://github.com/OakAcademy/android-app-development-with-kotlin/tree/main/Section%205%20-%20User%20Interactions/UserInteractions 

Transcript

Alright. So, hello everyone. We will now talk about the Snackbar message in this video. So, I know everything makes me hungry too. But this snackbar message, it's a message typed to give some information the user, just like the toast. However, it's just a little bit different. It's displayed at the bottom of the device screen. Now it also has a close button to close this message whenever the user wants. So, I want to show you what it looks like on Android Studio. So now, we've had this Android project before, so I am going to continue on this project.

But before we start to create the snackbar message, I want to show you what it looks like. So, when I click on this button, it will display at the bottom of the screen. Now in here, the message is, this is a snackbar message, I know. So, you can give your message to a user here, you've got five minutes left, or hurry up, or whatever you want it to be. So, when I click on the 'Close' button, it's going to get closed, disappears. So, there you can see the difference between what we did before the toast and this one, the snackbar message.

The toast message is shown and after a while it disappears on its own. And also, the user would not be able to close the toast message. But for the snackbar message, the user has every right to close it whenever the user chooses to close it. Alright. So, let's just quickly create a snackbar message. So, first of all, I am just going to add a new button to the design area. And let's make the text of the button Show Snackbar Message. Now also, we should define an ID for this button. So, let's make the ID of the button be buttonShowSnackbar.

Alright. Now finally, since our main layout is all ready in constraint layout, well, we've got to specify the constraint values of the button. So, I'll 'right-click' the button with the mouse and select 'Center Horizontally'. And that centers the button horizontally. So, let's just go ahead and set the constraint value for the vertical plane as well. Cool. So, I am going to just tap that in at 70. Far out, so that's all we got to do for now in the design area. Let's go ahead and open up the MainActivity.kt file. Alright. So, now we're looking to create a new variable for the button that will display the snackbar message.

The name of this variable can be showSnackbar, can be something else, but that's what I am going with. So, now let's match it with the ID in the onCreate method. So, I am writing showSnackbar = findViewById (R.Id.buttonShowSnackbar). So, this happens when user clicks a button, and a snackbar message will display. And in order to do this, we need to add a click listener to the showSnackbar button. So, I am just going to write it here, showSnackbar.setOnClickListener. And then, I'll create the snackbar message inside the curly braces. Alright. So, now I am typing in Snackbar.make.

So, the make method, this is also going to take three parameters, but the first parameter is the view parameter. Remember, we were using the context parameter, and I told you most of the time, well here we go. So, in other words, whatever layout that we want the snackbar to be displayed in, we must write that layout as the first parameter. Alright. So, to do that, we will need to find the layout in the design area, and that is the constraint layout here. So, let's go back to the design area and determine the ID of the constraint layout.

So, I am typing myLayout here. So, let's define it on the common side. I'll just create a new variable, and I am writing lateinit var_myLayout: ConstraintLayout. Alright, so now we can match it with this ID, and I am writing myLayout = findViewById (R.Id.myLayout). Now, let's move on to creating the snackbar message. So, I am writing myLayout as the first parameter. Second one is the message, and I'll write my message inside the quotation marks. And of course, my message is, This is a snackbar message. Now, the third one is how much time the message is going to be displayed? And again, that's up to you. Because there are three different alternatives here. After writing Snackbar, you see how we can now see the three different options. Long, short, indefinite. So, in the long and the short, while these messages will disappear after a little while. But naturally, the indefinite message box will not disappear until the user closes it. That's why I am going to be choosing the indefinite option here. So, after that, I'll just write .setAction. And that's all outside of the make function. Alright, cool. Now, this takes two parameters.

The first one is the text of the close button. So, I'll just give it some text for the close button and I'll write in here close, but you can write whatever you want. So, the second is a click listener. So, I need you to find a new click listener because when the user clicks on the 'Close' button, the snackbar message needs to be closed. So, when you press the 'Ctrl' and 'Space' keys on the keyboard, Android Studio shows us the operations that we can now accomplish. So, here I'll just select 'ClickListener' and press 'Enter'. What happens? Well, when I add a click listener, Android Studio understands this is for the close snackbar message. I don't even need to write anything inside the click listener. Pretty cool. Alright. So, after that, we'll just add right in here .show and that's it. Snackbar message is now ready. Why don't we just run it just to make sure, and what do we got? So, when the application opens, I'll click on the 'showSnackbar' message, and that's the button here, the snackbar message gets displayed. When I click the 'Close' button, what happens?

Poof, just like magic. Alright. So, let's see what's going to happen if I'll choose the Snackbar.LENGTH_SHORT as the third parameter of the make function. You remember how to do that? So, I'll just delete the indefinite, and I'll write in .LENGTH_SHORT. So, let's run it again. So, the application opens. So, this time when I click the button, the snackbar message gets displayed, but after a little bit, boom, there goes, it's away. So, that's how you use the snackbar message, and that's enough. So, we're going to do something else next time round. So, I'll see you on the other side.

 

About the Author
Students
86
Courses
23
Learning Paths
1

Mehmet graduated from the Electrical & Electronics Engineering Department of the Turkish Military Academy in 2014 and then worked in the Turkish Armed Forces for four years. Later, he decided to become an instructor to share what he knew about programming with his students. He’s currently an Android instructor, is married, and has a daughter.

Covered Topics