Android Studio Tutorial for Beginners, How to Custom ListView with Image and Text Example using ArrayAdapter? this lesson will show you how to Custom ListView with Image and Text Example
In this lesson, we ill learn how to create a custom Android listview using images and TextView in each list item. To display image, topic, and description in ListView we have to create a new XML file in res/layout folder and add ImageView and TextView.
To implement ListView in android, you have to work more in java activity file. ListView is a common component/layout in android application. It is difficult to make some awesome application without using listview like news app, tutorial app, social app, etc.
Follow our social media and see you next lessons ...
To implement ListView in android, you have to work more in java activity file. ListView is a common component/layout in android application. It is difficult to make some awesome application without using listview like news app, tutorial app, social app, etc.
Video Tutorial Custom ListView with Image and Text Example using ArrayAdapter
Source Code Custom ListView with Image and Text
activity_main.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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<ListView
android:background="#fff"
android:id="@+id/list_view"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
</ListView>
</LinearLayout>listview_items.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:orientation="horizontal"
android:padding="7dp"
android:layout_height="match_parent">
<ImageView
android:id="@+id/listview_images"
android:layout_width="wrap_content"
android:padding="10dp"
android:layout_height="wrap_content" />
<LinearLayout
android:padding="7dp"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="@+id/Title"
android:textSize="12sp"
android:textStyle="bold"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:id="@+id/DEscription"
android:textSize="10sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>MainActivity.java
package com.codeajaib.listview;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.ListView;
import android.widget.SimpleAdapter;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
public class MainActivity extends AppCompatActivity {
// we will create array data and store to listview
// title
String[] ListviewTitle = new String[]{
"Listview Title 1","Listview Title 2","Listview Title 3","Listview Title 4","Listview Title 5",
"Listview Title 6","Listview Title 7","Listview Title 8","Listview Title 9","Listview Title 10",
"Listview Title 11","Listview Title 12","Listview Title 13","Listview Title 14","Listview Title 15",
"Listview Title 16","Listview Title 17","Listview Title 18","Listview Title 19","Listview Title 20"
};
// description
String[] ListviewDescription = new String[]{
"Listview Description 1","Listview Description 2","Listview Description 3","Listview Description 4",
"Listview Description 5","Listview Description 6","Listview Description 7","Listview Description 8",
"Listview Description 9","Listview Description 10","Listview Description 11","Listview Description 12",
"Listview Description 13","Listview Description 14","Listview Description 15","Listview Description 16",
"Listview Description 17","Listview Description 18","Listview Description 19","Listview Description 20"
};
// images
int[] ListviewImages = new int[]{
R.drawable.ic_sentiment_very_dissatisfied_black_24dp,R.drawable.ic_sentiment_very_satisfied_black_24dp,R.drawable.ic_person_black_24dp,R.drawable.ic_sentiment_very_dissatisfied_black_24dp,
R.drawable.ic_person_black_24dp,R.drawable.ic_sentiment_very_satisfied_black_24dp,R.drawable.ic_person_black_24dp,R.drawable.ic_sentiment_very_dissatisfied_black_24dp,
R.drawable.ic_sentiment_very_satisfied_black_24dp,R.drawable.ic_sentiment_very_dissatisfied_black_24dp,R.drawable.ic_sentiment_very_dissatisfied_black_24dp,R.drawable.ic_person_black_24dp,
R.drawable.ic_person_black_24dp,R.drawable.ic_sentiment_very_satisfied_black_24dp,R.drawable.ic_sentiment_very_dissatisfied_black_24dp,R.drawable.ic_person_black_24dp,
R.drawable.ic_person_black_24dp,R.drawable.ic_person_black_24dp,R.drawable.ic_sentiment_very_satisfied_black_24dp,R.drawable.ic_sentiment_very_dissatisfied_black_24dp
};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
List<HashMap<String,String>> aList = new ArrayList<HashMap<String, String>>();
for (int x = 0; x < 20; x++){
HashMap<String, String> hm = new HashMap<String,String>();
hm.put("ListTitle",ListviewTitle[x]);
hm.put("ListDescription",ListviewDescription[x]);
hm.put("ListImages",Integer.toString(ListviewImages[x]));
aList.add(hm);
}
String[] from = {
"ListImages","ListTitle","ListDescription"
};
int[] to = {
R.id.listview_images,R.id.Title,R.id.DEscription
};
SimpleAdapter simpleAdapter = new SimpleAdapter(getBaseContext(),aList, R.layout.listview_items,from,to);
ListView simpleListview = (ListView)findViewById(R.id.list_view);
simpleListview.setAdapter(simpleAdapter);
}
}AndroidManifest.xml
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.codeajaib.listview">
<application
android:allowBackup="true"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:roundIcon="@mipmap/ic_launcher_round"
android:supportsRtl="true"
android:theme="@style/AppTheme">
<activity android:name=".MainActivity">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
</manifest>
Follow our social media and see you next lessons ...
COMMENTS