Android Studio
리사이클러뷰(Recyclerview)를 사용하여 이미지 출력하기
리콜
2022. 12. 5. 14:03
리사이클러뷰는 안에 추가한 포스트 리스트 갯수 만큼만 가져와 보여주는 뷰이다.
많은수의 뷰를 일정 영역안에서 스크롤하며 계속 가져와 보여줄 수 있다는 장점이 있고 안에 넣은 뷰 만큼 가변되어 보여준다.
먼저 리사이클러뷰를 만들어준다. 프레그먼트의 레이아웃에 생성하였다.
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/PosterList"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintBottom_toTopOf="@+id/recyclerView"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
그뒤 프래그먼트.java에서 recyclerview객체를 생성한뒤 레이아웃을 넣어주었다.
onCreate에서 리사이클러뷰에 들어갈것들을 넣어주는 어댑터를 설정해준다.
private RecyclerView posterRecyclerView;
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
posterRecyclerView = view.findViewById(R.id.PosterList);
posterRecyclerView.setHasFixedSize(true);
posterRecyclerView.setLayoutManager(new LinearLayoutManager(getActivity(), RecyclerView.HORIZONTAL, false));
posters = new ArrayList<Poster>();
posterAdapter = new PosterAdapter();
posterRecyclerView.setAdapter(posterAdapter);
}
어댑터는 아래와 같이 생겼다. Glide를 이용하여 이미지뷰에 이미지를 넣고 그 이미지 뷰를 어댑터를 통해 리사이클러뷰에 넣어주는 것이다.
public class PosterAdapter extends RecyclerView.Adapter<PosterAdapter.PosterViewHolder> {
private Context context;
private ArrayList<Poster> posterList = new ArrayList<>();
public PosterAdapter()
{
}
public PosterAdapter(Context context, ArrayList<Poster> posterList){
this.context = context;
this.posterList = posterList;
}
@Override
public PosterViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
View v = LayoutInflater.from(context).inflate(R.layout.item_poster,parent,false);
return new PosterViewHolder(v);
}
@Override
public void onBindViewHolder(@NonNull final PosterViewHolder holder, int position) {
Poster currentPoster = posterList.get(position);
String imageUrl = currentPoster.getImageUrl();
Glide.with(context).load(imageUrl).into(holder.imageView);
}
@Override
public int getItemCount() {
return posterList.size();
}
public class PosterViewHolder extends RecyclerView.ViewHolder{
public ImageView imageView;
public PosterViewHolder(View itemView)
{
super(itemView);
imageView= itemView.findViewById(R.id.image_view);
}
}
}
<LinearLayout
android:id="@+id/linearLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:padding="10dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<ImageView
android:id="@+id/image_view"
android:layout_width="200dp"
android:layout_height="300dp" />
</LinearLayout>
그 뒤 저번의 volley로 요청하여 받아오는 makeRequest()에서
public void makeRequest(String url) {
StringRequest request = new StringRequest(Request.Method.GET, url, new Response.Listener<String>() {
@Override
public void onResponse(String response) {
Log.v("output popular", response); //요청 출력해보기
Gson gson = new Gson(); //gson라이브러리 선언
//ListView PosterList = view.findViewById(R.id.ListView); 리스트뷰 추가후 수정예정
MovieList movieList = gson.fromJson(response, MovieList.class); //gson으로 Json파일 object로 변환
Movie movie = movieList.results.get(0);
//Movie movie2 = movieList.results.get(1);
Movie movie3 = movieList.results.get(2);
//Movie movie4 = movieList.results.get(3);
posters = new ArrayList<Poster>();
posters.add(new Poster(movie.title.toString(), movie.poster_path));
//posters.add(new Poster(movie2.title.toString(), movie2.poster_path));
posters.add(new Poster(movie3.title.toString(), movie3.poster_path.toString()));
//posters.add(new Poster(movie4.title.toString(), movie4.poster_path.toString()));
posterAdapter = new PosterAdapter(getActivity(), posters);
posterRecyclerView.setAdapter(posterAdapter);
Log.v("Poster", posters.get(0).toString());
}
다음과 가팅 posters에 추가 한뒤 어댑터에 posters를 넣어주었다.
반응형