How to Create a Shayari Android App Using Firebase in Kotlin?

A Shayari app built in android studio consists of various Shayaries and categories of it using Firebase for database purposes, also you can add as many Shayaries and categories of it, indirectly to the firebases the user can access and also have share functionality on WhatsApp as well. A sample video is given below to get an idea about what we are going to do in this article.

Step by Step Implementation

Step 1: Create a New Project in Android Studio

To create a new project in Android Studio please refer to How to Create/Start a New Project in Android Studio. Note that select Kotlin as the programming language.

Step 2: Set up the development environment

Add firebase real-time database dependency in build.gradle(app) file

implementation 'com.google.firebase:firebase-firestore:24.4.0'
implementation 'com.google.firebase:firebase-firestore-ktx:24.4.0'

Add View binding inside android{} block in build.gradle(app) file

buildFeatures {
       viewBinding = true
   }

Step 3: Create a new Firebase Project

Have a look at Adding Firebase to Android App also add a Real-time database to your firebase project.

Step 4: Design the app’s user interface

Navigate to the app > res > layout > activity_main.xml and add the below code to that file. Below is the code for the activity_main.xml file. 

activity_main.xml

XML

<?xml version="1.0" encoding="utf-8"?>
<androidx.drawerlayout.widget.DrawerLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/drawerLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <LinearLayout
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="50dp"
            android:gravity="center_vertical"
            android:orientation="horizontal"
            android:background="@color/red">

            <ImageView
                android:id="@+id/btnMenu"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginStart="20dp"
                android:backgroundTint="@color/white"
                android:src="@drawable/ic_baseline_menu_24"/>

            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginStart="10dp"
                android:fontFamily="@font/bold"
                android:text="Hindi Shayari"
                android:textColor="@color/white"
                android:textSize="20sp" />

        </LinearLayout>

        <androidx.recyclerview.widget.RecyclerView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:id="@+id/rcvCategory"
            android:layout_below="@id/toolbar"/>

    </RelativeLayout>

</androidx.drawerlayout.widget.DrawerLayout>

activity_start.xml

XML

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".StartActivity">

    <LinearLayout
        android:id="@+id/linearLayout"
        android:layout_width="match_parent"
        android:layout_height="45dp"
        android:background="#D62828"
        android:gravity="center_vertical"
        android:orientation="horizontal"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent">

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginStart="10dp"
            android:fontFamily="@font/bold"
            android:text="Hindi Shayari"
            android:textColor="@color/white"
            android:textSize="20sp" />

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/linearLayout">

        <TextView
            android:id="@+id/btnStart"
            android:layout_marginTop="15dp"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginStart="20dp"
            android:layout_marginEnd="20sp"
            android:background="@drawable/btn_shape"
            android:fontFamily="@font/bold"
            android:gravity="center"
            android:padding="15dp"
            android:text="Start"
            android:textColor="@color/white"
            android:textSize="20sp" />

        <TextView
            android:id="@+id/btnRate"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginStart="20dp"
            android:layout_marginTop="15dp"
            android:layout_marginEnd="20sp"
            android:background="@drawable/btn_shape"
            android:fontFamily="@font/bold"
            android:gravity="center"
            android:padding="15dp"
            android:text="Rate"
            android:textColor="@color/white"
            android:textSize="20sp" />

        <TextView
            android:id="@+id/btnMore"
            android:layout_width="match_parent"
            android:layout_marginBottom="15dp"
            android:layout_height="wrap_content"
            android:layout_marginStart="20dp"
            android:layout_marginTop="15dp"
            android:layout_marginEnd="20sp"
            android:background="@drawable/btn_shape"
            android:fontFamily="@font/bold"
            android:gravity="center"
            android:padding="15dp"
            android:text="More"
            android:textColor="@color/white"
            android:textSize="20sp" />

    </LinearLayout>

</androidx.constraintlayout.widget.ConstraintLayout>

activity_all_shayari.xml

XML

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".AllShayariActivity">

    <LinearLayout
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:gravity="center_vertical"
        android:background="@color/red">

        <ImageView
            android:id="@+id/btnBack"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginStart="20dp"
            android:backgroundTint="@color/white"
            android:src="@drawable/ic_baseline_arrow_back_24"/>

        <TextView
            android:id="@+id/catName"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginStart="10dp"
            android:fontFamily="@font/bold"
            android:text="Hindi Shayari"
            android:textColor="@color/white"
            android:textSize="20sp" />

    </LinearLayout>

    <androidx.recyclerview.widget.RecyclerView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@id/toolbar"
        android:id="@+id/rcvAllShayari"/>

