Toolbar with two different colors

Asked

Viewed 201 times

1

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

Uma barra de título de uma aplicação chamada Via Universitária, com o título sobre um fundo em efeito gradiente, indo do rosa para o roxo

1 answer

5


The name of this effect is Dégradé (gradient) or Gradient (gradient). To use a gradient at the bottom of your bar, just create an XML with its data in the Drawable folder and use it as background bar. In your case, the 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 file gradiente_rosa_para_roxo.xml, the usage is 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" />

Upshot:

Uma captura de tela de um celular Android mostrando apenas a barra superior de um aplicativo com o texto "Via Universitária" no título e um efeito gradiente indo do rosa para o roxo como fundo da barra

  • Thank you very much guy, helped me a lot

Browser other questions tagged

You are not signed in. Login or sign up in order to post.