뷰페이저는 손가락으로 좌우 스크롤하여 넘겨볼 수 있는 기능을 제공한다.
뷰페이저는 그 안에 프래그먼트를 넣을 수 있고 좌우 스크롤로 프래그먼트를 전환하게 된다.
뷰페이저 만들기
main_activity.xml 파일을 수정한다.
layout을 LinearLayout으로, orientation을 vertical로 바꾸고,
버튼과 ViewPager을 화면에 넣는다.
뷰페이저에 넣을 세 개의 프래그먼트를 만든다.
프래그먼트는 상단 탭 만들기에서 사용한 프래그먼트를 그대로 사용하였다.
MainActivity.java 파일을 수정한다.
먼저 어댑터 클래스를 추가한다.
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
class MyPagerAdapter extends FragmentStatePagerAdapter {
ArrayList<Fragment> items = new ArrayList<Fragment>();
public MyPagerAdapter(@NonNull FragmentManager fm) {
super(fm);
}
public void addItem(Fragment item){
items.add(item);
}
@NonNull
@Override
public Fragment getItem(int position) {
return items.get(position);
}
@Override
public int getCount() {
return items.size();
}
}
}MyPagerAdapter 클래스는 내부 클래스로 만들어졌으며 FragmentStatePagerAdapter를 상속하였다.
어댑터는 뷰페이저에 보여줄 각 프래그먼트를 관리하는 역할을 하며, 뷰페이저에 설정하면 서로 상호작용하며 화면에 표시해준다.
안에는 프래그먼트들을 담아둘 ArrayList 객체를 만들었으며 그 안에 프래그먼트 객체를 넣어둔다.
addItem 메소드는 ArrayList 객체 안에 프래그먼트를 추가하는 메소드이다.
getItem 메소드는 프래그먼트를 가져갈 수 있는 메소드이다.
getCount 메소드는 프래그먼트의 개수를 확인하는 메소드이다.
이어서 MainActivity.java의 onCreate 메소드 안에 코드를 추가한다.
public class MainActivity extends AppCompatActivity {
ViewPager pager;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
pager = findViewById(R.id.pager);
pager.setOffscreenPageLimit(3);
MyPagerAdapter adapter = new MyPagerAdapter(getSupportFragmentManager());
Fragment1 fragment1 = new Fragment1();
Fragment2 fragment2 = new Fragment2();
Fragment3 fragment3 = new Fragment3();
adapter.addItem(fragment1);
adapter.addItem(fragment2);
adapter.addItem(fragment3);
pager.setAdapter(adapter);
}XML 레이아웃에 들어 있는 ViewPager 객체를 찾아 참조하였다.
그 후 setOffscreenPagerLimit 메소드로 미리 로딩해 놓을 아이템의 개수를 세 개로 늘렸다.
pager = findViewById(R.id.pager);
pager.setOffscreenPageLimit(3);MyPagerAdapter 객체를 만들면서 FragmentManager 객체를 매개변수로 받는다.
MyPagerAdapter adapter = new MyPagerAdapter(getSupportFragmentManager());세 개의 프래그먼트를 객체로 만든 후 addItem 메소드로 어댑터 객체에 추가한다.
Fragment1 fragment1 = new Fragment1();
Fragment2 fragment2 = new Fragment2();
Fragment3 fragment3 = new Fragment3();
adapter.addItem(fragment1);
adapter.addItem(fragment2);
adapter.addItem(fragment3);ViewPager 객체에 어댑터 객체를 설정한다.
pager.setAdapter(adapter);
코드에서 화면 전환시키기
만약 사용자가 손으로 화면을 전환하지 않고 코드에서 전환시키고 싶다면 뷰페이저 객체의 setCurrentItem 메소드를 사용하면 된다.
화면에 추가한 버튼을 사용하여 화면을 전환하도록 해보겠다.
Button button = findViewById(R.id.button);
button.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
pager.setCurrentItem(1);
}
});버튼을 누르면 두 번째 프래그먼트 화면으로 바뀌게 된다.
타이틀스트립 추가
타이틀스트립은 위나 아래쪽에 전체 아이템의 개수와 현재 보고 있는 아이템이 어떤 것인지 보여주는 역할을 한다.
타이틀스트립을 추가하기 위해서는 먼저 XML 파일의 ViewPager 태그 안에 PagetTitleStrip 태그를 추가한다.
<androidx.viewpager.widget.ViewPager
android:id="@+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.viewpager.widget.PagerTitleStrip
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="top"
android:background="#55cedf"
android:textColor="#FFFFFF"
android:paddingTop="5dp"
android:paddingBottom="5dp">
</androidx.viewpager.widget.PagerTitleStrip>
</androidx.viewpager.widget.ViewPager>layout_gravity 속성의 값이 top으로 되어 있어 타이틀스트립이 뷰페이저의 위쪽에 보이게 된다.
다음으로 MainActivity.java 파일의 MyPagerAdapter 클래스에 getPagerTitle 메소드를 추가한다.
@Nullable
@Override
public CharSequence getPageTitle(int position) {
return "페이지" + position;
}