</RelativeLayout>

item_category.xml

XML

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <androidx.cardview.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="80dp"
        android:layout_margin="10dp"
        app:cardCornerRadius="10dp">

        <TextView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:id="@+id/item_txt"
            android:layout_gravity="center"
            android:fontFamily="@font/bold"
            android:gravity="center"
            android:text="Hindi Shayari"
            android:textSize="25sp" />

    </androidx.cardview.widget.CardView>

</LinearLayout>

item_shayari.xml

XML

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <androidx.cardview.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        app:cardCornerRadius="10dp">

        <LinearLayout
            android:id="@+id/mainBaground"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">

            <TextView
                android:id="@+id/itemShayari"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_margin="10dp"
                android:fontFamily="@font/bold"
                android:gravity="center"
                android:text=""
                android:textColor="@color/black"
                android:textSize="22sp" />

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="#80000000"
                android:orientation="horizontal"
                android:padding="10dp">

                <FrameLayout
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:layout_weight="1">

                    <LinearLayout
                        android:id="@+id/btnShare"
                        android:layout_width="40dp"
                        android:layout_height="40dp"
                        android:layout_gravity="center"
                        android:background="@drawable/btn_round_shape"
                        android:padding="7dp">

                        <ImageView
                            android:layout_width="match_parent"
                            android:layout_height="match_parent"
                            android:background="@drawable/ic_baseline_share_24" />
                    </LinearLayout>

                </FrameLayout>

                <FrameLayout
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:layout_weight="1">

                    <LinearLayout
                        android:id="@+id/btnCopy"
                        android:padding="7dp"
                        android:layout_width="40dp"
                        android:layout_height="40dp"
                        android:layout_gravity="center"
                        android:background="@drawable/btn_round_shape">

                        <ImageView
                            android:layout_width="match_parent"
                            android:layout_height="match_parent"
                            android:background="@drawable/ic_baseline_content_copy_24" />
                    </LinearLayout>
                </FrameLayout>

                <FrameLayout
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:layout_weight="1">

                    <LinearLayout
                        android:id="@+id/btnWhatsapp"
                        android:padding="7dp"
                        android:layout_width="40dp"
                        android:layout_height="40dp"
                        android:layout_gravity="center"
                        android:background="@drawable/btn_round_shape">

                        <ImageView
                            android:layout_width="match_parent"
                            android:layout_height="match_parent"
                            android:src="@drawable/whatsapp" />
                    </LinearLayout>
                </FrameLayout>

            </LinearLayout>

        </LinearLayout>

    </androidx.cardview.widget.CardView>

</RelativeLayout>

Step 5: Create adapters for shayari

AllShayariAdapter.kt

Kotlin

package com.note.shayariapp.Adapter

import android.content.ActivityNotFoundException
import android.content.ClipData
import android.content.ClipboardManager
import android.content.Context.CLIPBOARD_SERVICE
import android.content.Intent
import android.view.LayoutInflater
import android.view.ViewGroup
import android.widget.Toast
import androidx.recyclerview.widget.RecyclerView
import com.note.shayariapp.AllShayariActivity
import com.note.shayariapp.BuildConfig
import com.note.shayariapp.Model.ShayariModel
import com.note.shayariapp.R
import com.note.shayariapp.databinding.ItemShayariBinding

