Practical no 4

activity_main.xml
<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout

xmlns:android="http://schemas.android.com/apk/res/android"

xmlns:tools="http://schemas.android.com/tools"

android:layout_width="match_parent"

android:layout_height="match_parent"

tools:context=".MainActivity">

<!--on below line we are creating a grid view-->

<GridView

android:id="@+id/idGRV"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:horizontalSpacing="6dp"

android:numColumns="2"

android:verticalSpacing="6dp" />

</RelativeLayout>
gridview_item.xml
<?xml version="1.0" encoding="utf-8"?>

<androidx.cardview.widget.CardView

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:layout_gravity="center"

android:layout_margin="5dp"

app:cardCornerRadius="5dp"

app:cardElevation="5dp">

<!--on below line we are creating

a linear layout for grid view item-->

<LinearLayout

android:layout_width="match_parent"

android:layout_height="wrap_content"
 android:orientation="vertical">

<!--on below line we are creating

a simple image view-->

<ImageView

android:id="@+id/idIVCourse"

android:layout_width="80dp"

android:layout_height="80dp"

android:layout_gravity="center"

android:layout_margin="5dp"

android:padding="4dp"

android:src="@mipmap/ic_launcher" />

<!--on below line we are creating

a simple text view-->

<TextView

android:id="@+id/idTVCourse"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:layout_gravity="center"

android:layout_margin="5dp"

android:padding="4dp"

android:text="Hello World"

android:textAlignment="center"

android:textColor="@color/black" />

</LinearLayout>

</androidx.cardview.widget.CardView>
MainActivity.kt
package com.example.gridviewshoppingcart

import android.os.Bundle

import android.widget.AdapterView

import android.widget.GridView

import android.widget.Toast

import androidx.appcompat.app.AppCompatActivity

import java.util.*

import kotlin.collections.ArrayList

class MainActivity : AppCompatActivity() {

// on below line we are creating

// variables for grid view and course list

lateinit var courseGRV: GridView

lateinit var courseList: List<GridViewModal>

super.onCreate(savedInstanceState)

setContentView(R.layout.activity_main)

// initializing variables of grid view with their ids.

courseGRV = findViewById(R.id.idGRV)

courseList = ArrayList<GridViewModal>()

// on below line we are adding data to

// our course list with image and course name.

courseList = courseList + GridViewModal("Shirt", R.drawable.shirt)

courseList = courseList + GridViewModal("Pants", R.drawable.pants)

courseList = courseList + GridViewModal("Shoes", R.drawable.shoes)

courseList = courseList + GridViewModal("Watch", R.drawable.watch)

courseList = courseList + GridViewModal("Cap", R.drawable.cap)

// on below line we are initializing our course adapter

// and passing course list and context.

val courseAdapter = GridRVAdapter(courseList = courseList, this@MainActivity)

// on below line we are setting adapter to our grid view.

courseGRV.adapter = courseAdapter

// on below line we are adding on item

// click listener for our grid view.

courseGRV.onItemClickListener = AdapterView.OnItemClickListener { _, _, position, _ ->

// inside on click method we are simply displaying

// a toast message with course name.

Toast.makeText(

applicationContext, courseList[position].courseName + " added to cart!",

Toast.LENGTH_SHORT
 ).show()

GridViewModal.kt
package com.example.gridviewshoppingcart

// on below line we are creating a modal class.

data class GridViewModal(

// we are creating a modal class with 2 member

// one is course name as string and

// other course img as int.

val courseName: String,

val courseImg: Int

GridRVAdapter.kt
package com.example.gridviewshoppingcart

import android.content.Context

import android.view.LayoutInflater

import android.view.View

import android.view.ViewGroup

import android.widget.BaseAdapter

import android.widget.ImageView

import android.widget.TextView

// on below line we are creating an

// adapter class for our grid view.

// on below line we are creating two

// variables for course list and context

private val courseList: List<GridViewModal>,

private val context: Context

):

BaseAdapter() {

// in base adapter class we are creating variables

// for layout inflater, course image view and course text view.

private var layoutInflater: LayoutInflater? = null

private lateinit var courseTV: TextView

private lateinit var courseIV: ImageView

// below method is use to return the count of course list

override fun getCount(): Int {

return courseList.size

// below function is use to return the item of grid view.

override fun getItem(position: Int): Any? {

return null

// below function is use to return item id of grid view.

override fun getItemId(position: Int): Long {

return 0

// in below function we are getting individual item of grid view.

override fun getView(position: Int, convertView: View?, parent: ViewGroup?): View? {

var convertView = convertView

// is null, if it is null we are initializing it.

if (layoutInflater == null) {

layoutInflater =

context.getSystemService(Context.LAYOUT_INFLATER_SERVICE) as LayoutInflater

// on the below line we are checking if convert view is null.

// If it is null we are initializing it.

if (convertView == null) {

// on below line we are passing the layout file

// which we have to inflate for each item of grid view.

convertView = layoutInflater!!.inflate(R.layout.gridview_item, null)

// on below line we are initializing our course image view

// and course text view with their ids.

courseIV = convertView!!.findViewById(R.id.idIVCourse)

courseTV = convertView!!.findViewById(R.id.idTVCourse)

// on below line we are setting image for our course image view.

courseIV.setImageResource(courseList.get(position).courseImg)

// on below line we are setting text in our course text view.

courseTV.setText(courseList.get(position).courseName)

// at last we are returning our convert view.

return convertView

}
OUTPUT