Latest News

Custom Listview With Searchview On Actionbar/Toolbar Onitemclick Listener - Android Studio

     DESCRIPTION     

This Tutorial will cover:
✔ListView(Image , Title , Description)
✔Filterable ListView
✔SearchView on ActionBar/Toolbar to search ListView items
✔Intent to go to NewActivity onItemClick
✔BackButton in ActionBar of NewActivity

     VIDEO     


     SOURCE CODE     

Step 1: Create a new project OR Open your project

Step 2: Create New Activity File>New>Activity>EmptyActivity

Step 3: Create menu.xml under res>menu folder , to search item.

Step 4: Create model.xml in res>layout folder , to design row

Step 5: Place some images in res>drawable folder

Step 5: Code:

AndroidMenifest.xml
<?xml version="1.0" encoding="utf-8"?><manifest xmlns:android="http://schemas.android.com/apk/res/android"package="com.blogspot.devofandroid.myapplication"><applicationandroid: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><activity android:name=".NewActivity"android:parentActivityName=".MainActivity"/></application></manifest>

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"><ListViewandroid:id="@+id/listView"android:layout_width="match_parent"android:layout_height="match_parent"></ListView>
</LinearLayout>

menu.xml
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">
    <item
        android:id="@+id/action_settings"
        android:title="Settings"/>
    <item android:id="@+id/action_search"
        android:title="Search"
        android:icon="@android:drawable/ic_menu_search"
        app:showAsAction="always"
        app:actionViewClass="android.support.v7.widget.SearchView" />
</menu>

row.xml
<?xml version="1.0" encoding="utf-8"?><LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="wrap_content"android:orientation="horizontal"android:gravity="center"android:padding="10dp"><ImageViewandroid:id="@+id/mainIcon"android:src="@drawable/ic_launcher_background"android:layout_width="100dp"android:layout_height="100dp" /><LinearLayoutandroid:layout_width="match_parent"android:layout_height="wrap_content"android:orientation="vertical"android:gravity="center"android:layout_marginLeft="5dp"android:layout_marginStart="5dp"><TextViewandroid:id="@+id/mainTitle"android:text="Title"android:textStyle="bold"android:textSize="20sp"android:layout_width="match_parent"android:layout_height="wrap_content" /><TextViewandroid:id="@+id/mainDesc"android:text="Description"android:textSize="20sp"android:layout_width="match_parent"android:layout_height="wrap_content" /></LinearLayout></LinearLayout>

