Android Studio ActionBar的替换

总结一下最近在用Android Studio 美化APP的过程，为以后的坑做准备。

ActionBar：

Android Studio自带的ActionBar是长这样的，丑且不能往上面写字或是贴图片。

1.自己新建一个xml文件，或是直接从以前的工程考过来，(header_toolbar.xml)源码如下：

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/toolbar"
    style="@style/AppTheme.Toolbar"
    android:background="@color/green"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    app:popupTheme="@style/toolbarMenuStyle">

    <TextView
        android:id="@+id/tvLeft"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:textColor="#FFFFFF"
        android:textSize="20sp"
        android:visibility="gone" />

    <TextView
        android:id="@+id/tvTitle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:layout_gravity="center"
        android:text=""
        android:textColor="#FFFFFF"
        android:textSize="20sp" />

</android.support.v7.widget.Toolbar>
           

2.在 res>values>styles 中添加几个style

<style name="AppTheme.Toolbar" parent="Widget.AppCompat.ActionBar">
        <item name="android:layout_width">match_parent</item>
        <item name="android:layout_height">@dimen/toolbar_hight</item>
        <item name="android:minHeight">@dimen/toolbar_hight</item>
        <item name="android:background">?attr/colorPrimary</item>
        <!--指定toolbar弹出菜单样式-->
        <item name="actionOverflowMenuStyle">@style/toolbarMenuStyle</item>
    </style>

    <!--自定义toolbar菜单样式-->
    <style name="toolbarMenuStyle"
        parent="@style/Widget.AppCompat.PopupMenu.Overflow">
        <!-- 是否覆盖锚点，默认为true，即盖住Toolbar -->
        <item name="overlapAnchor">false</item>
        <!-- 弹出层背景颜色 -->
        <item name="android:popupBackground">@color/background_color</item>
        <!-- 弹出层垂直方向上的偏移，负值会覆盖toolbar -->
        <item name="android:dropDownVerticalOffset">5dp</item>
        <!-- 弹出层水平方向上的偏移，即距离屏幕左边的距离，负值会导致右边出现空隙 -->
        <item name="android:dropDownHorizontalOffset">-2dp</item>
        <!--文字颜色-->
        <item name="android:textColor">@color/text_color</item>

        <item name="android:dropDownListViewStyle">@style/AppDropDownListViewStyle</item>
    </style>
    
    <style name="AppDropDownListViewStyle" parent="Widget.AppCompat.ListView.DropDown">
        <item name="android:showDividers">middle</item>
        <item name="android:divider">@drawable/ic_list_divider</item>
        <item name="android:dividerHeight">1dp</item>
    </style>
           

3.在 res>values 中新建一个dimens.xml，代码如下：

<resources>
    <!-- Default screen margins, per the Android Design guidelines. -->
    <dimen name="activity_horizontal_margin">16dp</dimen>
    <dimen name="activity_vertical_margin">16dp</dimen>

    <dimen name="toolbar_hight">50dp</dimen>
</resources>
           

4.在 res>drawable 下新建一个 ic_list_divider.xml 源码：

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:left="10dp">
        <shape android:shape="rectangle">
            <solid android:color="@color/colorDivision" />
            <size android:height="0.5dp" />
        </shape>
    </item>
</layer-list>
           

1. 到现在，就差几个颜色找不到了，在 res>values>clolors.xml中 可以自己添加修改颜色，也可以把下面这段直接将colors.xml中的替换掉。

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="white">#fff</color>
    <color name="black">#000</color>
    <color name="gray">#808080</color>
    <color name="yellow">#F8DC26</color>
    <color name="roundcolor">#D8D8D8</color>
    <color name="line_color">#E5E5E5</color>
    <color name="gifview_background">#E8E8E8</color>
    <color name="text_gray_light">#d0d0d0</color>
    <color name="transparent_half">#88000000</color>
    <color name="tomato">#FF9500</color>
    <color name="unbind">#FF3B2F</color>
    <color name="floralwhite">#FFFAF0</color>
    <color name="line_gray">#c7c7c7</color>
    <color name="alert_blue">#2db4e3</color>
    <color name="background_color">#F6F6F6</color>
    <color name="image_background">#FBDA51</color>
    <color name="background_light_gray">#eeeeee</color>
    <color name="background_gray">#aaaaaa</color>
    <color name="text_gray">#333333</color>
    <color name="sample_deploy">#007AFE</color>
    <color name="text_color">#333333</color>
    <color name="hint_color">#B7B7B7</color>
    <color name="border_color">#CCCCCC</color>
    <color name="back_gray">#bebebe</color>
    <color name="text_color_gray">#B4B4B4</color>
    <color name="text_state">#797979</color>
    <color name="alert_color">#E7E7E7</color>
    <color name="colorPrimary">#008577</color>
    <color name="colorPrimaryDark">#00574B</color>
    <color name="colorAccent">#D81B60</color>
    <color name="green">#43c283</color>

    <!--应用的主要色调-->
    <!--应用的主要暗色调-->
    <color name="colorDivision">#33aaaaaa</color>
</resources>

           

1. 最后，在要修改Actionbar的页面Text中加入新的heardbar：

<include
        android:id="@+id/include3"
        layout="@layout/header_toolbar"
        android:layout_width="375dp"
        android:layout_marginEnd="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginRight="8dp"
        android:layout_marginStart="8dp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
           

想往里加啥就加啥

关于原生Actionbar和最上方信息栏的颜色，在colors.xml中：