IT 311 - MOBILE APPLICATION DEVELOPMENT 2
SY. 2024-2025
IT3E1_PROGRAM5
STUDENT NAME: ANDUIZA, ACE T.
SECTION: BSIT-3E1
IT 311-MOBILE APPLICATION DEVELOPMENT 2 Page | 1
LABORATORY ACTIVITY 5
LESSON NAME: Custom Adapater
APPLICATION NAME: E1_PROGRAM5
PROBLEM INSTRUCTIONS:
Custom Adapter DEMONSTRATION
INSTRUCTIONS GUIDED by Professor Mary Rose Columbres
PROJECT APPLICATION COMPONENTS
MAIN ACTIVITY
XML NAME: activity_main.xml
XML CODE: XML OUTPUT:
<?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"
android:paddingBottom="16dp"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:paddingTop="16dp"
tools:context="com.example.it3e_program5.MainActivity">
<ListView
android:id="@+id/lvStudent"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_alignParentTop="true"
android:divider="@android:color/darker_gray"
android:dividerHeight="2dp"
android:layout_alignParentBottom="true"
/>
</RelativeLayout>
JAVA NAME: MainActivity.java
JAVA CODE:
package com.example.it3e_program5;
import android.os.Bundle;
import android.widget.ListView;
import androidx.appcompat.app.AppCompatActivity;
import java.util.ArrayList;
public class MainActivity extends AppCompatActivity {
ArrayList<DataModel> dataModel=new ArrayList<>();
ListView lvStudent;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
IT 311-MOBILE APPLICATION DEVELOPMENT 2 Page | 2
lvStudent=(ListView) lvStudent.findViewById(R.id.lvStudent);
dataModel.add(new DataModel("Anduiza, Aicel","21 years old"));
dataModel.add(new DataModel("Fegarido, Christina","25 years old"));
dataModel.add(new DataModel("Fajardo, Angela Reyna", "18 years old"));
dataModel.add(new DataModel("Gallardo, Reiney Josephine", "25 years old"));
dataModel.add(new DataModel("Abong, Carla","20 years old"));
CustomAdapter adapter = new CustomAdapter(dataModel, MainActivity.this);
lvStudent.setAdapter(adapter);
}
public void setContentView(int activityMain) {
}
}
XML FILE
XML NAME: dialog_layout.xml
STEPS ON HOW TO ADD XML (LAYOUT RESOURCE FILE) 1. Find the “res” folder on the left
side of Android Studio(Project), click it
and you will see the “layout” folder.
2. Right click it and select new, and then
you will find the “Layout Resource File” then
put your xml file name, then OK.
XML CODE:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:gravity="start"
android:padding="16dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="NAME:"
android:textStyle="bold"
android:textColor="#000"
android:textSize="18sp"/>
<TextView
android:id="@+id/tvName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Anduiza, Ace T."
android:textColor="#000"
android:textSize="16sp"
android:layout_marginTop="8dp"/>
<TextView
android:id="@+id/tvAge"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="28 yo"
android:gravity="start"
android:textColor="#000"
android:textSize="16sp"
android:layout_marginTop="16dp"/>
<Button XML OUTPUT:
android:id="@+id/btnView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="24dp"
android:text="VIEW"
android:textSize="16sp"
IT 311-MOBILE APPLICATION DEVELOPMENT 2 Page | 3
android:layout_gravity="center" />
</LinearLayout>
JAVA
JAVA NAME: DataModel.java
STEPS ON HOW TO ADD JAVA (CLASS FILE) 1. Look for the res folder and right click.
2. Click “New” and look for Activity.
3. Then choose Empty Activity.
4. Put the Activity Name of your
java file, and unchecked Generate
Layout File.
5. Then click Finish.
JAVA CODE:
package com.example.it3e_program5;
public class DataModel {
private final String name;
private final String age;
public DataModel(String name, String age){
this.name = name;
this.age = age;
}
public String getName() {
return name;
}
public String getAge() {
return age;
}
}
IT 311-MOBILE APPLICATION DEVELOPMENT 2 Page | 4
JAVA
JAVA NAME: CustomAdapter.java
STEPS ON HOW TO ADD JAVA (CLASS FILE) 1. Look for the res folder and right click.
2. Click “New” and look for Activity.
3. Then choose Empty Activity.
4. Put the Activity Name of your
java file, and unchecked Generate
Layout File.
5. Then click Finish.
JAVA CODE:
package com.example.it3e_program5;
import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ArrayAdapter;
import android.widget.Button;
import android.widget.TextView;
import android.widget.Toast;
import androidx.annotation.NonNull;
import java.util.ArrayList;
public class CustomAdapter extends ArrayAdapter<DataModel> {
private final Context myContext;
private static class ViewHolder {
TextView tvName, tvAge;
Button btnView;
}
public CustomAdapter(ArrayList<DataModel> data, Context context) {
super(context, R.layout.row_layout, data);
this.myContext = context;
}
@NonNull
@Override
public View getView(int position, View convertView, @NonNull ViewGroup parent) {
ViewHolder viewHolder;
DataModel dataModel = getItem(position);
if (convertView == null) {
LayoutInflater inflater = LayoutInflater.from(getContext());
convertView = inflater.inflate(R.layout.row_layout, parent, false);
viewHolder = new ViewHolder();
viewHolder.tvName = convertView.findViewById(R.id.tvName);
viewHolder.tvAge = convertView.findViewById(R.id.tvAge);
viewHolder.btnView = convertView.findViewById(R.id.btnView);
convertView.setTag(viewHolder);
} else {
viewHolder = (ViewHolder) convertView.getTag();
}
if (dataModel != null) {
viewHolder.tvName.setText(dataModel.getName());
viewHolder.tvAge.setText(dataModel.getAge());
viewHolder.btnView.setOnClickListener(v -> {
Toast.makeText(myContext, "NAME: " + dataModel.getName() + "\nAGE: " +
dataModel.getAge(), Toast.LENGTH_LONG).show();
});
}
IT 311-MOBILE APPLICATION DEVELOPMENT 2 Page | 5
return convertView;
}
}
OUTPUT SEQUENCE PREVIEW
SEQUENCE 1: PREVIEW 1:
In this application, you can see the information of the
students(NAME and PROGRAM being taken).
SEQUENCE 2: PREVIEW 2:
When you click the button and it will show a custom
toast stating their name and age.
Another example for the application view. PREVIEW 3:
IT 311-MOBILE APPLICATION DEVELOPMENT 2 Page | 6
IT 311-MOBILE APPLICATION DEVELOPMENT 2 Page | 7
