AndroidJetpack Fragment之Navigation和ViewPager2

新的Fragment導航方式：Navigation

1.創建若干個fragment

2.添加導航
1）新建Navigation：右鍵res文件夾，New->Android Resource File,Resource Type選擇Navigation
2）添加Freagment：Navagation文件中，點擊左上角添加，按順序添加Fragment，拖動四邊的節點可以設置導航順序
3）添加HostFragment到container中

3.添加容器
activity中拖動添加containers->NavHostFragment並選擇Navagation，或者添加代碼：

<fragment
        android:id="@+id/fragment"
        android:name="androidx.navigation.fragment.NavHostFragment"
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:defaultNavHost="true"
        app:navGraph="@navigation/main_nav_controler" />

4.設置跳轉

​ 指定位置添加代碼：

Navigation.findNavController(btn).navigate(R.id.action_mainFragment_to_detailFragment)
//navigate的參數為跳轉方向，可自動補全

5.設置左上角點擊返回
```

private lateinit var mNavController : NavController
override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.activity_main)

    mNavController = Navigation.findNavController(this, R.id.fragment)
    NavigationUI.setupActionBarWithNavController(this, mNavController)
}

override fun onSupportNavigateUp(): Boolean {
    return mNavController.navigateUp()
}

6.生命周期：
切換時銷毀上一個Fragment，執行到onDestroy()

7.數據傳遞
1)bundle方式：Navigation.findController(View).navigate(resId, Bundle)
2)ViewModel方式：和Activity中使用ViewModel類似：在Fragment的onCreateView()中使用 。區別在於：使用DataBinding.inflate()綁定View；onCreateView()返回bind.getRoot()

新的頁面切換控件：ViewPager2

1. 單獨使用ViewPager2，作為ListView

1.xml：

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".PagerFragment">
    <androidx.viewpager2.widget.ViewPager2
        android:id="@+id/viewpager2"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
</FrameLayout>

2.Adapter:

class PagerPhotoListAdapter : ListAdapter<PhotoItem, PagerPhotoViewHolder>(DIFF_UTIL) {

    object DIFF_UTIL : DiffUtil.ItemCallback<PhotoItem>() {
        override fun areItemsTheSame(oldItem: PhotoItem, newItem: PhotoItem) = 
        	oldItem === newItem

        override fun areContentsTheSame(oldItem: PhotoItem, newItem: PhotoItem) =
        	oldItem.photoId == newItem.photoId
    }

    override fun onCreateViewHolder(parent:ViewGroup, viewType:Int):PagerPhotoViewHolder{
        val view = LayoutInflater.from(parent.context)
        						.inflate(R.layout.pager_photo_view, parent, false)
        return PagerPhotoViewHolder(view)
    }

    override fun onBindViewHolder(holder: PagerPhotoViewHolder, position: Int) {
        Glide.with(holder.itemView)
            .load(getItem(position).previewUrl)
            .placeholder(R.drawable.ic_photo_gray_24dp)
            .into(holder.itemView.pagerPhoto)
    }
}

class PagerPhotoViewHolder(itemView: View) : RecyclerView.ViewHolder(itemView)

3.Activity中使用：

val photoList = arguments?.getParcelableArrayList<PhotoItem>("PHOTO_LIST")		//獲取數據
PagerPhotoListAdapter().apply {
    viewpager2.adapter = this		//裝配適配器
    submitList(photoList)			//裝配數據
}

viewpager2.registerOnPageChangeCallback(object : ViewPager2.OnPageChangeCallback() {
    override fun onPageSelected(position: Int) {
        super.onPageSelected(position)
        photoTag.text = "${position + 1} / ${photoList?.size}"
    }
})		//注冊分頁變化事件
viewpager2.setCurrentItem(arguments?.getInt("PHOTO_POSITION")?:0, false)

2. TabLayout + ViewPager2

1.xml：

<LinearLayout 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:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity" >
    
    <com.google.android.material.tabs.TabLayout
        android:id="@+id/tablayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <com.google.android.material.tabs.TabItem
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Monday" />
        <com.google.android.material.tabs.TabItem
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Tuesday" />
        <com.google.android.material.tabs.TabItem
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Wednesday" />
    </com.google.android.material.tabs.TabLayout>

    <View
        android:id="@+id/divider"
        android:layout_width="match_parent"
        android:layout_height="1dp"
        android:background="?android:attr/listDivider" />

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

2.Adapter:

class TabViewPagerAdapter : FragmentStateAdapter(this) {
    override fun getItemCount() = 3
    override fun createFragment(position: Int) = when(position) {
        0 -> ScaleFragment()
        1 -> RotateFragment()
        else -> TranslateFragment()
    }
}