[Android] ListView 사용법 완벽 정리 (SimpleAdapter, CustomAdapter)

안드로이드에서 자주 사용되는 ListView는

 

데이터들을 한곳에 모아 깔끔하게 보여줍니다.

 

안드로이드에서 ListView를 어떻게 만드는지 알아보겠습니다.

 

ListView는

 

 

 

그림과 같이 표현이 됩니다.

 

위 그림은 가장 기본적인 ListView이며 원하는 형태의 ListView를

 

Customizing 하여 개발 할 수 있습니다.

 

 

 

 

 

● ListView 생성 흐름

 

 

 

ArrayList나 문자배열 등 Listiew에 데이터를 넣어줄

 

초기화된 데이터 형을 만들어 줍니다. (HaspMap<Obj,Obj>,  ArrayList , String[] 등)

 

초기화된 데이터를 가지고 Adapter를 거쳐 ListView 각 position에 뿌려줍니다.

 

Adapter는 ListView에 데이터를 넣어주는 중계역할을 수행합니다.

 

 

 

SimpleAdapter는 간단하게 ListView에 데이터를 넣어주며 확장이 다소 적습니다.

 

CustomAdapter는 데이터 넣어주는 방식을 원하는 대로 설정이 가능하여 확장성이 높습니다.

 

 

 

저는 SimpleAdapter보다는 CustomAdapter사용하는것을 권장하며 추후에 스크롤간 데이터 섞이는 현상도

 

방지할 수 있습니다. (데이터가 많으면 스크롤간에 데이터 섞이는 현상 발생)

 

 

 

 

● SimpleAdapter를 이용한 ListView 생성

 

activity_main.xml 을 다음과 같이 작성해줍니다.

 

<?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="match_parent" android:orientation="vertical"> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:gravity="center" android:text="ListView 생성"/> <ListView android:id="@+id/List_view" android:layout_width="match_parent" android:layout_height="match_parent"> </ListView> </LinearLayout>

 

 

● MainActivity 작성

 

package com.yoohyeok.listview; import android.app.Activity; import android.app.ListActivity; 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 Activity { private ArrayList<HashMap<String,String>> Data = new ArrayList<HashMap<String, String>>(); private HashMap<String,String> InputData1 = new HashMap<>(); private HashMap<String,String> InputData2 = new HashMap<>(); private ListView listView; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); listView =(ListView)findViewById(R.id.List_view); //데이터 초기화 InputData1.put("school","서울대"); InputData1.put("name","유혁"); Data.add(InputData1); InputData2.put("school","연세대"); InputData2.put("name","유재석"); Data.add(InputData2); //simpleAdapter 생성 SimpleAdapter simpleAdapter = new SimpleAdapter(this,Data,android.R.layout.simple_list_item_2,new String[]{"school","name"},new int[]{android.R.id.text1,android.R.id.text2}); listView.setAdapter(simpleAdapter); } }

 

 

 

 

Simple Adapter를 이용한 ListView 생성은 간단한 소스코드로 생성이 가능했습니다.

 

간단한 뷰를 구현하는데에는 편리한 방식입니다.

 

 

 

하지만 내가원하는 ListView 디자인이 있는데 SimpleAdapter로는 만들수가 없습니다.

 

내가 Adapter를 만들어서 뿌려주고 싶다

 

CustomAdapter를 만들어줍니다.

 

 

 

 

 

 

● CustomAdapter를 이용한 ListView 생성

 

 

어플리케이션에 하나의 Adapter를 만들어 통일된 디자인과 기능을 사용한다면

 

CustomAdapter 하나의 클래스를 이용하여 사용하면 편리하지만

 

ListView 형태가 각각 다른 CustomAdapter라면 여러개의 CA를 선언해야합니다.

 

 

Adapter, ListVO 패키지를 만들어 줍니다.

 

생성된 패키지 내 ListViewAdapter, ListVO 클래스를 생성합니다.

 

 

 

ListViewAdapter를 다음과 같이 작성합니다.(CustomAdapter 입니다)

 

