Android App Development | Lecture#38 | Hive Learners

๐“–๐“ป๐“ฎ๐“ฎ๐“ฝ๐“ฒ๐“ท๐“ฐ๐“ผ

Hello everyone, I hope you all are well. In our recent lecture, we learn how to populate static data in the list. We use the default list view. But most of the time we need a custom layout for the list items and also need to populate multiple values in it. So today we will create a custom layout and use it in our listview items.

GitHub Link

Use this GitHub project to clone into your directory. The following lecture will constantly update it so you will never miss the latest code. Happy Coding!

What Should I Learn

  • Add Custom Adapter
  • Custom Listview

Assignment

  • Populate Custom ListView

Procedure

First, we need to create a new layout. I set the name my_list_item. It creates an XML file on this name and we can write our listview item design code in it.

I create this layout with 2 TextView and a material button.

<?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:orientation="vertical"
    app:cardCornerRadius="4dp"
    app:cardUseCompatPadding="true">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="4dp"
        android:gravity="center_vertical"
        android:orientation="horizontal">

        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:orientation="vertical">

            <TextView
                android:id="@+id/title_lv_item"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Title"
                android:textSize="16sp" />

            <TextView
                android:id="@+id/subTitle_lv_item"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="4dp"
                android:text="SubTitle"
                android:textSize="14sp" />


        </LinearLayout>

        <com.google.android.material.button.MaterialButton
            android:id="@+id/delete_lv_btn"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="DELETE"
            app:backgroundTint="@android:color/holo_red_dark" />
    </LinearLayout>

</androidx.cardview.widget.CardView>

Now we need to add a model class. We will add work POJO with it. It stands for Plain Old Java Object. We will add the variable and set getter and setter of them. We will also create a constructor for it.

package com.example.hivelearners2;

public class MyList_POJO {
    String title, subTitle;

    public MyList_POJO(String title, String subTitle) {
        this.title = title;
        this.subTitle = subTitle;
    }

    public String getTitle() {
        return title;
    }

    public void setTitle(String title) {
        this.title = title;
    }

    public String getSubTitle() {
        return subTitle;
    }

    public void setSubTitle(String subTitle) {
        this.subTitle = subTitle;
    }
}

Now we need to create a JAVA class and we will write the code for the Custom Adapter there. I create MyAdapter.java.

package com.example.hivelearners2;

import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ArrayAdapter;
import android.widget.TextView;

import java.util.ArrayList;

public class MyAdapter extends ArrayAdapter<MyList_POJO> {

    private int resourceLayout;
    private Context mContext;

    public MyAdapter(Context context, int resource, ArrayList<MyList_POJO> items) {
        super(context, resource, items);
        this.resourceLayout = resource;
        this.mContext = context;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {

        View v = convertView;

        if (v == null) {
            LayoutInflater vi;
            vi = LayoutInflater.from(mContext);
            v = vi.inflate(resourceLayout, null);
        }

        MyList_POJO pojo = getItem(position);

        if (pojo != null) {
            TextView title_tv = (TextView) v.findViewById(R.id.title);
            TextView subTitle_tv = (TextView) v.findViewById(R.id.subTitle_lv_item);
            TextView delete_btn = (TextView) v.findViewById(R.id.delete_lv_btn);

            if (title_tv != null) {
                title_tv.setText(pojo.getTitle());
            }

            if (subTitle_tv != null) {
                subTitle_tv.setText(pojo.getSubTitle());
            }

        }

        return v;
    }

}

Now we need to the custom adapter and set the listview adapter to this adapter. We also need some random data in our POJO class.

ArrayList<MyList_POJO> myList_pojos = new ArrayList<>();
        myList_pojos.add(new MyList_POJO("Pakistan", "Lahore"));
        myList_pojos.add(new MyList_POJO("India", "Punjab"));
        myList_pojos.add(new MyList_POJO("United Kingdom", "London"));
        MyAdapter customAdapter = new MyAdapter(this, R.layout.my_list_item, myList_pojos);

        posts_lv.setAdapter(customAdapter);


hl_divider.png

Thank You

hl_footer_banner.png



0
0
0.000
4 comments
avatar

A list view will help fo that development!
!1UP

You can earn passive income by delegation of tribe tokens to "The Cartel".

dlmmqb-TheCartel-banner
Click this banner to join "The Cartel" discord server to know more.

0
0
0.000
avatar

Thanks for your contribution to the STEMsocial community. Feel free to join us on discord to get to know the rest of us!

Please consider delegating to the @stemsocial account (85% of the curation rewards are returned).

You may also include @stemsocial as a beneficiary of the rewards of this post to get a stronger support.ย 
ย 

0
0
0.000