{"id":118635,"date":"2023-09-11T19:00:28","date_gmt":"2023-09-11T13:30:28","guid":{"rendered":"https:\/\/data-flair.training\/blogs\/?p=118635"},"modified":"2026-06-01T14:14:44","modified_gmt":"2026-06-01T08:44:44","slug":"android-kotlin-grocery-shopping-app","status":"publish","type":"post","link":"https:\/\/data-flair.training\/blogs\/android-kotlin-grocery-shopping-app\/","title":{"rendered":"Android Kotlin Project \u2013 Grocery Shopping App"},"content":{"rendered":"

Hey there, Android enthusiasts! Today we are going to see and learn how to implement an Android Project called grocery shopping in Android Studio. We\u2019ll understand the complete project’s development in this article.<\/p>\n

Users typically forget to buy the goods they wish to buy because we can’t remember everything. But you may use this app to create a list of the items you want to buy so that you don’t forget anything. The Grocery Shopping application will help the user by maintaining a list of items along with price and quantity, which will make grocery shopping easier and hassle-free.<\/p>\n

About Android Kotlin Grocery Shopping App<\/h3>\n

For those who are still learning the fundamentals of creating Android applications, here is an Android project. Users of this Android app can add things to their shopping lists by clicking the floating button in the bottom right corner of the main screen.<\/p>\n

The home screen will display all the items entered by the user.<\/p>\n

We will use Android Studio and the programming language Kotlin to develop this Android application.<\/p>\n

Let’s look over the list of features that the user interface will include:<\/strong><\/p>\n

1. A floating “+” button will be included in the user interface at the bottom right corner of the home screen.
\n2. The ‘+’ button will display a bottom screen fragment with three text fields when clicked.
\n3. The user must input the item’s name and quantity in the two text areas.
\n4. The user must enter the item’s price in the third field.
\n5. The newly entered task details will be saved onto the ROOM database and made visible on the home screen by clicking the “Save” button at the bottom of the sheet fragment.
\n6. On the home screen, a checkbox that can be used to mark a task as completed is displayed alongside a list of all the tasks that the user has entered.
\n7. There will be a “trash” icon next to each item on the home screen, and clicking it will remove it from both the home screen and the database.<\/p>\n

Prerequisites For Grocery Shopping App using Android Kotlin<\/h3>\n

To develop this Android application, the requirements and prerequisites are as follows:<\/strong><\/p>\n

1. Kotlin:<\/strong> You must first become acquainted with Kotlin programming. It is necessary since we will create the app’s code in the Kotlin programming language.
\n2. XML:<\/strong> XML is yet another essential element of our Android application. It will be used to create the user interface for the application.
\n3. Android Studio:<\/strong> Android Studio: Because that is how we will develop it, Android Studio is the foundation of our programme. An Android virtual device that can be used to test an application’s functionality is also available with Android Studio.
\n4. ROOM DAOs:<\/strong> The queries needed to insert\/write data into the database are referred to as ROOM DAOs. Knowledge of fundamental database management is crucial.<\/p>\n

Download Android Kotlin Grocery Shopping App Project<\/h3>\n

Please download the source code of the Android Kotlin Grocery Shopping App Project: Android<\/strong> Kotlin<\/strong> Grocery Shopping App Project Code.<\/strong><\/a><\/p>\n

Develop a Grocery Shopping app in Android Studio.<\/h3>\n

Let’s start by making a grocery-buying application in Android Studio. Step-by-step instructions have been provided for each and every file in this tutorial to help you better grasp how the program functions.<\/p>\n

To develop this grocery shopping app for Android, you must follow a few steps.<\/strong><\/p>\n

1. At the location of your choice, extract all the files from the downloaded zip file.
\n2. Launch Android Studio.
\n3. Select File, then select Open.
\n4. Click OK when you locate and pick the extracted folder.<\/p>\n

You have successfully opened the grocery shopping app\u2019s source code in Android Studio.<\/p>\n

\"android<\/a><\/p>\n

Let’s go through each file in this project one at a time as we comprehend how the application works.<\/p>\n

1. The text fields and buttons found in the user interface are created by an XML file called “activity_main”.<\/p>\n

Code:<\/strong><\/p>\n

<?xml version=\"1.0\" encoding=\"utf-8\"?>\r\n<RelativeLayout xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"\r\n   xmlns:app=\"http:\/\/schemas.android.com\/apk\/res-auto\"\r\n   xmlns:tools=\"http:\/\/schemas.android.com\/tools\"\r\n   android:layout_width=\"match_parent\"\r\n   android:background=\"#F9F9F9\"\r\n   android:layout_height=\"match_parent\"\r\n   tools:context=\".MainActivity\">\r\n\r\n\r\n\r\n\r\n   <androidx.recyclerview.widget.RecyclerView\r\n       android:id=\"@+id\/rvitems\"\r\n       android:layout_width=\"match_parent\"\r\n       android:layout_height=\"match_parent\"\r\n       tools:listitem=\"@layout\/grocery_rv_item\">\r\n\r\n\r\n   <\/androidx.recyclerview.widget.RecyclerView>\r\n\r\n\r\n\r\n\r\n   <com.google.android.material.floatingactionbutton.FloatingActionButton\r\n       android:id=\"@+id\/fabAdd\"\r\n       android:layout_width=\"wrap_content\"\r\n       android:layout_height=\"wrap_content\"\r\n       android:layout_alignParentEnd=\"true\"\r\n       android:layout_alignParentBottom=\"true\"\r\n       android:layout_marginStart=\"25dp\"\r\n       android:layout_marginTop=\"25dp\"\r\n       android:layout_marginEnd=\"25dp\"\r\n       android:layout_marginBottom=\"25dp\"\r\n       android:backgroundTint=\"@color\/purple_700\"\r\n       android:elevation=\"5dp\"\r\n       android:src=\"@drawable\/ic_baseline_add\"\r\n       app:tint=\"@color\/white\" \/>\r\n\r\n\r\n\r\n\r\n<\/RelativeLayout><\/pre>\n
\"activity<\/a><\/p>\n
2. \u2018grocery_add_dialog.xml\u2019 is a file responsible for creating a user interface where the user will enter the required details about the newly added item.<\/p>\n
The below XML code defines a CardView that contains a form for adding a new item to a list. The form consists of three text input fields for entering the item name, quantity, and price. There are also two buttons, Cancel and Add, for cancelling or adding the item to the list.<\/p>\n
Code:<\/strong><\/p>\n
<?xml version=\"1.0\" encoding=\"utf-8\"?>\r\n<androidx.cardview.widget.CardView xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"\r\n   android:layout_width=\"match_parent\"\r\n   android:layout_height=\"wrap_content\"\r\n   xmlns:app=\"http:\/\/schemas.android.com\/apk\/res-auto\"\r\n   android:layout_gravity=\"center\"\r\n   android:backgroundTint=\"#FEFBF6\"\r\n   android:background=\"@drawable\/btn_bg\"\r\n   app:cardCornerRadius=\"10dp\">\r\n   <RelativeLayout\r\n       android:layout_width=\"match_parent\"\r\n       android:layout_height=\"wrap_content\"\r\n       >\r\n\r\n\r\n       <TextView\r\n           android:id=\"@+id\/idtvHeading\"\r\n           android:layout_width=\"match_parent\"\r\n           android:layout_height=\"wrap_content\"\r\n           android:layout_marginStart=\"4dp\"\r\n           android:layout_marginTop=\"4dp\"\r\n           android:layout_marginEnd=\"4dp\"\r\n           android:layout_marginBottom=\"4dp\"\r\n           android:background=\"@color\/blue\"\r\n           android:gravity=\"center\"\r\n           android:padding=\"4dp\"\r\n           android:text=\"Add Item To List\"\r\n           android:textAlignment=\"center\"\r\n           android:textAllCaps=\"false\"\r\n           android:textColor=\"@color\/white\"\r\n           android:textSize=\"20sp\"\r\n           android:textStyle=\"bold\" \/>\r\n\r\n\r\n       <ImageView\r\n           android:id=\"@+id\/imageView\"\r\n           android:layout_width=\"65dp\"\r\n           android:layout_height=\"45dp\"\r\n           android:src=\"@drawable\/ic_baseline_local_grocery_store_24\"\r\n           app:layout_constraintBottom_toBottomOf=\"parent\"\r\n           app:layout_constraintEnd_toEndOf=\"parent\"\r\n           app:layout_constraintHorizontal_bias=\"0.797\"\r\n           app:layout_constraintStart_toStartOf=\"parent\"\r\n           app:layout_constraintVertical_bias=\"0.0\" \/>\r\n\r\n\r\n       <LinearLayout\r\n           android:layout_width=\"match_parent\"\r\n           android:layout_height=\"wrap_content\"\r\n           android:layout_below=\"@id\/idtvHeading\"\r\n           android:orientation=\"vertical\">\r\n           <com.google.android.material.textfield.TextInputLayout\r\n               android:layout_width=\"match_parent\"\r\n               android:layout_height=\"wrap_content\"\r\n               android:layout_margin=\"10dp\"\r\n               android:padding=\"5dp\"\r\n\r\n\r\n               app:hintTextColor=\"@color\/black\"\r\n               app:counterTextColor=\"@color\/black\">\r\n               <com.google.android.material.textfield.TextInputEditText\r\n                   android:layout_width=\"match_parent\"\r\n                   android:layout_height=\"wrap_content\"\r\n                   android:id=\"@+id\/idEdtitemname\"\r\n                   android:textSize=\"14sp\"\r\n                   android:hint=\"Enter item Name\"\r\n                   android:inputType=\"text\"\r\n                   app:hintTextColor=\"@color\/black\"\r\n                   app:counterTextColor=\"@color\/black\"\r\n                   \/>\r\n           <\/com.google.android.material.textfield.TextInputLayout>\r\n           <com.google.android.material.textfield.TextInputLayout\r\n               android:layout_width=\"match_parent\"\r\n               android:layout_height=\"wrap_content\"\r\n               android:layout_margin=\"10dp\"\r\n               android:padding=\"5dp\"\r\n\r\n\r\n               app:hintTextColor=\"@color\/black\"\r\n               app:counterTextColor=\"@color\/black\">\r\n               <com.google.android.material.textfield.TextInputEditText\r\n                   android:layout_width=\"match_parent\"\r\n                   android:layout_height=\"wrap_content\"\r\n                   android:id=\"@+id\/idEdtitemquantity\"\r\n                   android:textSize=\"14sp\"\r\n                   android:hint=\"Enter item Quantity in kg\"\r\n                   android:inputType=\"numberDecimal\"\r\n                   app:hintTextColor=\"@color\/black\"\r\n                   app:counterTextColor=\"@color\/black\"\r\n                   \/>\r\n           <\/com.google.android.material.textfield.TextInputLayout>\r\n           <com.google.android.material.textfield.TextInputLayout\r\n               android:layout_width=\"match_parent\"\r\n               android:layout_height=\"wrap_content\"\r\n               android:layout_margin=\"10dp\"\r\n               android:padding=\"5dp\"\r\n\r\n\r\n               app:hintTextColor=\"@color\/black\"\r\n               app:counterTextColor=\"@color\/black\">\r\n               <com.google.android.material.textfield.TextInputEditText\r\n                   android:layout_width=\"match_parent\"\r\n                   android:layout_height=\"wrap_content\"\r\n                   android:id=\"@+id\/idEdtitemprice\"\r\n                   android:textSize=\"14sp\"\r\n                   android:hint=\"Enter item Price \/kg\"\r\n                   android:inputType=\"numberDecimal\"\r\n                   app:hintTextColor=\"@color\/black\"\r\n                   app:counterTextColor=\"@color\/black\"\r\n                   \/>\r\n           <\/com.google.android.material.textfield.TextInputLayout>\r\n           <LinearLayout\r\n               android:layout_width=\"match_parent\"\r\n               android:layout_height=\"wrap_content\"\r\n               android:orientation=\"horizontal\"\r\n               android:layout_margin=\"5dp\"\r\n               android:weightSum=\"2\">\r\n               <androidx.appcompat.widget.AppCompatButton\r\n                   android:layout_width=\"0dp\"\r\n                   android:layout_height=\"wrap_content\"\r\n                   android:layout_weight=\"1\"\r\n                   android:layout_margin=\"8dp\"\r\n                   android:padding=\"5dp\"\r\n                   android:id=\"@+id\/idbtncancel\"\r\n                   android:text=\"Cancel\"\r\n                   android:textColor=\"@color\/white\"\r\n                   android:background=\"@drawable\/btn_bg\"\r\n                   android:textAllCaps=\"false\"\r\n                   \/>\r\n               <androidx.appcompat.widget.AppCompatButton\r\n                   android:layout_width=\"0dp\"\r\n                   android:layout_height=\"wrap_content\"\r\n                   android:layout_weight=\"1\"\r\n                   android:layout_margin=\"8dp\"\r\n                   android:padding=\"5dp\"\r\n                   android:id=\"@+id\/idbtnadd\"\r\n                   android:text=\"Add\"\r\n                   android:textColor=\"@color\/white\"\r\n                   android:background=\"@drawable\/btn_bg\"\r\n                   android:textAllCaps=\"false\"\r\n                   \/>\r\n           <\/LinearLayout>\r\n       <\/LinearLayout>\r\n\r\n\r\n   <\/RelativeLayout>\r\n\r\n\r\n<\/androidx.cardview.widget.CardView><\/pre>\n
\"grocery<\/a><\/p>\n
3. \u2018grocery_rv_item.xmll\u2019 is an XML file that is responsible for creating the user interface (UI) for items that are presented on the home screen.<\/p>\n
The XML code mentioned above creates a CardView that has a layout for showing a grocery list item. The item name, quantity, rate, and total cost are displayed using four different text views in the layout. For deleting the item, there is also an image view available.<\/p>\n
<?xml version=\"1.0\" encoding=\"utf-8\"?>\r\n<androidx.cardview.widget.CardView xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"\r\n   android:layout_width=\"match_parent\"\r\n   android:layout_height=\"wrap_content\"\r\n   xmlns:app=\"http:\/\/schemas.android.com\/apk\/res-auto\"\r\n   android:layout_margin=\"5dp\"\r\n   android:backgroundTint=\"@color\/white\"\r\n   app:cardCornerRadius=\"3dp\"\r\n   app:cardElevation=\"5dp\">\r\n   <RelativeLayout\r\n       android:layout_width=\"match_parent\"\r\n       android:layout_height=\"wrap_content\">\r\n       <LinearLayout\r\n           android:layout_width=\"match_parent\"\r\n           android:layout_height=\"wrap_content\"\r\n           android:orientation=\"horizontal\"\r\n           android:weightSum=\"5\"\r\n           android:id=\"@+id\/idLL1\">\r\n           <TextView\r\n               android:layout_width=\"0dp\"\r\n               android:layout_height=\"wrap_content\"\r\n               android:layout_weight=\"2\"\r\n               android:text=\"Item Name\"\r\n               android:textColor=\"@color\/black\"\r\n               android:padding=\"4dp\"\r\n               android:layout_margin=\"3dp\"\r\n               android:id=\"@+id\/idtvitemname\"\/>\r\n           <TextView\r\n               android:layout_width=\"0dp\"\r\n               android:layout_height=\"wrap_content\"\r\n               android:layout_weight=\"1.25\"\r\n               android:text=\"Quantity\"\r\n               android:textColor=\"@color\/black\"\r\n               android:padding=\"4dp\"\r\n               android:layout_margin=\"3dp\"\r\n               android:id=\"@+id\/idtvquantity\"\/>\r\n           <TextView\r\n               android:layout_width=\"0dp\"\r\n               android:layout_height=\"wrap_content\"\r\n               android:layout_weight=\"1.25\"\r\n               android:text=\"Rate\"\r\n               android:textColor=\"@color\/black\"\r\n               android:padding=\"4dp\"\r\n               android:layout_margin=\"3dp\"\r\n               android:id=\"@+id\/idtvrate\"\/>\r\n           <ImageView\r\n               android:layout_width=\"0dp\"\r\n               android:layout_height=\"wrap_content\"\r\n               android:layout_weight=\"0.5\"\r\n               android:id=\"@+id\/idivdelete\"\r\n               android:padding=\"4dp\"\r\n               android:src=\"@drawable\/ic_baseline_delete_24\"\r\n               app:tint=\"@color\/blue_light\"\r\n               android:layout_margin=\"3dp\"\/>\r\n       <\/LinearLayout>\r\n       <TextView\r\n           android:layout_width=\"match_parent\"\r\n           android:layout_height=\"wrap_content\"\r\n           android:padding=\"4dp\"\r\n           android:layout_margin=\"3dp\"\r\n           android:id=\"@+id\/idtvheading\"\r\n           android:layout_toLeftOf=\"@id\/idtvtotalamount\"\r\n           android:layout_below=\"@id\/idLL1\"\r\n           android:text=\"Total Cost :\"\r\n           android:textColor=\"@color\/black\"\/>\r\n       <TextView\r\n           android:layout_width=\"wrap_content\"\r\n           android:layout_height=\"wrap_content\"\r\n           android:padding=\"4dp\"\r\n           android:layout_margin=\"3dp\"\r\n           android:id=\"@+id\/idtvtotalamount\"\r\n           android:layout_below=\"@id\/idLL1\"\r\n           android:text=\"Amount\"\r\n           android:layout_alignParentEnd=\"true\"\r\n           android:textColor=\"@color\/black\"\/>\r\n\r\n\r\n   <\/RelativeLayout>\r\n\r\n\r\n<\/androidx.cardview.widget.CardView><\/pre>\n
\"grocerydao<\/a><\/p>\n
Let\u2019s start with setting up the necessary files required for creating a ROOM database that will store the task\u2019s name and description.<\/p>\n
1. When the ROOM database is initialized, an entity file called “GroceryDatabase.kt” will be created. The database’s appropriate tables and columns will be constructed with the aid of this file.<\/p>\n
Code:<\/strong><\/p>\n
@Database(entities = [GroceryItems::class], version = 1)\r\n\r\n\r\nabstract class GroceryDatabase : RoomDatabase() {\r\n\r\n\r\n   abstract fun getGroceryDao() : GroceryDao\r\n   companion object {\r\n       @Volatile\r\n       private var instance: GroceryDatabase? = null\r\n       private val LOCK = Any()\r\n\r\n\r\n       operator fun invoke(context: Context) = instance ?: synchronized(LOCK) {\r\n           instance ?: createDatabase(context).also {\r\n               instance = it\r\n           }\r\n\r\n\r\n       }\r\n\r\n\r\n\r\n\r\n       private fun createDatabase(context: Context) =\r\n           Room.databaseBuilder(\r\n               context.applicationContext,\r\n               GroceryDatabase::class.java,\r\n               \"GroceryApp.db\"\r\n           ).build()\r\n   }\r\n}<\/pre>\n
2. The methods that can access the database are defined by the interface “GroceryDAO.kt,” which is a data access object. We have defined the ‘insert’ and ‘delete’ queries in this file using annotations. The ‘insert’ query will insert data into the designated database table, and the ‘delete’ query will allow the user to remove a previously saved item from the database.<\/p>\n
Code:<\/strong><\/p>\n
import androidx.lifecycle.LiveData\r\nimport androidx.room.*\r\n\r\n\r\n@Dao\r\n\r\n\r\ninterface GroceryDao {\r\n   @Insert(onConflict = OnConflictStrategy.REPLACE)\r\n   suspend fun insert(item: GroceryItems)\r\n   @Delete\r\n   suspend fun delete(item: GroceryItems)\r\n   @Query(\"SELECT * FROM Grocery_items\")\r\n   fun getAllGroceryItems(): LiveData<List<GroceryItems>>\r\n}\r\n<\/pre>\n
3. \u2018GroceryItems.kt\u2019 is a Kotlin file where the table name as well as the attributes that will be stored in the database are mentioned.<\/p>\n
Code:<\/strong><\/p>\n
import androidx.room.ColumnInfo\r\nimport androidx.room.Entity\r\nimport androidx.room.PrimaryKey\r\n\r\n\r\n@Entity(tableName = \"Grocery_items\")\r\ndata class GroceryItems (\r\n   @ColumnInfo(name = \"itemName\")\r\n   var itemName:String,\r\n\r\n\r\n   @ColumnInfo(name = \"itemQuantity\")\r\n   var itemQuantity:Double,\r\n\r\n\r\n   @ColumnInfo(name = \"itemPrice\")\r\n   var itemPrice:Double,\r\n)\r\n{\r\n   @PrimaryKey(autoGenerate = true)\r\n   var id:Int?=null\r\n}<\/pre>\n
Moving on to the files that are responsible for the working and functioning of the application.<\/h4>\n
1. The RecyclerView adapter for showing a list of supermarket products is defined in the GroceryRVAdapter.kt\u2019 Kotlin file. The adapter implements the GroceryItemClickInterface interface and derives from the RecyclerView.Adapter class.<\/p>\n