안드로이드 - 리스트뷰(ListView)에 이미지 넣기

ListView에 이미지를 넣는 방법에 대해서 간단한 소스로 알아보겠습니다.

 

1. 프로젝트 리소스(res)의 drawable 폴더에 이미지를 넣습니다.

 

2. Activity Layout XML에 ListView를 넣습니다.

<LinearLayout 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:orientation="horizontal">

    <ListView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/listView"
        android:layout_gravity="center_horizontal" />

    <!--
    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/editText"/>
    -->
</LinearLayout>

 

 

3. ListView Item Layout XML을 작성합니다.

- 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="wrap_content"
    android:orientation="horizontal"
    android:gravity="center_vertical">

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/imageView"
        android:src="@drawable/ic_launcher" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:text="Large Text"
        android:id="@+id/textView"
        android:layout_weight="1" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button"
        android:id="@+id/button" />

</LinearLayout>

 

 

- Design

 

 

4. Activity Java 소스를 작성합니다.

 - Custom Adapter의 "public View getView(int position, View convertView, ViewGroup parent)" 메소드에 도시명에 따른 이미지 지정 코드를 넣어 리스트뷰의 아이템에 이미지를 변경합니다.

public class MainActivity extends Activity {

    ListView listView;


    @Override
    protected void onResume() {
        super.onResume();
    }

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);


        listView = (ListView)this.findViewById(R.id.listView);

        ArrayList<String> items = new ArrayList<>();
        items.add("Seoul");
        items.add("Busan");
        items.add("Daegu");
        items.add("Jeju");

        CustomAdapter adapter = new CustomAdapter(this, 0, items);
        listView.setAdapter(adapter);
    }

    private class CustomAdapter extends ArrayAdapter<String> {
        private ArrayList<String> items;

        public CustomAdapter(Context context, int textViewResourceId, ArrayList<String> objects) {
            super(context, textViewResourceId, objects);
            this.items = objects;
        }

        public View getView(int position, View convertView, ViewGroup parent) {
            View v = convertView;
            if (v == null) {
                LayoutInflater vi = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);
                v = vi.inflate(R.layout.listview_item, null);
            }

            // ImageView 인스턴스
            ImageView imageView = (ImageView)v.findViewById(R.id.imageView);

            // 리스트뷰의 아이템에 이미지를 변경한다.
           if("Seoul".equals(items.get(position)))
                imageView.setImageResource(R.drawable.seoul);
            else if("Busan".equals(items.get(position)))
                imageView.setImageResource(R.drawable.busan);
            else if("Daegu".equals(items.get(position)))
                imageView.setImageResource(R.drawable.daegu);
            else if("Jeju".equals(items.get(position)))
                imageView.setImageResource(R.drawable.jeju);


            TextView textView = (TextView)v.findViewById(R.id.textView);
            textView.setText(items.get(position));

            final String text = items.get(position);
            Button button = (Button)v.findViewById(R.id.button);
            button.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    Toast.makeText(MainActivity.this, text, Toast.LENGTH_SHORT).show();
                }
            });

            return v;
        }
    }
}

 

 

 

5. 실행 결과

 - 이미지 사이즈가 제각각이라서 폭(width)가 일정하지 않네요. ㅠㅠ