Model.java
package com.blogspot.devofandroid.myapplication;public class Model {String title;String desc;int icon;//constructorpublic Model(String title , String desc , int icon) {this.title = title;this.desc = desc;this.icon = icon;}//getterspublic String getTitle() {return this.title;}public String getDesc() {return this.desc;}public int getIcon() {return this.icon;}}

ListViewAdapter.java
package com.blogspot.devofandroid.myapplication;import android.content.Context;import android.content.Intent;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import android.widget.BaseAdapter;import android.widget.ImageView;import android.widget.TextView;import java.util.ArrayList;import java.util.List;import java.util.Locale;public class ListViewAdapter extends BaseAdapter{//variablesContext mContext;LayoutInflater inflater;List<Model> modellist;ArrayList<Model> arrayList;//constructorpublic ListViewAdapter(Context context , List<Model> modellist) {mContext = context;this.modellist = modellist;inflater = LayoutInflater.from(mContext);this.arrayList = new ArrayList<Model>();this.arrayList.addAll(modellist);}public class ViewHolder{TextView mTitleTv , mDescTv;ImageView mIconIv;}@Overridepublic int getCount() {return modellist.size();}@Overridepublic Object getItem(int i) {return modellist.get(i);}@Overridepublic long getItemId(int i) {return i;}@Overridepublic View getView(final int postition , View view , ViewGroup parent) {ViewHolder holder;if (view==null){holder = new ViewHolder();view = inflater.inflate(R.layout.row , null);//locate the views in row.xmlholder.mTitleTv = view.findViewById(R.id.mainTitle);holder.mDescTv = view.findViewById(R.id.mainDesc);holder.mIconIv = view.findViewById(R.id.mainIcon);view.setTag(holder);}else {holder = (ViewHolder)view.getTag();}//set the results into textviewsholder.mTitleTv.setText(modellist.get(postition).getTitle());holder.mDescTv.setText(modellist.get(postition).getDesc());//set the result in imageviewholder.mIconIv.setImageResource(modellist.get(postition).getIcon());//listview item clicksview.setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View view) {//code laterif (modellist.get(postition).getTitle().equals("Battery")){//start NewActivity with title for actionbar and text for textviewIntent intent = new Intent(mContext , NewActivity.class);intent.putExtra("actionBarTitle" , "Battery");intent.putExtra("contentTv" , "This is Battery detail...");mContext.startActivity(intent);}if (modellist.get(postition).getTitle().equals("Cpu")){//start NewActivity with title for actionbar and text for textviewIntent intent = new Intent(mContext , NewActivity.class);intent.putExtra("actionBarTitle" , "Cpu");intent.putExtra("contentTv" , "This is Cpu detail...");mContext.startActivity(intent);}if (modellist.get(postition).getTitle().equals("Display")){//start NewActivity with title for actionbar and text for textviewIntent intent = new Intent(mContext , NewActivity.class);intent.putExtra("actionBarTitle" , "Display");intent.putExtra("contentTv" , "This is Display detail...");mContext.startActivity(intent);}if (modellist.get(postition).getTitle().equals("Memory")){//start NewActivity with title for actionbar and text for textviewIntent intent = new Intent(mContext , NewActivity.class);intent.putExtra("actionBarTitle" , "Memory");intent.putExtra("contentTv" , "This is Memory detail...");mContext.startActivity(intent);}if (modellist.get(postition).getTitle().equals("Sensor")){//start NewActivity with title for actionbar and text for textviewIntent intent = new Intent(mContext , NewActivity.class);intent.putExtra("actionBarTitle" , "Sensor");intent.putExtra("contentTv" , "This is Sensor detail...");mContext.startActivity(intent);}}});return view;}//filterpublic void filter(String charText){charText = charText.toLowerCase(Locale.getDefault());modellist.clear();if (charText.length()==0){modellist.addAll(arrayList);}else {for (Model model : arrayList){if (model.getTitle().toLowerCase(Locale.getDefault()).contains(charText)){modellist.add(model);}}}notifyDataSetChanged();}}

MainActivity.java
package com.blogspot.devofandroid.myapplication;import android.support.v7.app.ActionBar;import android.support.v7.app.AppCompatActivity;import android.os.Bundle;import android.support.v7.widget.SearchView;import android.text.TextUtils;import android.view.Menu;import android.view.MenuItem;import android.widget.ListView;import java.util.ArrayList;public class MainActivity extends AppCompatActivity {ListView listView;ListViewAdapter adapter;String[] title;String[] description;int[] icon;ArrayList<Model> arrayList = new ArrayList<Model>();@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);ActionBar actionBar = getSupportActionBar();actionBar.setTitle("Items List");title = new String[]{"Battery" , "Cpu" , "Display" , "Memory" , "Sensor"};description = new String[]{"Battery detail..." , "Cpu detail..." , "Display detail..." , "Memory detail..." , "Sensor detail..."};icon = new int[]{R.drawable.battery , R.drawable.cpu , R.drawable.display , R.drawable.memory , R.drawable.sensor};listView = findViewById(R.id.listView);for (int i =0; i<title.length; i++){Model model = new Model(title[i] , description[i] , icon[i]);//bind all strings in an arrayarrayList.add(model);}//pass results to listViewAdapter classadapter = new ListViewAdapter(this , arrayList);//bind the adapter to the listviewlistView.setAdapter(adapter);}@Overridepublic boolean onCreateOptionsMenu(Menu menu) {getMenuInflater().inflate(R.menu.menu , menu);MenuItem myActionMenuItem = menu.findItem(R.id.action_search);SearchView searchView = (SearchView)myActionMenuItem.getActionView();searchView.setOnQueryTextListener(new SearchView.OnQueryTextListener() {@Overridepublic boolean onQueryTextSubmit(String s) {return false;}@Overridepublic boolean onQueryTextChange(String s) {if (TextUtils.isEmpty(s)){adapter.filter("");listView.clearTextFilter();}else {adapter.filter(s);}return true;}});return true;}@Overridepublic boolean onOptionsItemSelected(MenuItem item) {int id = item.getItemId();if (id==R.id.action_settings){//do your functionality herereturn true;}return super.onOptionsItemSelected(item);}}

activity_new.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"android:gravity="center"tools:context=".NewActivity"><TextViewandroid:id="@+id/textView"android:text="Item Detail Here..."android:textSize="30sp"android:textColor="#000"android:layout_width="wrap_content"android:layout_height="wrap_content" /></LinearLayout>

NewActivity.java
package com.blogspot.atifsoftwares.myapplication;import android.content.Intent;import android.support.v7.app.ActionBar;import android.support.v7.app.AppCompatActivity;import android.os.Bundle;import android.widget.TextView;public class NewActivity extends AppCompatActivity {@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_new);ActionBar actionBar = getSupportActionBar();TextView mDetailTv = findViewById(R.id.textView);//get data from previous activity when item of listview is clicked using intentIntent intent = getIntent();String mActionBarTitle = intent.getStringExtra("actionBarTitle");String mContent = intent.getStringExtra("contentTv");//set actionbar titleactionBar.setTitle(mActionBarTitle);//set text in textviewmDetailTv.setText(mContent); }}

Step 6: Run Project

Output
Custom ListView with SearchView on ActionBar/Toolbar & onItemClick listener - Android Studio





0 Response to "Custom Listview With Searchview On Actionbar/Toolbar Onitemclick Listener - Android Studio"