Introduction

In this article, we are going to see how to create a Snack Bar in an Android app using the Android Studio. In a user interface, the Snack Bar plays a unique role. It will appear anywhere on the screen and it will also include a button and text.

Step 1

Create a new project in Android Studio.

Android

Give a name to the project and click "Next".

Android

Select the "Phone and Tablet" option and click "Next".

Android

Select an empty activity and click "Next".

Android

At last, give the activity name and click on "Finish".

Android

Step 2

Setup the Gradle by just locating the Gradle Scripts>>Build.Gradle 1.

Android

And type the following dependency in your app's build.gradle.

Android

Code copy is here
  1. maven {
  2. url "https://maven.google.com"
  3. }
Step 3

Locate the Gradle Scripts>>Build.Gradle 2.

Android

Type the following dependency in your app's build.gradle.

Android

Code copy is here.
  1. compile 'com.android.support:design:26.1.0
Step 4

Next, go to app >> res >> layout >> activity_main.xml. Select activity page.

Android

Just type the code as follows.

Android

Code copy is here.
  1. <android.support.constraint.CoordinatorLayout
  2. xmlns:android="http://schemas.android.com/apk/res/android"
  3. xmlns:app="http://schemas.android.com/apk/res-auto"
  4. xmlns:tools="http://schemas.android.com/tools"
  5. android:id="@+id/coordinatorLayout"
  6. android:layout_width="match_parent"
  7. android:layout_height="match_parent"
  8. tools:context="com.example.hari.snackbar.MainActivity">
  10. <RelativeLayout
  11. android:layout_width="match_parent"
  12. android:layout_height="match_parent">
  14. <Button
  15. android:id="@+id/button"
  16. android:layout_width="wrap_content"
  17. android:layout_height="wrap_content"
  18. android:text="Show SnackBar"
  19. android:layout_centerVertical="true"
  20. android:layout_centerHorizontal="true"/>
  21. </RelativeLayout>
  23. </android.support.constraint.CoordinatorLayout>
Step 5

Next, go to app >> java>>Mainactivity.java. Select Mainactivity page.

Android
Type the code as given below.

Android

Code copy is here.
  1. public class MainActivity extends AppCompatActivity {
  2. private CoordinatorLayout coordinatorLayout;
  3. private Button button;
  5. @Override
  6. protected void onCreate(Bundle savedInstanceState) {
  7. super.onCreate(savedInstanceState);
  8. setContentView(R.layout.activity_main);
  10. coordinatorLayout = findViewById(R.id.coordinatorLayout);
  11. button = findViewById(R.id.button);
  13. button.setOnClickListener(new View.OnClickListener() {
  14. @Override
  15. public void onClick(View v) {
  16. showSnackbar();
  17. }
  18. });
  19. }
  21. public void showSnackbar(){
  22. Snackbar snackbar = Snackbar.make(coordinatorLayout,"This is a Snackbar",Snackbar.LENGTH_INDEFINITE)
  23. .setAction("undo", new View.OnClickListener() {
  24. @Override
  25. public void onClick(View view) {
  26. Snackbar snackbar1 = Snackbar.make(coordinatorLayout,"undo Successful",Snackbar.LENGTH_SHORT);
  27. snackbar1.show();
  28. }
  29. });
  30. snackbar.show();
  31. }
  32. }
Step 6

After step 4, sync all the dependency gradles and Mainactivity.java resource files by clicking the Sync button on the top right corner of the gradle page.

Android

Step 7

Verify the preview.

->After the code is applied, the preview will appear like this.

Android

Step 8

Next, go to Android Studio and deploy the application. Select an Emulator or your Android mobile with USB debugging enabled. Give it a few seconds to make installations and set permissions.

Android

Run the application in your desired emulator (Shift + F10).

Android

Explanation of source code

The source code provided in this article is just the dependencies of motions and the code used in activity_main.xml will make the snack bar appear and to define its attributes.

Summary

In this article, we created the app named Snack Bar. Then, we have inserted a Gradle and we learned how to use the Snack Bar and finally, we have deployed that as in the output.

*Support and Share; Thank You*