Android使用Fragment+ViewPager +TabLayout实现顶部标题栏

使用Fragment+ViewPager +TabLayout自制简易新闻 app主要框架（简易新闻 一）

关于整个简易新闻的功能实现可以从制作简易新闻App导航篇中查看

转载注明出处： https://blog.csdn.net/Tobey_r1/article/details/93221486
首先上一下整体效果图：

整个项目的文件图：

关于：自制标题导航栏Toolbar与DrawerLayout侧滑栏

Toolbar的详细实现过程请看自定义标题Toolbar实现
侧滑菜单栏的详细实现过程请看 滑动菜单DrawerLayout+NavigationView

第一步：添加design库与circleimageview引用

在项目的build.gradle文件中添加一下引用

implementation 'com.android.support:design:28.0.0'
implementation 'de.hdodenhof:circleimageview:2.1.0'

第二步：修改标题栏Theme，添加color值

在res/values/style.xml文件中修改属性

<resources>

    <!-- Base application theme. -->
    <color name="black">#000000</color>
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
        <item name="android:windowIsTranslucent">true</item>
        <item name="android:windowNoTitle">true</item>
    </style>

</resources>

在res/values/colors.xml中添加以下颜色值：

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="colorPrimary">#008577</color>
    <color name="colorPrimaryDark">#00574B</color>
    <color name="colorAccent">#D81B60</color>
    <color name="colorRed">#F00</color>
    <color name="colorBlack">#000</color>
    <color name="colorWhite">#FFF</color>
</resources>

第三步添加头布局文件nav_header.xml

新建一个头布局文件nav_header.xml文件

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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="180dp"
    android:padding="10dp"
    android:orientation="horizontal"
    android:background="#80FFFF"
    >
    <de.hdodenhof.circleimageview.CircleImageView
        android:id="@+id/icon_image"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@mipmap/mouse"
        />
    <ImageView
        android:id="@+id/icon_image1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        tools:ignore="InvalidId" />

    <TextView
        android:id="@+id/text_huoqu"
        android:layout_width="wrap_content"
        android:text="可以自己设置东西"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:textColor="@color/colorBlack"
        android:textSize="14sp"
        tools:ignore="HardcodedText" />
    <TextView
        android:id="@+id/text_username"
        android:layout_above="@id/text_huoqu"
        android:textColor="@color/colorBlack"
        android:textSize="14sp"
        android:text="个人博客地址：https://blog.csdn.net/Tobey_r1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        tools:ignore="HardcodedText" />
</RelativeLayout>

第四步添加侧滑栏菜单项

在res文件夹下新建一个menu文件夹，在里面新建一个nav_menu.xml文件
添加内容

<menu xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:android="http://schemas.android.com/apk/res/android">
    <group android:checkableBehavior="single" >
        <item android:id="@+id/nav_call" android:title="编辑资料" android:icon="@drawable/nav_call"
            android:checkable="true"
             />
        <item android:id="@+id/nav_friends" android:title="我的好友" android:icon="@drawable/nav_friends"

            android:checkable="true"/>
        <item android:id="@+id/nav_location" android:title="发布新闻" android:icon="@drawable/nav_location"
            android:checkable="true"
            />
        <item android:id="@+id/nav_favorite" android:title