Android Studio - 네트워크로 받은 JSON Array를 RecyclerView로 표시하기

0. 구현할 기능

• 네트워크로부터 JSON의 Array를 받아와서, 리사이클러 뷰를 사용해 하나씩 보여준다.
• 테스트 데이터는 https://jsonplaceholder.typicode.com/posts 로부터 받아온다.
• 네트워크 통신은 Volley 라이브러리를 사용한다.

 

 

1. 권한 설정

• build.gradle에 Volley 라이브러리를 추가해 준다.
• 아래 포스팅을 참고해 통신 권한을 준다

https://donghyeok90.tistory.com/265

Android Studio - 안드로이드 네트워크 통신 권한 설정하기(+에뮬레이터 설정)

 

 

 

 

2. 화면 개발

메인액티비티의 xml 코드

// activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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"
    tools:context=".MainActivity">

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/recyclerView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

 

 

리사이클러뷰의 한 행을 처리할 xml 코드

// post_row.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="vertical">

    <TextView
        android:id="@+id/txtTitle"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginLeft="15dp"
        android:layout_marginTop="7dp"
        android:layout_marginRight="15dp"
        android:layout_marginBottom="7dp"
        android:ellipsize="end"
        android:maxLines="1"
        android:text="TextView"
        android:textSize="22sp" />

    <TextView
        android:id="@+id/txtBody"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginLeft="25dp"
        android:layout_marginRight="15dp"
        android:layout_marginBottom="7dp"
        android:ellipsize="end"
        android:maxLines="3"
        android:text="TextView"
        android:textSize="22sp" />
</LinearLayout>

 

 

 

3. 데이터를 묶어서 처리할 클래스

 

// Post.java
public class Post {
    public int userId;
    public int id;
    public String title;
    public String body;


    public Post(){

    }
    public Post(int userId, int id, String title, String body) {
        this.userId = userId;
        this.id = id;
        this.title = title;
        this.body = body;
    }
}

 

 

 

4. 리사이클러뷰 어댑터

// PostAdapter.java

import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;

import androidx.annotation.NonNull;
import androidx.recyclerview.widget.RecyclerView;

import com.android.volley.toolbox.JsonArrayRequest;
import com.reodinas2.networkapp2.R;
import com.reodinas2.networkapp2.model.Post;

import java.util.ArrayList;


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

    Context context;
    ArrayList<Post> postList;

    public PostAdapter(Context context, ArrayList<Post> postList) {
        this.context = context;
        this.postList = postList;
    }

    @NonNull
    @Override
    public PostAdapter.ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
        // xml 파일을 연결하는 작업
        View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.post_row, parent, false);
        return new PostAdapter.ViewHolder(view);
    }

    @Override
    public void onBindViewHolder(@NonNull PostAdapter.ViewHolder holder, int position) {
        // 뷰에 데이터를 셋팅한다.
        Post post = postList.get(position);

        holder.txtTitle.setText(post.title);
        holder.txtBody.setText(post.body);
    }

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

    public class ViewHolder extends RecyclerView.ViewHolder {

        TextView txtTitle;
        TextView txtBody;

        public ViewHolder(@NonNull View itemView) {
            super(itemView);

            txtTitle = itemView.findViewById(R.id.txtTitle);
            txtBody = itemView.findViewById(R.id.txtBody);


        }
    }
}

 

 

 

5. 메인 액티비티

// MainActivity.java

import androidx.appcompat.app.AppCompatActivity;
import androidx.recyclerview.widget.DividerItemDecoration;
import androidx.recyclerview.widget.LinearLayoutManager;
import androidx.recyclerview.widget.RecyclerView;

import android.os.Bundle;

import com.android.volley.Request;
import com.android.volley.RequestQueue;
import com.android.volley.Response;
import com.android.volley.VolleyError;
import com.android.volley.toolbox.JsonArrayRequest;
import com.android.volley.toolbox.Volley;
import com.reodinas2.networkapp2.adapter.PostAdapter;
import com.reodinas2.networkapp2.model.Post;

import org.json.JSONArray;
import org.json.JSONException;
import org.json.JSONObject;

import java.util.ArrayList;

public class MainActivity extends AppCompatActivity {

    RecyclerView recyclerView;
    PostAdapter adapter;
    ArrayList<Post> postList = new ArrayList<>();

    final String URL = "https://jsonplaceholder.typicode.com";

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

        recyclerView = findViewById(R.id.recyclerView);
        recyclerView.setHasFixedSize(true);
        recyclerView.setLayoutManager(new LinearLayoutManager(MainActivity.this));

        // 리사이클러 뷰에 구분선 넣기
        DividerItemDecoration dividerItemDecoration =
                new DividerItemDecoration(getApplicationContext(),new LinearLayoutManager(this).getOrientation());
        recyclerView.addItemDecoration(dividerItemDecoration);

        // 데이터를 네트워크에서 받아온다.
        // Volley로 네트워크 통신한다.
        RequestQueue queue = Volley.newRequestQueue(MainActivity.this);

        // request 만든다.
        JsonArrayRequest request = new JsonArrayRequest(
                Request.Method.GET,
                URL + "/posts",
                null,
                new Response.Listener<JSONArray>() {
                    @Override
                    public void onResponse(JSONArray response) {

                        for (int i = 0; i < response.length(); i++){
                            try {
                                JSONObject data = response.getJSONObject(i);

                                Post post = new Post(data.getInt("userId"),
                                                     data.getInt("id"),
                                                     data.getString("title"),
                                                     data.getString("body"));
                                postList.add(post);

                            } catch (JSONException e) {
                                return;
                            }
                        }

                        adapter = new PostAdapter(MainActivity.this, postList);
                        recyclerView.setAdapter(adapter);


                    }
                },
                new Response.ErrorListener() {
                    @Override
                    public void onErrorResponse(VolleyError error) {

                    }
                }

        );
        queue.add(request);

    }
}

 

 

 

6. 앱 실행 결과