2021. 03. 10

1. 뷰페이저(ViewPager)

뷰페이저란 좌우 스크롤을 통해 여러개의 화면을 전환할 수 있는 위젯을 말한다. 각각의 화면은 프래그먼트로 구성하며 페이저 어댑터를 통해 프래그먼트들을 관리한다. SDK에서 제공하는 FragmentStatePagerAdapter를 이용하여 구현해보도록 하겠다.

1) 레이아웃에 뷰페이저 추가

액티비티 레이아웃에 ViewPager 태그를 추가해 준다.

<android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        ></android.support.v4.view.ViewPager>

2) 어댑터 선언

위에서 언급했듯이 SDK에서 제공하는 FragmentStatePagerAdapter를 상속하는 어댑터 클래스를 하나 정의해준다. 다음은 items에 프래그먼트를 저장해놓는 CustomAdapter의 예시이다. 이때 getCount와 getItem 메소드는 반드시 오버라이드 해주어야 한다.

class CustomAdapter extends FragmentStatePagerAdapter{

        ArrayList<Fragment> items = new ArrayList<Fragment>();
        public MoviePagerAdapter(FragmentManager fm) {
            super(fm);
        }

        public void addItem(Fragment item){
            items.add(item);
        }
        @Override
        public int getCount() {
            return items.size();
        }

        @Override
        public Fragment getItem(int position) {
            return items.get(position);
        }
    }

그 후 액티비티에서 뷰페이저를 찾고 이 뷰페이저에 대한 어댑터를 setAdapter 메소드를 이용해 설정해주면 된다.

	ViewPager pager = (ViewPager) findViewById(R.id.pager);
        pager.setOffscreenPageLimit(3); // 최대 화면 갯수를 3개로

        CustomAdapter adapter = new CustomAdapter(getSupportFragmentManager());

        Fragment1 fragment = new Fragment();
        adapter.addItem(fragment); // 프래그먼트 추가
				'''

        pager.setAdapter(adapter); // 어댑터 설정

<cf>뷰페이저와 주로 같이 쓰는 타이틀스트립이라는 위젯도 존재하는데 이는 현재 뷰페이저에 대한 타이틀을 보여주는 역할을 한다.
xml 파일, 뷰페이저 태그안에 PagerTitleStrip를 선언해주고 어댑터 클래스에서 getPageTitle 메소드를 오버라이드 해주면 된다.

public CharSequence getPageTitle(int position) {
            return "페이지 "+position+"/"+items.size();
        }

2. 바로가기

바로가기란 화면에 좌상단에, 액션바의 왼쪽에 있는 표시를 누르면 나타나는 화면을 말한다.

바로가기 화면은 NavigationView를 통해 구현가능하다. 우선 xml 레이아웃 파일에 NavigationView 태그를 넣어주고 자바 파일에서 기능을 구현해 주면된다.

1) xml 레이아웃

<android.support.v4.widget.DrawerLayout 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:id="@+id/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:openDrawer="start">
    <android.support.design.widget.NavigationView
        android:id="@+id/nav_view"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:fitsSystemWindows="true"
        app:headerLayout="@layout/nav_header_main"
        app:menu="@menu/activity_main_drawer" />

</android.support.v4.widget.DrawerLayout>

DrawerLayout에 NavigationView 태그를 넣어주면 바로가기 화면이 만들어진다. 이때 바로가기 메뉴의 구성은 /res/menu 폴더에 저장한다.
간단한 예시는 다음과 같다

<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    tools:showIn="navigation_view">
    <group android:checkableBehavior="single">
        <item
            android:id="@+id/nav0"
            android:icon="@drawable/ic_menu_camera"
            android:title="첫번째" />
        <item
            android:id="@+id/nav1"
            android:icon="@drawable/ic_menu_gallery"
            android:title="두번째" />
        <item
            android:id="@+id/nav2"
            android:icon="@drawable/ic_menu_slideshow"
            android:title="세번째" />
    </group>
</menu>

2. 바로가기 아이템 기능 구현

바로가기 메뉴에서 눌렸을때 바로 호출되는 onNavigationItemSelected 메소드를 오버라이드 해주고 이를 통해 기능을 구현해주면 된다. 아래 예시는 누른 메뉴마다 onFragmentSelected라는 메소드를 실행시켜준다.

public boolean onNavigationItemSelected(MenuItem item) {
        // Handle navigation view item clicks here.
        int id = item.getItemId();

        if (id == R.id.nav0) {
            onFragmentSelected(0, null);

        } else if (id == R.id.nav1) {
            onFragmentSelected(1, null);
        } else if (id == R.id.nav2) {
            onFragmentSelected(2, null);
        }

        DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
        drawer.closeDrawer(GravityCompat.START);
        return true;
    }

좋은 웹페이지 즐겨찾기