package com.yoohyeok.listview.Adapter; import android.content.Context; import android.graphics.drawable.Drawable; 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 android.widget.Toast; import com.yoohyeok.listview.ListVO.ListVO; import com.yoohyeok.listview.R; import java.util.ArrayList; public class ListViewAdapter extends BaseAdapter { private ArrayList<ListVO> listVO = new ArrayList<ListVO>() ; public ListViewAdapter() { } @Override public int getCount() { return listVO.size() ; } // ** 이 부분에서 리스트뷰에 데이터를 넣어줌 ** @Override public View getView(int position, View convertView, ViewGroup parent) { //postion = ListView의 위치 / 첫번째면 position = 0 final int pos = position; final Context context = parent.getContext(); if (convertView == null) { LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE); convertView = inflater.inflate(R.layout.custom_listview, parent, false); } ImageView image = (ImageView) convertView.findViewById(R.id.img) ; TextView title = (TextView) convertView.findViewById(R.id.title) ; TextView Context = (TextView) convertView.findViewById(R.id.context) ; ListVO listViewItem = listVO.get(position); // 아이템 내 각 위젯에 데이터 반영 image.setImageDrawable(listViewItem.getImg()); title.setText(listViewItem.getTitle()); Context.setText(listViewItem.getContext()); //리스트뷰 클릭 이벤트 convertView.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { Toast.makeText(context, (pos+1)+"번째 리스트가 클릭되었습니다.", Toast.LENGTH_SHORT).show(); } }); return convertView; } @Override public long getItemId(int position) { return position ; } @Override public Object getItem(int position) { return listVO.get(position) ; } // 데이터값 넣어줌 public void addVO(Drawable icon, String title, String desc) { ListVO item = new ListVO(); item.setImg(icon); item.setTitle(title); item.setContext(desc); listVO.add(item); } }

 

ListVO 입니다.

 

package com.yoohyeok.listview.ListVO; import android.graphics.drawable.Drawable; /** * Created by YooJongHyeok on 2017-08-07. */ public class ListVO { private Drawable img; private String Title; private String context; public Drawable getImg() { return img; } public void setImg(Drawable img) { this.img = img; } public String getTitle() { return Title; } public void setTitle(String title) { Title = title; } public String getContext() { return context; } public void setContext(String context) { this.context = context; } }

 

 

MainActivity.class

package com.yoohyeok.listview; import android.app.Activity; import android.support.v4.content.ContextCompat; import android.os.Bundle; import android.widget.ListView; import com.yoohyeok.listview.Adapter.ListViewAdapter; public class MainActivity extends Activity { private ListView listview ; private ListViewAdapter adapter; private int[] img = {R.drawable.one,R.drawable.two,R.drawable.three}; private String[] Title = {"정준일 바램","윤종신 좋니","러블리즈 아츄"}; private String[] Context = {"정준일 명곡","윤종신 히트곡","러블리즈 히트곡"}; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); //변수 초기화 adapter = new ListViewAdapter(); listview = (ListView) findViewById(R.id.List_view); //어뎁터 할당 listview.setAdapter(adapter); //adapter를 통한 값 전달 for(int i=0; i<img.length;i++){ adapter.addVO(ContextCompat.getDrawable(this,img[i]),Title[i],Context[i]); } } }

 

 

 

activity_main.xml

 

<?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="match_parent" android:orientation="vertical"> <ListView android:id="@+id/List_view" android:layout_width="match_parent" android:layout_height="match_parent"> </ListView> </LinearLayout>

 

 

 

custom_listview.xml

 

custom_listview는 내가 원하는 listview의 디자인을 구성하시면 됩니다.

 

<?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="80dp" android:layout_margin="5dp" android:orientation="horizontal"> <ImageView android:id="@+id/img" android:layout_width="80dp" android:layout_height="80dp" /> <LinearLayout android:layout_marginLeft="5dp" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <TextView android:id="@+id/title" android:textSize="20dp" android:layout_weight="1" android:text="정주일 바램" android:layout_width="match_parent" android:layout_height="0dp" /> <TextView android:id="@+id/context" android:layout_weight="1" android:layout_width="match_parent" android:layout_height="0dp" /> </LinearLayout> </LinearLayout>

 

위 파일들을 모두 생성하였다면 drawable의 one two three 이미지를 넣어주면 됩니다.

 

혹시나 테스트해볼 이미지가 없다면 파일 이미지 다운 받으시고 복붙하시면됩니다.

 

 

마지막으로

 

프로젝트 전체 경로입니다.

 

 

 

다 만들어 보았으니 실행해봅시다.

 

 

● 결과

 

 

 

끝