안드로이드 스튜디오 리스트뷰 사용하기 - Using the Android Studio ListView

안드로이드 스튜디오 리스트뷰 사용하기

Using the Android Studio ListView

예를들어 전화번호부처럼 많은 자료를 보여줘야 할 경우가 있다.

이럴 경우 리스트뷰를 사용하면 간편하고 쉽게 사용자에게 데이터를 보여줄 수 있는데 

이번에 이러한 리스트뷰를 공부하였다. 

리스트뷰는 기본외의 서브 레이아웃xml과 인플레이션을 하기 위한 인플레이터를 한 자바코드가 있다

For example show a lot of data such as phonebook

in the case, ListView makes it simple and easy to show your data to users

this time, i studied ListView

ListView have sub layout XML outside the base and  JAVA code have inflation for inflation

<?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:orientation="vertical"
    tools:context=".MainActivity">

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

    </ListView>
</LinearLayout>

메인 레이아웃

MainLayout

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="10dp">

    <ImageView
        android:id="@+id/iamgeview"
        android:layout_width="80dp"
        android:layout_height="80dp" />

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:paddingLeft="10dp">


        <TextView
            android:id="@+id/name"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="15dp"
            android:textStyle="bold"
            android:textColor="@android:color/black"
            android:text="이름" />

        <TextView
            android:id="@+id/content"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="13dp"
            android:textStyle="bold"
            android:textColor="@android:color/black"
            android:text="내용" />

    </LinearLayout>

</LinearLayout>

메인 레인아웃의 ListView에 넣을 sub 레이아웃

Sub layout to be placed in ListView of main layout

// inner class _ Adapter class
class testAdapter extends BaseAdapter {

    ArrayList<UserDTO> items = new ArrayList<UserDTO>();

    // 데이터 추가 메소드 - add date method
    public void addItem(UserDTO dto) {
        items.add(dto);
    }

    @Override
    public int getCount() {
        return items.size();
    }

    @Override
    public Object getItem(int position) {
        return items.get(position);
    }

    @Override
    public long getItemId(int position) {
        return position;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        // ListView_Inflater 인스턴스 생성 - ListView_Inflater instance generate
        ListView_Inflater view = new ListView_Inflater(getApplicationContext());


        UserDTO dto = items.get(position);
        view.setName(dto.getName());
        view.setcontent(dto.getContent());
        view.setImageView(dto.getResId());

        return view;
    }
}

데이터를 ListView에 뿌려주기 위한 Adapter을 생성한다.

여기서 extends는 BaseAdapter을 하도록 한다. 그리고 getCount, getItem, getItemId, getView를 오버라이딩을 한다.

뿌려주는 데이터는 한개가 아니라 여러개의 속성을 가질 수 있으므로 ArrayList를 통해 객체화를 한다.

Generate Adapter for data give to ListVIew

thr point is Extends in the BaseAdapter. and, overriding getCount, getItem, getItemId, getView

Data to show is not one but anymore so, generate ArrayList

import android.content.Context;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.TextView;

public class ListView_Inflater extends LinearLayout {

    // ID
    private ImageView imageView;
    private TextView user_Name;
    private TextView user_Content;

    // 생성자 - Constructor
    public ListView_Inflater(Context context) {
        super(context);

        init(context);
    }

    // 생성자 - Constructor
    public ListView_Inflater(Context context, AttributeSet attrs) {
        super(context, attrs);

        init(context);
    }

    private void init(Context context) {

        // 인플레이션을 하기 위한 인플레이터
        // Inflater to do inflation
        LayoutInflater inflater = (LayoutInflater) context.getSystemService
                (context.LAYOUT_INFLATER_SERVICE);
        inflater.inflate(R.layout.listview_item, this, true);

        // catch ID
        imageView = (ImageView) findViewById(R.id.iamgeview);
        user_Name = (TextView) findViewById(R.id.name);
        user_Content = (TextView) findViewById(R.id.content);
    }

    // add image method
    public void setImageView(int resId) {
        imageView.setImageResource(resId);
    }

    // add name method
    public void setName(String name) {
        user_Name.setText(name);
    }

    // add content method
    public void setcontent(String content) {
        user_Content.setText(content);
    }
}

생성자 2개를 만든 후

sub 레이아웃을 메모리에 올리기 위해 인플레이터를 한다.

후에 sub 레이아웃의 위젯의 아이디를 통해 가지고 온다.

추가로 각각 set 메소드를 만든다

after make a two Constructor 

Do the inflater for put sub layout in the memory 

bring on Id of widget

in additional make a each set method

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

    // ListView 아이디 : ListView Id
    listView = (ListView)findViewById(R.id.listView);
    // testAdapter 인스턴스 생성 : testAdapter Instance generate
    testAdapter testAdapter = new testAdapter();
    // ListView Set Adapter
    listView.setAdapter(testAdapter);

    //Test Data
    testAdapter.addItem(new UserDTO("ㅋㅋㅋ", "행복해지고 싶다", R.drawable.protest1));
    testAdapter.addItem(new UserDTO("덕써이", "아! 수여니!!", R.drawable.protest2));
    testAdapter.addItem(new UserDTO("떠려니", "떠려떠련", R.drawable.protest3));
    testAdapter.addItem(new UserDTO("마요미", "아우 때릴 뻔 했네", R.drawable.protest4));
    testAdapter.addItem(new UserDTO("수원통닭", "세상에 이런맛은 없었다.", R.drawable.protest5));


}

메인 액티비티에서 ListView의 아이디를 가지고 온다.

위에서 만든 Adapter을 인스턴스화 한다.

ListView.setAdapter(adapter)을 통해 ListView에 아답터를 붙여 데이터가 붙게 한다.

아래 TestData는 5개를 테스트로 데이터를 넣어본것이다.

bring on Id of ListView in MainActivity

generate Adapter

ListView.setAdapter(adapter) allows the data attached by ListView attached adapter

TestData are testdata