개발자 승학

안드로이드 스튜디오 RecyclerView 예제(리스트뷰) 본문

it/안드로이드(android studio)

안드로이드 스튜디오 RecyclerView 예제(리스트뷰)

유승학 2018. 5. 14. 21:10

RecyclerView란?


RecyclerView 위젯은 ListView 위젯보다 유연한 고급버전입니다.

이 RecyclerView모델에서는 여러 구성 요소가 함께 작동하여 데이터를 표시합니다. 사용자 인터페이스의 전체 컨테이너는 RecyclerView레이아웃에 추가 하는 객체입니다. 이는 사용자 RecyclerView가 제공 한 레이아웃 관리자 가 제공 한보기로 채워집니다 . 표준 레이아웃 관리자 중 하나입니다.

 (예 : LinearLayoutManager또는 GridLayoutManager)를 사용하거나 직접 레이아웃 관리자를 구현할 수 있습니다


RecyclerView는 ListView의 보다 보완된 위젯입니다.

리스트 뷰의 성능의 문제들을 해결한 커스터마이징 할 수 있는 장점이 있습니다.


RecyclerView를 사용한 예제의 결과입니다.





레이아웃 수정하기.


  • LinearLayoutManager 항목을 1차원 목록으로 정렬합니다.  LinearLayoutManager와 RecyclerView를 함께 사용하면 이전의 ListView 레이아웃과 같은 기능 사용이 가능합니다.
  • GridLayoutManager는 바둑판과 같은 2차원 격자로 항목을 정렬합니다. GridLayoutManager와 RecyclerView를 사용하면 이전의 GridView 레이아웃과 비슷한 기능을 합니다.


리스트에 이름과 우측 하단에 핸드폰 번호를 보여주는 예제입니다.


먼저 RecyclerView를 사용하기 전에

1.라이브러리를 설정해야 합니다.




먼저 Gradle Scripts에서

app build.gradle에 dependencies에 마우스를 클릭하면 위와 같이 느낌표 표시가 나옵니다.





Add를 클릭후



맨 밑에


>> compile 'com.android.support:recyclerview-v7:27.1.1' 이게 추가가 됩니다.


compile을 implementation로 변경한 후 싱크해줍니다. 

여기서 주의하실점은 appcompat 버전과 recyclerview의 버전이 같아야합니다.!!!!



2.레이아웃 구성합니다.


[activity_main.xml]

<android.support.v7.widget.RecyclerView
android:id="@+id/recyclerView"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
</android.support.v7.widget.RecyclerView>

[item.xml]

<TextView
android:id="@+id/name_user"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"
android:layout_marginLeft="20dp"
android:layout_marginStart="20dp"
android:paddingLeft="20dp"
android:text="이름 입력" />

<TextView
android:id="@+id/number_user"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="right"
android:paddingRight="10dp"
android:paddingTop="75dp"
android:text="000-1234-5678"
android:textColor="@android:color/darker_gray"
android:textSize="9dp" />

main의 xml은  RecyclerView를 선언 해줍니다.

item.xml은 리스트에 담을 하나 하나의 아이템들입니다.

이미지나 버튼등 개발자의 필요에따라 추가/수정 하면 됩니다.


3. [Person.java]


public class Person {
String name;
String number;

public Person(String name, String number) {
this.name = name;
this.number = number;
}

public String getName() {
return name;
}

public void setName(String name) {
this.name = name;
}

public String getNumber() {
return number;
}

public void setNumber(String number) {
this.number = number;
}
}


데이터를 담을 모델 클래스를 생성합니다.

RecyclerView에 출력될 값들입니다.

이름과 번호를 사용하기에 name과 number 두개의 String 변수를 선언합니다.

나중에 필요한 데이터를 추가/삭제 할 때 여기서 getter와 setter를 통해서 사용할 수 있습니다.


4. [MainActivity.java]


public class MainActivity extends AppCompatActivity {

RecyclerView recyclerView;
LinearLayoutManager linearLayoutManager;
RecyclerViewAdapter recyclerViewAdapter;

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

recyclerView = findViewById(R.id.recyclerView);
linearLayoutManager = new LinearLayoutManager(this);

recyclerView.addItemDecoration(                     new DividerItemDecoration(this,linearLayoutManager.getOrientation()));
recyclerView.setLayoutManager(linearLayoutManager);

// ArrayList person 객체(이름과 번호) 넣기
List<Person> person = new ArrayList<>();
person.add(new Person("김덕배","010-1234-5678"));
person.add(new Person("강구팔","010-5678-1234"));
person.add(new Person("이배윤","010-3412-7856"));
person.add(new Person("버기","123-1256-3478"));

// Adapter생성
recyclerViewAdapter = new RecyclerViewAdapter(this,person);
recyclerView.setAdapter(recyclerViewAdapter);

}
}


5. [RecyclerViewAdapter.java]


public class RecyclerViewAdapter extends RecyclerView.Adapter<RecyclerViewAdapter.ViewHolder> {

private Activity activity;
private List<Person> person;
private MainActivity ac;

public RecyclerViewAdapter(Activity activity, List<Person> person) {
this.activity = activity;
this.person = person;
}

@Override
public int getItemCount() {
return person.size();
}

class ViewHolder extends RecyclerView.ViewHolder {
TextView name;
TextView number;

public ViewHolder(View itemView) {
super(itemView);
name = (TextView) itemView.findViewById(R.id.name_user);
number = (TextView) itemView.findViewById(R.id.number_user);
itemView.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Toast.makeText(activity, "click " +                         person.get(getAdapterPosition()).getName(), Toast.LENGTH_SHORT).show();
}
});

itemView.setOnLongClickListener(new View.OnLongClickListener() {
@Override
public boolean onLongClick(View view) {
Toast.makeText(activity, "remove " +                         person.get(getAdapterPosition()).getName(), Toast.LENGTH_SHORT).show();
removeItemView(getAdapterPosition());
return false;
}
});
}
}

public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.item, parent, false);
ViewHolder viewHolder = new ViewHolder(view);
return viewHolder;
}

// 재활용 되는 View가 호출, Adapter가 해당 position에 해당하는 데이터를 결합
@Override
public void onBindViewHolder(final ViewHolder holder, final int position) {
Person data = person.get(position);

// 데이터 결합
holder.name.setText(data.getName());
holder.number.setText(data.getNumber());
}

private void removeItemView(int position) {
person.remove(position);
notifyItemRemoved(position);
notifyItemRangeChanged(position, person.size()); // 지워진 만큼 다시 채워넣기.
}
}

Adapter - 데이터와 아이템에 대한 View생성

ViewHolder - 재활용 뷰에 대한 모든 서브 뷰를 보유


Github 깃허브


https://github.com/aiex1234/RecyclerView


이번 예제는 주어진 데이터를 RecyclerView에 띄워주는 예제입니다.


다음에는 사용자가 직접 게시글 작성과 같이 띄워주는 예제를 포스팅하겠습니다.


궁금하신점은 댓글 달아주세요!

Comments