Toolbar with two different colors

1

How to make a toolbar with two colors in half, going from one color to the other?

    
asked by anonymous 28.01.2018 / 06:12

1 answer

5

The name of this effect is Dégradé (gradient) or Gradient (gradient). To use a gradient as your bar background, simply create an XML with its data in the Drawable folder and use it as background of the bar. In your case, XML would look something like this (switch to the exact colors you want)

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <gradient
        android:startColor="#E81DCA"
        android:endColor="#7566E3"
        android:type="linear"/>
</shape>

Assuming we call the gradient_root_xml file, the usage looks like this:

<android.support.v7.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="@drawable/gradiente_rosa_para_roxo"
    app:popupTheme="@style/AppTheme.PopupOverlay" />

Result:

UmascreenshotofanAndroidphoneshowingjustthetopbarofanappwiththetext"College Way" in the title and a gradient effect going from pink to purple as background of the bar

    
28.01.2018 / 07:15