Android + kotlin + ViewPager2 でカレンダーの横スクロールを実現する

概要

今回は前回作った6月のカレンダーをスクロールして、7,8月のカレンダーも見れるようにしたいと思います。

技術テーマ

• ViewPager2

横スクロールにはViewPagerは避けては通れないのでそちらを使って実装していこうと思います。

手順

Fragmentの作成

ViewPagerではスクロールすることでfragmentが切り替わるというものなので、今までActivityしか使ってなかったのですが、メインの処理をFragmentに移行したいと思います。

fragment_calendar.xml

<layout 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">

    <data>

        <variable
            name="date"
            type="String[]" />
    </data>

    <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context=".MainActivity">

        <!--縦分割のガイドライン-->
        <androidx.constraintlayout.widget.Guideline
            android:id="@+id/youbi"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            app:layout_constraintGuide_percent="0.1" />

        <androidx.constraintlayout.widget.Guideline
            android:id="@+id/line_1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            app:layout_constraintGuide_percent="0.25" />

        <androidx.constraintlayout.widget.Guideline
            android:id="@+id/line_2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            app:layout_constraintGuide_percent="0.40" />

        <androidx.constraintlayout.widget.Guideline
            android:id="@+id/line_3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            app:layout_constraintGuide_percent="0.55" />

        <androidx.constraintlayout.widget.Guideline
            android:id="@+id/line_4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            app:layout_constraintGuide_percent="0.70" />

        <androidx.constraintlayout.widget.Guideline
            android:id="@+id/line_5"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            app:layout_constraintGuide_percent="0.85" />

        <androidx.constraintlayout.widget.Guideline
            android:id="@+id/line_6"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            app:layout_constraintGuide_percent="1" />

        <!--横分割のガイドライン-->
        <androidx.constraintlayout.widget.Guideline
            android:id="@+id/row1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            app:layout_constraintGuide_percent="0.14" />

        <androidx.constraintlayout.widget.Guideline
            android:id="@+id/row2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            app:layout_constraintGuide_percent="0.28" />

        <androidx.constraintlayout.widget.Guideline
            android:id="@+id/row3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            app:layout_constraintGuide_percent="0.42" />

        <androidx.constraintlayout.widget.Guideline
            android:id="@+id/row4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            app:layout_constraintGuide_percent="0.56" />

        <androidx.constraintlayout.widget.Guideline
            android:id="@+id/row5"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            app:layout_constraintGuide_percent="0.70" />

        <androidx.constraintlayout.widget.Guideline
            android:id="@+id/row6"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            app:layout_constraintGuide_percent="0.84" />

        <androidx.constraintlayout.widget.Guideline
            android:id="@+id/row7"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            app:layout_constraintGuide_percent="1" />


        <TextView
            android:id="@+id/sunday"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style_red"
            android:gravity="center_horizontal|center_vertical"
            android:text="Sun"
            app:layout_constraintBottom_toBottomOf="@id/youbi"
            app:layout_constraintEnd_toEndOf="@id/row1"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent" />


        <TextView
            android:id="@+id/monday"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style"
            android:gravity="center_horizontal|center_vertical"
            android:text="Mon"
            app:layout_constraintBottom_toBottomOf="@id/youbi"
            app:layout_constraintEnd_toEndOf="@id/row2"
            app:layout_constraintStart_toEndOf="@+id/row1"
            app:layout_constraintTop_toTopOf="@+id/sunday" />

        <TextView
            android:id="@+id/tuesday"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style"
            android:gravity="center_horizontal|center_vertical"
            android:text="Tue"
            app:layout_constraintBottom_toBottomOf="@id/youbi"
            app:layout_constraintEnd_toEndOf="@id/row3"
            app:layout_constraintStart_toEndOf="@+id/row2"
            app:layout_constraintTop_toTopOf="@+id/sunday" />

        <TextView
            android:id="@+id/wednesday"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style"
            android:gravity="center_horizontal|center_vertical"
            android:text="Wed"
            app:layout_constraintBottom_toBottomOf="@id/youbi"
            app:layout_constraintEnd_toEndOf="@id/row4"
            app:layout_constraintStart_toEndOf="@+id/row3"
            app:layout_constraintTop_toTopOf="@+id/sunday" />

        <TextView
            android:id="@+id/thursday"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style"
            android:gravity="center_horizontal|center_vertical"
            android:text="Thu"
            app:layout_constraintBottom_toBottomOf="@id/youbi"
            app:layout_constraintEnd_toEndOf="@id/row5"
            app:layout_constraintStart_toEndOf="@+id/row4"
            app:layout_constraintTop_toTopOf="@+id/sunday" />

        <TextView
            android:id="@+id/friday"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style"
            android:gravity="center_horizontal|center_vertical"
            android:text="Fri"
            app:layout_constraintBottom_toBottomOf="@id/youbi"
            app:layout_constraintEnd_toEndOf="@id/row6"
            app:layout_constraintStart_toEndOf="@+id/row5"
            app:layout_constraintTop_toTopOf="@+id/sunday" />

        <TextView
            android:id="@+id/saturday"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style_blue"
            android:gravity="center_horizontal|center_vertical"
            android:text="Sat"
            app:layout_constraintBottom_toBottomOf="@id/youbi"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toEndOf="@id/row6"
            app:layout_constraintTop_toTopOf="@+id/sunday" />


        <TextView
            android:id="@+id/cell_1"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style_red"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[0]}"
            app:layout_constraintBottom_toBottomOf="@id/line_1"
            app:layout_constraintEnd_toEndOf="@id/row1"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="@id/youbi" />


        <TextView
            android:id="@+id/cell_2"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[1]}"
            app:layout_constraintBottom_toBottomOf="@id/line_1"
            app:layout_constraintEnd_toEndOf="@id/row2"
            app:layout_constraintStart_toEndOf="@+id/row1"
            app:layout_constraintTop_toTopOf="@id/youbi" />

        <TextView
            android:id="@+id/cell_3"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[2]}"
            app:layout_constraintBottom_toBottomOf="@id/line_1"
            app:layout_constraintEnd_toEndOf="@id/row3"
            app:layout_constraintStart_toEndOf="@+id/row2"
            app:layout_constraintTop_toTopOf="@id/youbi" />

        <TextView
            android:id="@+id/cell_4"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[3]}"
            app:layout_constraintBottom_toBottomOf="@id/line_1"
            app:layout_constraintEnd_toEndOf="@id/row4"
            app:layout_constraintStart_toEndOf="@+id/row3"
            app:layout_constraintTop_toTopOf="@id/youbi" />

        <TextView
            android:id="@+id/cell_5"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[4]}"
            app:layout_constraintBottom_toBottomOf="@id/line_1"
            app:layout_constraintEnd_toEndOf="@id/row5"
            app:layout_constraintStart_toEndOf="@+id/row4"
            app:layout_constraintTop_toTopOf="@id/youbi" />

        <TextView
            android:id="@+id/cell_6"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[5]}"
            app:layout_constraintBottom_toBottomOf="@id/line_1"
            app:layout_constraintEnd_toEndOf="@id/row6"
            app:layout_constraintStart_toEndOf="@+id/row5"
            app:layout_constraintTop_toTopOf="@id/youbi" />

        <TextView
            android:id="@+id/cell_7"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style_blue"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[6]}"
            app:layout_constraintBottom_toBottomOf="@id/line_1"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toEndOf="@id/row6"
            app:layout_constraintTop_toTopOf="@id/youbi" />

        <TextView
            android:id="@+id/cell_21"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style_red"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[7]}"
            app:layout_constraintBottom_toBottomOf="@id/line_2"
            app:layout_constraintEnd_toEndOf="@id/row1"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="@id/line_1" />


        <TextView
            android:id="@+id/cell_22"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[8]}"
            app:layout_constraintBottom_toBottomOf="@id/line_2"
            app:layout_constraintEnd_toEndOf="@id/row2"
            app:layout_constraintStart_toEndOf="@+id/row1"
            app:layout_constraintTop_toTopOf="@id/line_1" />

        <TextView
            android:id="@+id/cell_23"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[9]}"
            app:layout_constraintBottom_toBottomOf="@id/line_2"
            app:layout_constraintEnd_toEndOf="@id/row3"
            app:layout_constraintStart_toEndOf="@+id/row2"
            app:layout_constraintTop_toTopOf="@id/line_1" />

        <TextView
            android:id="@+id/cell_24"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[10]}"
            app:layout_constraintBottom_toBottomOf="@id/line_2"
            app:layout_constraintEnd_toEndOf="@id/row4"
            app:layout_constraintStart_toEndOf="@+id/row3"
            app:layout_constraintTop_toTopOf="@id/line_1" />

        <TextView
            android:id="@+id/cell_25"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[11]}"
            app:layout_constraintBottom_toBottomOf="@id/line_2"
            app:layout_constraintEnd_toEndOf="@id/row5"
            app:layout_constraintStart_toEndOf="@+id/row4"
            app:layout_constraintTop_toTopOf="@id/line_1" />

        <TextView
            android:id="@+id/cell_26"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[12]}"
            app:layout_constraintBottom_toBottomOf="@id/line_2"
            app:layout_constraintEnd_toEndOf="@id/row6"
            app:layout_constraintStart_toEndOf="@+id/row5"
            app:layout_constraintTop_toTopOf="@id/line_1" />

        <TextView
            android:id="@+id/cell_27"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style_blue"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[13]}"
            app:layout_constraintBottom_toBottomOf="@id/line_2"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toEndOf="@id/row6"
            app:layout_constraintTop_toTopOf="@id/line_1" />

        <TextView
            android:id="@+id/cell_31"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style_red"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[14]}"
            app:layout_constraintBottom_toBottomOf="@id/line_3"
            app:layout_constraintEnd_toEndOf="@id/row1"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="@id/line_2" />


        <TextView
            android:id="@+id/cell_32"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[15]}"
            app:layout_constraintBottom_toBottomOf="@id/line_3"
            app:layout_constraintEnd_toEndOf="@id/row2"
            app:layout_constraintStart_toEndOf="@+id/row1"
            app:layout_constraintTop_toTopOf="@id/line_2" />

        <TextView
            android:id="@+id/cell_33"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[16]}"
            app:layout_constraintBottom_toBottomOf="@id/line_3"
            app:layout_constraintEnd_toEndOf="@id/row3"
            app:layout_constraintStart_toEndOf="@+id/row2"
            app:layout_constraintTop_toTopOf="@id/line_2" />

        <TextView
            android:id="@+id/cell_34"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[17]}"
            app:layout_constraintBottom_toBottomOf="@id/line_3"
            app:layout_constraintEnd_toEndOf="@id/row4"
            app:layout_constraintStart_toEndOf="@+id/row3"
            app:layout_constraintTop_toTopOf="@id/line_2" />

        <TextView
            android:id="@+id/cell_35"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[18]}"
            app:layout_constraintBottom_toBottomOf="@id/line_3"
            app:layout_constraintEnd_toEndOf="@id/row5"
            app:layout_constraintStart_toEndOf="@+id/row4"
            app:layout_constraintTop_toTopOf="@id/line_2" />

        <TextView
            android:id="@+id/cell_36"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[19]}"
            app:layout_constraintBottom_toBottomOf="@id/line_3"
            app:layout_constraintEnd_toEndOf="@id/row6"
            app:layout_constraintStart_toEndOf="@+id/row5"
            app:layout_constraintTop_toTopOf="@id/line_2" />

        <TextView
            android:id="@+id/cell_37"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style_blue"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[20]}"
            app:layout_constraintBottom_toBottomOf="@id/line_3"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toEndOf="@id/row6"
            app:layout_constraintTop_toTopOf="@id/line_2" />

        <TextView
            android:id="@+id/cell_41"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style_red"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[21]}"
            app:layout_constraintBottom_toBottomOf="@id/line_4"
            app:layout_constraintEnd_toEndOf="@id/row1"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="@id/line_3" />

        <TextView
            android:id="@+id/cell_42"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[22]}"
            app:layout_constraintBottom_toBottomOf="@id/line_4"
            app:layout_constraintEnd_toEndOf="@id/row2"
            app:layout_constraintStart_toEndOf="@+id/row1"
            app:layout_constraintTop_toTopOf="@id/line_3" />

        <TextView
            android:id="@+id/cell_43"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[23]}"
            app:layout_constraintBottom_toBottomOf="@id/line_4"
            app:layout_constraintEnd_toEndOf="@id/row3"
            app:layout_constraintStart_toEndOf="@+id/row2"
            app:layout_constraintTop_toTopOf="@id/line_3" />

        <TextView
            android:id="@+id/cell_44"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[24]}"
            app:layout_constraintBottom_toBottomOf="@id/line_4"
            app:layout_constraintEnd_toEndOf="@id/row4"
            app:layout_constraintStart_toEndOf="@+id/row3"
            app:layout_constraintTop_toTopOf="@id/line_3" />

        <TextView
            android:id="@+id/cell_45"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[25]}"
            app:layout_constraintBottom_toBottomOf="@id/line_4"
            app:layout_constraintEnd_toEndOf="@id/row5"
            app:layout_constraintStart_toEndOf="@+id/row4"
            app:layout_constraintTop_toTopOf="@id/line_3" />

        <TextView
            android:id="@+id/cell_46"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[26]}"
            app:layout_constraintBottom_toBottomOf="@id/line_4"
            app:layout_constraintEnd_toEndOf="@id/row6"
            app:layout_constraintStart_toEndOf="@+id/row5"
            app:layout_constraintTop_toTopOf="@id/line_3" />

        <TextView
            android:id="@+id/cell_47"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style_blue"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[27]}"
            app:layout_constraintBottom_toBottomOf="@id/line_4"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toEndOf="@id/row6"
            app:layout_constraintTop_toTopOf="@id/line_3" />

        <TextView
            android:id="@+id/cell_51"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style_red"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[28]}"
            app:layout_constraintBottom_toBottomOf="@id/line_5"
            app:layout_constraintEnd_toEndOf="@id/row1"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="@id/line_4" />

        <TextView
            android:id="@+id/cell_52"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[29]}"
            app:layout_constraintBottom_toBottomOf="@id/line_5"
            app:layout_constraintEnd_toEndOf="@id/row2"
            app:layout_constraintStart_toEndOf="@+id/row1"
            app:layout_constraintTop_toTopOf="@id/line_4" />

        <TextView
            android:id="@+id/cell_53"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[30]}"
            app:layout_constraintBottom_toBottomOf="@id/line_5"
            app:layout_constraintEnd_toEndOf="@id/row3"
            app:layout_constraintStart_toEndOf="@+id/row2"
            app:layout_constraintTop_toTopOf="@id/line_4" />

        <TextView
            android:id="@+id/cell_54"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[31]}"
            app:layout_constraintBottom_toBottomOf="@id/line_5"
            app:layout_constraintEnd_toEndOf="@id/row4"
            app:layout_constraintStart_toEndOf="@+id/row3"
            app:layout_constraintTop_toTopOf="@id/line_4" />

        <TextView
            android:id="@+id/cell_55"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[32]}"
            app:layout_constraintBottom_toBottomOf="@id/line_5"
            app:layout_constraintEnd_toEndOf="@id/row5"
            app:layout_constraintStart_toEndOf="@+id/row4"
            app:layout_constraintTop_toTopOf="@id/line_4" />

        <TextView
            android:id="@+id/cell_56"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[33]}"
            app:layout_constraintBottom_toBottomOf="@id/line_5"
            app:layout_constraintEnd_toEndOf="@id/row6"
            app:layout_constraintStart_toEndOf="@+id/row5"
            app:layout_constraintTop_toTopOf="@id/line_4" />

        <TextView
            android:id="@+id/cell_57"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style_blue"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[34]}"
            app:layout_constraintBottom_toBottomOf="@id/line_5"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toEndOf="@id/row6"
            app:layout_constraintTop_toTopOf="@id/line_4" />

        <TextView
            android:id="@+id/cell_61"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style_red"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[35]}"
            app:layout_constraintBottom_toBottomOf="@id/line_6"
            app:layout_constraintEnd_toEndOf="@id/row1"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="@id/line_5" />

        <TextView
            android:id="@+id/cell_62"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[36]}"
            app:layout_constraintBottom_toBottomOf="@id/line_6"
            app:layout_constraintEnd_toEndOf="@id/row2"
            app:layout_constraintStart_toEndOf="@+id/row1"
            app:layout_constraintTop_toTopOf="@id/line_5" />

        <TextView
            android:id="@+id/cell_63"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[37]}"
            app:layout_constraintBottom_toBottomOf="@id/line_6"
            app:layout_constraintEnd_toEndOf="@id/row3"
            app:layout_constraintStart_toEndOf="@+id/row2"
            app:layout_constraintTop_toTopOf="@id/line_5" />

        <TextView
            android:id="@+id/cell_64"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[38]}"
            app:layout_constraintBottom_toBottomOf="@id/line_6"
            app:layout_constraintEnd_toEndOf="@id/row4"
            app:layout_constraintStart_toEndOf="@+id/row3"
            app:layout_constraintTop_toTopOf="@id/line_5" />

        <TextView
            android:id="@+id/cell_65"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[39]}"
            app:layout_constraintBottom_toBottomOf="@id/line_6"
            app:layout_constraintEnd_toEndOf="@id/row5"
            app:layout_constraintStart_toEndOf="@+id/row4"
            app:layout_constraintTop_toTopOf="@id/line_5" />

        <TextView
            android:id="@+id/cell_66"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[40]}"
            app:layout_constraintBottom_toBottomOf="@id/line_6"
            app:layout_constraintEnd_toEndOf="@id/row6"
            app:layout_constraintStart_toEndOf="@+id/row5"
            app:layout_constraintTop_toTopOf="@id/line_5" />

        <TextView
            android:id="@+id/cell_67"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@drawable/flame_style_blue"
            android:gravity="center_horizontal|center_vertical"
            android:text="@{date[41]}"
            app:layout_constraintBottom_toBottomOf="@id/line_6"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toEndOf="@id/row6"
            app:layout_constraintTop_toTopOf="@id/line_5" />

    </androidx.constraintlayout.widget.ConstraintLayout>
