Term project 진행(1. 전체적인 레이아웃)

김영한·2020년 12월 4일
0

Festival_List_App

목록 보기
1/5

코드는 Github
참고


📢 개요

학부 수업 중 모바일 프로그래밍이란 수업에서 코로나 때문에 Term project로 기말고사 점수를 대신하게 되었다.
2명이서 팀을 이뤄 진행했고 지역 축제들의 정보를 알려주고 후기 게시판과 길찾기 기능이 있는 앱을 만들기로 했다.
처음으로 앱을 만들어보는 거라 많이 부족하지만 배웠던 내용을 사용할 수 있게 열심히 해봐야겠다.

이번 프로젝트에서 나는 카카오 api를 이용한 로그인 기능과 지역 축제들의 정보 레이아웃과 후기 게시판 레이아웃 구성, 메인 액티비티 db 구축을 담당했다.


📢 지역 축제들의 정보를 알려주는 레이아웃 구성

xml파일의 레이아웃 부분은 Github를 참고
참고

💡 후기 게시판 레이아웃

메인 레이아웃은 다른 팀원이 담당하고 나는 메인 레이아웃에서 이어지는 서브 레이아웃인 지역 축제 정보를 나타내주는 레이아웃과 후기 게시판 레이아웃을 만들어야했다.

메인 레이아웃 -> 정보 레이아웃, 메인 레이아웃 -> 게시판 레이아웃 대충 이런 느낌이다.

  • 정보 레이아웃은 java파일에서는 딱히 작업해줄 일이 없다.
  • 게시판 레이아웃에서는 RecyclerView를 이용해 게시판에 작성된 내용들이 나타나게 구현해주었다.

ReviewActivity

public class ReviewActivity extends AppCompatActivity {
    private RecyclerView review_list; // 리사이클러뷰 변수 선언
    public RecyclerView.LayoutManager layoutManager; //  변수와 레이아웃을 연결하는 매니저 변수 선언
    private RecyclerView.Adapter adapter; // 어뎁터 선언

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

        // 리사이클러뷰, 어뎁터 부분
        review_list = findViewById(R.id.review_view);
        review_list.setHasFixedSize(true); // 크기를 가변적으로 바꿔줌줌

        layoutManager = new LinearLayoutManager(this); // 리니어레이아웃 형태로 표시

        review_list.setLayoutManager(layoutManager); // 리사이클러뷰와 레이아웃 연결

        adapter = new ReviewAdapter(); // 어뎁터 객체 생성(어뎁터 자바 파일)
        review_list.setAdapter(adapter); // 리사이클러뷰와 어뎁터를 연결
    }
}

ReviewAdapter

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

    private String[] re_name = {"홍길동", "철수", };
    private String[] re_star = {"4/5", "5/5", };
    private String[] re_content = {"유익한 내용입니다.", "즐거웠습니다.", };

    public class ViewHolder extends RecyclerView.ViewHolder { // 홀더 설정
        public TextView r_name;
        public TextView r_star;
        public TextView r_content;

        public ViewHolder(View view) {
            super(view);
            this.r_name = view.findViewById(R.id.r_name);
            this.r_star = view.findViewById(R.id.r_star);
            this.r_content = view.findViewById(R.id.r_content);
        }
    }

    @Override
    public ReviewAdapter.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) { // 레이아웃 매니저에 의해 새 아이템을 만들고 ViewHolder를 만들어준다.
        View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.review_list, parent, false); // 레이아웃 연결
        ReviewAdapter.ViewHolder viewHolder = new ViewHolder(view);
        return viewHolder;
    }

    @Override
    public void onBindViewHolder(ReviewAdapter.ViewHolder holder, final int position) { // position에 맞는 데이터를 이용해 리스트를 채운다.
        holder.r_name.setText(re_name[position]);
        holder.r_star.setText(re_star[position]);
        holder.r_content.setText(re_content[position]);
        // 연결된 뷰들은 액션에 대한 실행을 지정할 수 있다.
    }

    @Override
    public int getItemCount() { // 리사이클러뷰의 데이터 개수를 리턴
        return re_name.length;
    }
}

어려운 내용은 아니여서 주석으로 간단하게 설명을 달았다.

일단 테스트로 적당한 String 배열을 이용해 후기 게시판을 구현했지만 나중에 팀원이 db를 활용해서 작성, 수정, 삭제 할 수 있는 실시간으로 변하는 게시판을 구현하려고 한다.


이번 포스팅은 프로젝트 계획과 전체적인 레이아웃 툴을 구현해보았다.
다음 포스팅은 db연동에 사용할 id를 쓰기 위해서 카카오 로그인 api를 연동해보도록 하겠다.

0개의 댓글