[android] GridLayout Activity 만들기

준비물

1. 우선 import해야 할 것들이 있습니다.

레이아웃에 필요한 위젯들을 가져옵니다.

import android.support.v4.widget.SwipeRefreshLayout;
import android.support.v7.widget.GridLayoutManager;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

이렇게 하면 GridLayoutManager 혹은 LinearLayoutManager를 통해 Activity를 조작할 수 있게 됩니다. 구글에서 제공하는 것이니 믿고 써도 됩니다.

2. 그 전에 만들어 놓은 Adapter들을 가져옵니다.

import com.example.keepair.myapplication.adapter.FlowerAdapter;
import com.example.keepair.myapplication.adapter.FlowerAdapter_grid;

이것들은 나중에 설명할 것입니다. 지금은 여러 데이터들이 GridLayoutManager와 연동될 수 있도록 도와주는 역할을 한다고 알면 될 것 같습니다.

3. 레이아웃으로부터 값들을 가져옵니다.

화면에서 보여지는 것들의 값들을 가져올 필요가 있습니다.

RestManager는 따로 만든 것으로 나중에 다시 포스팅할 것입니다.

    private SwipeRefreshLayout swipeContainer_red;
    private RecyclerView mRecyclerView;
    private RestManager mRestManager;
    private FlowerAdapter_grid mFlowerAdapter;
    private TextView mCoordinatesTextGrid;

2. 함수 작성

4. GridLayout을 위한 onCreateView를 구현합니다.

    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.fragment_red, container, false);
        swipeContainer_red = (SwipeRefreshLayout) view.findViewById(R.id.swipeContainer_red);
        setRetainInstance(true);
 
        mCoordinatesTextGrid = (TextView) view.findViewById(R.id.tv_coordinates_grid);
        getGridPosts();
        swipeContainer_red.setOnRefreshListener(new SwipeRefreshLayout.OnRefreshListener() {
            @Override
            public void onRefresh() {
                getGridPosts();
            }
        });
        configViews(view);
 
        return view;
    }

OnCreateView를 통해 처음에 GridLayout을 불러올 시에 구성될 화면을 구현할 수 있습니다. SwifeRefreshLayout을 사용했습니다.

5. Posts를 가져올 함수를 지정합니다.

    private void getGridPosts() {
}

이제 이 안에 글들을 가져와서 처리만 하면 됩니다.

6. 위에서 구현한 함수를 더 자세히 지정합니다.

위 getGridPosts() 안에 들어갈 내용입니다.

        ReferSharedPreference preferenceCoordinates = new ReferSharedPreference(getContext());
        String lat = preferenceCoordinates.getValue("Lat", "13");
        String lon = preferenceCoordinates.getValue("Lon", "15");
        mCoordinatesTextGrid.setText(lat + "  , " + lon);
        mRestManager = new RestManager();
        Call<List<Flower>> listCall = mRestManager.getmFlowerApiService(getActivity()).getAllFlowers(lat, lon);
        listCall.enqueue(new Callback<List<Flower>>() {
            @Override
            public void onResponse(Call<List<Flower>> call, Response<List<Flower>> response) {
                if (response.isSuccessful()) {
                    mFlowerAdapter.clear();
                    List<Flower> flowerList = response.body();
                    for(int i =0; i<flowerList.size(); i++) {
                        Flower flower = flowerList.get(i);
                        mFlowerAdapter.addFlower(flower);
                    }
                    swipeContainer_red.setRefreshing(false);
                }
            }
            @Override
            public void onFailure(Call<List<Flower>> call, Throwable t) {
            }
        });

여기서 lat과 lon은 좌표값을 가져오는 것입니다. 이번에도 좌표값이 주어지지 않았다면 기본적으로 (13, 15) 좌표를 찾게 됩니다. 그런 다음 만들어놓은 ApiService를 이용해 비동기통신을 하여 그것을 Adapter를 이용해 추가하게 됩니다. Flower를 Post라고 생각하면 편합니다. 그 후 마지막으로 setRefreshing을 false로 설정해 자동적으로 새로고침을 반복하지 않도록 막아줍니다. 나머지 코드는 앞서 설명한 Retrofit의 Call함수입니다. 포스트에 FlowerList를 사용했습니다.

7. 환경설정을 조금만 더 해줍니다.

이렇게하면 RecyclerView의 여러가지 설정을 할 수 있습니다.

RecyclerView가 고정된 사이즈로 3개 항목을 한 줄에 나타내게끔 만들었습니다. 유행하는 스타일입니다.

    private void configViews(View view) {
        mRecyclerView = (RecyclerView) view.findViewById(R.id.rv_flower_red);
        mRecyclerView.setHasFixedSize(true);
        mRecyclerView.setRecycledViewPool(new RecyclerView.RecycledViewPool());
        mRecyclerView.setLayoutManager(new GridLayoutManager(getActivity().getApplicationContext(), 3));
        mFlowerAdapter = new FlowerAdapter_grid(this);
        mRecyclerView.setAdapter(mFlowerAdapter);
    }

8. 포스트를 클릭했을 때의 이벤트를 설정합니다.

    @Override
    public void onClick(int position) {
        Flower selectedFlower = mFlowerAdapter.getSelectedFlower(position);
        Intent intent = new Intent(getContext(), DetailActivity.class);
        intent.putExtra(Constants.REFERENCE.FLOWER, selectedFlower);
        startActivity(intent);
    }

이렇게하면 GridLayout Fragment를 완성합니다. 마지막에 intent로 포스트 클릭시에 DetailActivity 가 실행되도록 했습니다. DetailActivy는 다음에 알아보겠습니다.