</layout>

CalendarFragment.kt

package com.example.myfavoritecontentsmanage

import android.os.Bundle
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import androidx.fragment.app.Fragment
import com.example.myfavoritecontentsmanage.databinding.FragmentCalendarBinding
import java.util.*

class CalendarFragment() : Fragment() {
    private lateinit var binding: FragmentCalendarBinding
    override fun onCreateView(
        inflater: LayoutInflater,
        container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View {
        binding = FragmentCalendarBinding.inflate(inflater, container, false)
        inflater.inflate(R.layout.fragment_calendar, container, false)
        val calendar = Calendar.getInstance()
        val year = 2019
        val month = 6
        val minDay = 1
        calendar.set(year, month - 1, 1)
        val maxDay = calendar.getActualMaximum(Calendar.DAY_OF_MONTH)
        val blankDays = calendar.get(Calendar.DAY_OF_WEEK)

        val dayArray: MutableList<String> = mutableListOf()
        for (i in minDay until blankDays) {
            dayArray.add("")
        }
        for (i in minDay..maxDay) {
            dayArray.add(i.toString())
        }
        binding.date = dayArray.toTypedArray()

        return binding.root
    }
}

基本的にただ移行するだけなのでそこまで苦戦することはありません。

ViewPager2の利用

前提
ViewPager2を使うためにはgradleに下記の記述を追加します。

