Android ViewPager2 + TabView JAVA

0. Gradle 셋팅

밑에 3개 추가

    implementation 'androidx.viewpager2:viewpager2:1.1.0-alpha01'

    implementation 'com.android.support:design:28.0.0'

    implementation 'androidx.viewpager2:viewpager2:1.0.0-alpha04' //뷰페이저 2

1.TabListActivity셋팅

 

public class TabListActivity extends AppCompatActivity {
    ViewPager2 viewPager2; //뷰페이저
    ViewPagerAdapter viewPagerAdapter; //뷰페이저 어뎁터
    TabLayout tabLayout; //텝 레이아웃
    ArrayList <Data_Type>mdata; //데이터 모델
    Context context;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_tab_list);

        context = this;
        mdata = new ArrayList<>();

        viewPager2 = findViewById(R.id.notification_list_container);
        tabLayout = findViewById(R.id.notification_list_tabs);

//        tabLayout.addTab(tabLayout.newTab().setText("A")); //텝 레이아웃 아이템 추가
//        tabLayout.addTab(tabLayout.newTab().setText("B"));
//        tabLayout.addTab(tabLayout.newTab().setText("C"));

        mdata.add(new Data_Type(1));
        mdata.add(new Data_Type(2));
        mdata.add(new Data_Type(3));


        viewPagerAdapter = new ViewPagerAdapter(context ,mdata); //뷰페이저 어뎁터 생성
        viewPager2.setAdapter(viewPagerAdapter);//어뎁터 연결
        viewPager2.setOrientation(ViewPager2.ORIENTATION_HORIZONTAL); //스크롤방향


        TabLayoutMediator tabLayoutMediator = new TabLayoutMediator(tabLayout, viewPager2, true, new TabLayoutMediator.TabConfigurationStrategy() {
            @Override
            public void onConfigureTab(@NonNull TabLayout.Tab tab, int position) {// 텝 레이아웃이랑 연결
                switch (position){
                    case 0:{
                        tab.setText("A"); //텝레이아웃 상단 타이틀 제목 설정
                        break;
                    }
                    case 1:{
                        tab.setText("B");
                        break;
                    }
                    case 2:{
                        tab.setText("C");
                        break;
                    }
                }

            }
        });

        tabLayoutMediator.attach();

        viewPager2.registerOnPageChangeCallback(new ViewPager2.OnPageChangeCallback() { //뷰페이저 해당 포지션 위치
            @Override
            public void onPageSelected(int position) {
                super.onPageSelected(position);

                switch (position){
                    case 0://A
                    {
                        Toast.makeText(context, "A", Toast.LENGTH_SHORT).show();
                        break;
                    }
                    case 1://B
                    {
                        Toast.makeText(context, "B", Toast.LENGTH_SHORT).show();
                        break;
                    }
                    case 2://C
                    {
                        Toast.makeText(context, "C", Toast.LENGTH_SHORT).show();
                        break;
                    }
                }
            }
        });
    }


}

 

2.TabListActivity xml 셋팅

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">


    <com.google.android.material.appbar.AppBarLayout
        android:id="@+id/appbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">


        <com.google.android.material.tabs.TabLayout
            android:id="@+id/notification_list_tabs"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="#00ffff"
            app:tabSelectedTextColor="#000000"
            app:tabTextColor="#bbbbbb"
            app:tabIndicatorColor="#FF0000"
            app:tabGravity="fill"
            app:tabMode="fixed"
            app:tabIndicatorHeight="2dp">

        </com.google.android.material.tabs.TabLayout>
    </com.google.android.material.appbar.AppBarLayout>

    <androidx.viewpager2.widget.ViewPager2
        android:id="@+id/notification_list_container"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#f2f2f2"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

    </androidx.viewpager2.widget.ViewPager2>



</LinearLayout>

 

3.Data_Type Model 셋팅

public class Data_Type { // 타입으로 페이지 나눔
    int type;

    public Data_Type(int type) {
        this.type = type;
    }

    public int getType() {
        return type;
    }
}

 

4.ViewPagerAdapter 셋팅

 

public class ViewPagerAdapter extends RecyclerView.Adapter<RecyclerView.ViewHolder> {
    Context context;
    LayoutInflater inflater;
    ArrayList<Data_Type> mdata; //데이터 모델 받아오기

    ViewPagerAdapter(Context context, ArrayList<Data_Type> mdata) {
        this.context = context;
        this.mdata = mdata;
        inflater = LayoutInflater.from(context);
    }

    @NonNull
    @Override
    public RecyclerView.ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
        switch (viewType) { //viewType = getItemViewType 지정해준 Data_Type 에 type
            case 1: { // A 뷰홀더
                View view = inflater.inflate(R.layout.type_a, parent, false);

                return new A_ViewHolder(view,viewType);
            }

            case 2:{// B 뷰홀더
                View view = inflater.inflate(R.layout.type_b, parent, false);

                return new B_ViewHolder(view,viewType);
            }
            case 3:{// C 뷰홀더
                View view = inflater.inflate(R.layout.type_c, parent, false);

                return new C_ViewHolder(view,viewType);

            }
        }

        return null;

    }

    @Override
    public void onBindViewHolder(@NonNull RecyclerView.ViewHolder holder, int position) {

    }

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

    @Override
    public int getItemViewType(int position) {
        switch (mdata.get(position).getType()){ //데이터 모델에서 Type 을 받아들여 ItemViewType으로 씀
            case 1: // A
                return 1;
            case 2: // B
                return 2;
            case 3:// C
                return 3;
        }
        return 1;
    }



}

 

 

5. ViewHolder 셋팅

A뷰홀더랑 똑같이 B ,C 뷰홀더를 생성

public class A_ViewHolder extends RecyclerView.ViewHolder {
    int a;
    TextView textView;
    public A_ViewHolder(@NonNull View itemView , int a ) { //뷰홀더에서 작업들 실행
        super(itemView);

        this.a = a;

        textView = itemView.findViewById(R.id.a_textview);

        textView.setText(String.valueOf(a));
    }
}

 

6. ViewHolder Item 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"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/colorPrimary">

    <TextView
        android:id="@+id/a_textview"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textColor="#ffffff"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

 

 

완성본

 

 

 

정말 간단하게 만들어본 ViewPager 2 와 TabLayout 입니다

ViewPager2 페이지에서의 작업들은 ViewHolder 에서 작업하시면 됩니다

ViewPager2 가 코틀린 소스들은 많은데 자바 소스들은 많이 없어서 정리해서 올립니다.