class AllShayariAdapter(

    val allShayariActivity: AllShayariActivity, val shayariList: ArrayList<ShayariModel>) : RecyclerView.Adapter<AllShayariAdapter.ShayariViewHolder>() {

    class ShayariViewHolder(val binding: ItemShayariBinding) : RecyclerView.ViewHolder(binding.root)

    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ShayariViewHolder {
        return ShayariViewHolder(
            ItemShayariBinding.inflate(
                LayoutInflater.from(parent.context),
                parent,
                false
            )
        )
    }

    override fun onBindViewHolder(holder: ShayariViewHolder, position: Int) {

        holder.binding.itemShayari.text = shayariList[position].data.toString()
        holder.binding.btnCopy.setOnClickListener {

            val clipboard: ClipboardManager? =
                allShayariActivity.getSystemService(CLIPBOARD_SERVICE) as ClipboardManager?
            val clip = ClipData.newPlainText("label", shayariList[position].data.toString())
            clipboard?.setPrimaryClip(clip)

            Toast.makeText(allShayariActivity,"Shayari Copied Successfully",Toast.LENGTH_SHORT).show()

        }
        holder.binding.btnShare.setOnClickListener {

            try {
                val shareIntent = Intent(Intent.ACTION_SEND)
                shareIntent.type = "text/plain"
                shareIntent.putExtra(Intent.EXTRA_SUBJECT, "My application name")
                var shareMessage = "\n${shayariList[position].data}\n\n"
                shareMessage =
                    """
                            ${shareMessage}https://play.google.com/store/apps/details?id=${BuildConfig.APPLICATION_ID}

                          """.trimIndent()
                shareIntent.putExtra(Intent.EXTRA_TEXT, shareMessage)
                allShayariActivity.startActivity(Intent.createChooser(shareIntent, "choose one"))
            } catch (e: Exception) {
                //e.toString();
            }
            true

        }
        holder.binding.btnWhatsapp.setOnClickListener {

            val whatsappIntent = Intent(Intent.ACTION_SEND)
            whatsappIntent.type = "text/plain"
            whatsappIntent.setPackage("com.whatsapp")
            whatsappIntent.putExtra(Intent.EXTRA_TEXT, shayariList[position].data.toString())
            try {
                allShayariActivity.startActivity(whatsappIntent)
            } catch (ex: ActivityNotFoundException) {

            }

        }

    }

    override fun getItemCount() = shayariList.size
}

CategoryAdapter.kt

Kotlin

package com.note.shayariapp.Adapter

import android.content.Intent
import android.graphics.Color.parseColor
import android.view.LayoutInflater
import android.view.ViewGroup
import androidx.recyclerview.widget.RecyclerView
import com.google.firebase.database.collection.LLRBNode.Color
import com.note.shayariapp.AllShayariActivity
import com.note.shayariapp.MainActivity
import com.note.shayariapp.Model.CategoryModel
import com.note.shayariapp.StartActivity
import com.note.shayariapp.databinding.ItemCategoryBinding

class CategoryAdapter(val mainActivity: MainActivity, val list: ArrayList<CategoryModel>) : RecyclerView.Adapter<CategoryAdapter.CatViewHolder>() {

    class CatViewHolder(val binding: ItemCategoryBinding) : RecyclerView.ViewHolder(binding.root)

    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): CatViewHolder {
        return CatViewHolder(
            ItemCategoryBinding.inflate(
                LayoutInflater.from(parent.context),
                parent,
                false
            )
        )
    }

    override fun onBindViewHolder(holder: CatViewHolder, position: Int) {

 holder.binding.itemTxt.text = list[position].name.toString()
        holder.binding.root.setOnClickListener {

            val intent = Intent(mainActivity, AllShayariActivity::class.java)
            intent.putExtra("id", list[position].id)
            intent.putExtra("name", list[position].name)
            mainActivity.startActivity(intent)
        }
    }

    override fun getItemCount() = list.size
}

Step 6: Create a Model for Shayari

CategoryModel.kt

Kotlin

package com.note.shayariapp.Model

class CategoryModel(
    val id: String? = null,
    val name: String? = null
)

ShayariModel.kt

Kotlin

package com.note.shayariapp.Model

class ShayariModel(
    val id: String? = null,
    val data: String? = null
)

Step 7: Finally Write code in Activities

AllShayariActivity.kt 

Kotlin

package com.note.shayariapp

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import androidx.appcompat.app.AppCompatDelegate
import androidx.recyclerview.widget.LinearLayoutManager
import com.google.firebase.firestore.FirebaseFirestore
import com.note.shayariapp.Adapter.AllShayariAdapter
import com.note.shayariapp.Model.ShayariModel
import com.note.shayariapp.databinding.ActivityAllShayariBinding

class AllShayariActivity : AppCompatActivity() {

    lateinit var binding: ActivityAllShayariBinding
    lateinit var db: FirebaseFirestore

