【Android 学习笔记】PagerAdapter 模拟屏幕滑动效果

效果图

概括

you enable the user to go from one sibling to another (at the same level in a multitier hierarchy)
要点1. 使用 TabLayout 来显示 tab ，一般把 tab 层放在bar层下面。
要点2. 使用 PagerAdapter 类 来天从 tab一下的界面，Adapter (适配器)，
use the PagerAdapter class to populate screens “pages” inside of a ViewPager。PagerAdapter 经常作为Fragment之间的连接。
要点3.ViewPager 式一个 layout manager 可以让用户来左右滑动屏幕。

This is a common pattern for presenting different screens of content
within an Activity—use an adapter to fill the content screen to show
in the Activity, and a layout manager that changes the content screens
depending on which tab is selected

步骤

第一步：创建

1. 创建一个工程命名为Tab Experiment
2. 编辑build.gradle(Module:app) 因为要使用TabLayout 需要依赖 Android Design Support Library，在dependencies 中输入下面代码，如果有红色警告，是提示 有新版本，更新即可，就是下面的 28.0.0 会变成更新的。

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

第二步：改变原始的 app bar ，这是因为创建时会有一个默认的原始bar，我们需要把这个原始的bar关闭

res > values > styles.xml

<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
   <!-- Other style attributes -->      
   <item name="windowActionBar">false</item>  // 关闭原始的bar和titl，使用我们自己的Toolbar
   <item name="windowNoTitle">true</item>
</style>

第三步： 编写 activity_main.xml内容

有时候我们需要把颜色，数值写成attr属性，这样做是为了屏蔽开发者对应具体数值，比如我们需要设置不同主题下的主色，副色，或者是不同版本的ActionBar大小，亦或者是不同Dpi下的DrawerLayout的宽度等。

<RelativeLayout 
....省
    <android.support.v7.widget.Toolbar
。。。
        android:layout_alignParentTop="true"
        android:background="?attr/colorPrimary"
        android:minHeight="?attr/actionBarSize"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/>
    <android.support.design.widget.TabLayout
    。。。
        android:layout_below="@id/toolbar"
        android:background="?attr/colorPrimary"
        android:minHeight="?attr/actionBarSize"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"/>
    <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="fill_parent"
        android:layout_below="@id/tab_layout"/>
</RelativeLayout>

如果加入 app:popupTheme后又红色警告，则在RelativeLayout 中加入 （alt+enter）

<RelativeLayout xmlns:app="http://schemas.android.com/apk/res-auto"

第四步： 为每个fragment创建一个类

动图，最后的结果要与最后一个动图一致
命名： TabFragment1 TabFragment2 and TabFragment3

第五步：编辑 Fragment layout

比如tab_fragment1的代码：

<RelativeLayout 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="com.example.android.tabexperiment.TabFragment1">