    implementation "androidx.viewpager2:viewpager2:1.0.0"

まず、アクティビティのレイアウトファイルでviewPagerを定義します。

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools">

    <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context=".MainActivity">

        <androidx.viewpager2.widget.ViewPager2
            android:id="@+id/pager"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />


    </androidx.constraintlayout.widget.ConstraintLayout>
</layout>

そしてMainActivityでadapterを呼び出し、連結します。

MainActivity.kt

package com.example.myfavoritecontentsmanage

import android.os.Bundle
import androidx.appcompat.app.AppCompatActivity
import androidx.databinding.DataBindingUtil
import androidx.fragment.app.Fragment
import androidx.fragment.app.FragmentActivity
import androidx.viewpager2.adapter.FragmentStateAdapter
import com.example.myfavoritecontentsmanage.databinding.ActivityMainBinding

class MainActivity : AppCompatActivity() {

    private lateinit var binding: ActivityMainBinding

    override fun onCreate(savedInstanceState: Bundle?) {
        binding = DataBindingUtil.setContentView(this, R.layout.activity_main)
        super.onCreate(savedInstanceState)
//        setContentView(R.layout.activity_main)

        val pager = ScreenSlidePagerAdapter(this)
        binding.pager.adapter = pager

    }

    private inner class ScreenSlidePagerAdapter(fa: FragmentActivity) : FragmentStateAdapter(fa) {
        override fun getItemCount(): Int = 3

        override fun createFragment(position: Int): Fragment = CalendarFragment(position)
    }
}

実行結果がこちら！

ちょっと月の表示が無いのでわかりにくいかもしれないのですが、ちゃんと切り替わっている様子が伝わるかと!!!

今回は3の制限が付いていて、しかも5月など過去の月が表示できないのでその辺りを調整しようと思います！