    override fun onCreate(savedInstanceState: Bundle?) {

        AppCompatDelegate.setDefaultNightMode(AppCompatDelegate.MODE_NIGHT_NO)

        super.onCreate(savedInstanceState)
        binding = ActivityAllShayariBinding.inflate(layoutInflater)
        setContentView(binding.root)

        val name = intent.getStringExtra("name")
        val id = intent.getStringExtra("id")

        db = FirebaseFirestore.getInstance()

        binding.btnBack.setOnClickListener {
            onBackPressed()
        }
        binding.catName.text = name.toString()

        db.collection("Shayari").document(id!!).collection("all")
            .addSnapshotListener { value, error ->

                val shayariList = arrayListOf<ShayariModel>()
                val data = value?.toObjects(ShayariModel::class.java)
                shayariList.addAll(data!!)

                binding.rcvAllShayari.layoutManager = LinearLayoutManager(this)
                binding.rcvAllShayari.adapter = AllShayariAdapter(this, shayariList)
            }


    }
}

MainActivity.kt

Kotlin

package com.note.shayariapp

import android.content.ActivityNotFoundException
import android.content.Intent
import android.net.Uri
import android.os.Bundle
import android.view.Gravity
import android.widget.Toast
import androidx.appcompat.app.AppCompatActivity
import androidx.appcompat.app.AppCompatDelegate
import androidx.recyclerview.widget.LinearLayoutManager
import com.google.firebase.firestore.FirebaseFirestore
import com.note.shayariapp.Adapter.CategoryAdapter
import com.note.shayariapp.Model.CategoryModel
import com.note.shayariapp.databinding.ActivityMainBinding

class MainActivity : AppCompatActivity() {

    lateinit var binding: ActivityMainBinding
    lateinit var db: FirebaseFirestore

    override fun onCreate(savedInstanceState: Bundle?) {

        AppCompatDelegate.setDefaultNightMode(AppCompatDelegate.MODE_NIGHT_NO)

        super.onCreate(savedInstanceState)
        binding = ActivityMainBinding.inflate(layoutInflater)
        setContentView(binding.root)

        db = FirebaseFirestore.getInstance()
        db.collection("Shayari").addSnapshotListener { value, error ->

            val list = arrayListOf<CategoryModel>()
            val data = value?.toObjects(CategoryModel::class.java)
            list.addAll(data!!)

            binding.rcvCategory.layoutManager = LinearLayoutManager(this)
            binding.rcvCategory.adapter = CategoryAdapter(this, list)
        }

    }

        override fun onBackPressed() {
            super.onBackPressed()
        }
}

StartActivity.kt

Kotlin

package com.note.shayariapp

import android.content.ActivityNotFoundException
import android.content.Intent
import android.net.Uri
import android.os.Bundle
import android.widget.Toast
import androidx.appcompat.app.AppCompatActivity
import androidx.appcompat.app.AppCompatDelegate
import com.note.shayariapp.databinding.ActivityStartBinding

class StartActivity : AppCompatActivity() {

    lateinit var binding: ActivityStartBinding
    override fun onCreate(savedInstanceState: Bundle?) {

        AppCompatDelegate.setDefaultNightMode(AppCompatDelegate.MODE_NIGHT_NO)

        super.onCreate(savedInstanceState)
        binding = ActivityStartBinding.inflate(layoutInflater)
        setContentView(binding.root)

        binding.btnStart.setOnClickListener {
            startActivity(Intent(this, MainActivity::class.java))
        }
        binding.btnRate.setOnClickListener {

            val uri = Uri.parse("market://details?id=$packageName")
            val myAppLinkToMarket = Intent(Intent.ACTION_VIEW, uri)
            try {
                startActivity(myAppLinkToMarket)
            } catch (e: ActivityNotFoundException) {
                Toast.makeText(this, " unable to find market app", Toast.LENGTH_LONG).show()
            }
        }

        binding.btnMore.setOnClickListener {
            try {
                startActivity(
                    Intent(
                        Intent.ACTION_VIEW,
                        Uri.parse("market://details?id=$packageName")
                    )
                )
            } catch (e: ActivityNotFoundException) {
                startActivity(
                    Intent(
                        Intent.ACTION_VIEW,
                        Uri.parse("https://play.google.com/store/apps/details?id=$packageName")
                    )
                )
            }
        }
    }
}

Output: