Как установить градиентный фон для кнопки материала?

Question

В настоящее время я использую этот код, но фон не меняется. Он по-прежнему показывает акцент в качестве фона.

<com.google.android.material.button.MaterialButton
    android:id="@+id/materialButton"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Hello"
    app:cornerRadius="32dp"
    android:background="@drawable/gradiant_blue"/>

gradiant_blue.xml

<shape
   xmlns:android="http://schemas.android.com/apk/res/android"
   android:shape="rectangle">

   <gradient
       android:angle="-45"
       android:startColor="#2979FF"
       android:endColor="#7C4DFF"/>
</shape>

Я сейчас пользуюсь

Версия компонентов материала: 1.0.0-rc02

Answer 1

Чтобы использовать настраиваемый фон с возможностью рисования с MaterialButton вы можете использовать android:background атрибут:

<MaterialButton
    app:backgroundTint="@null"
    android:background="@drawable/bkg_button_gradient"
    ... />

Примечание: Это требует, по крайней мере версии 1.2.0-alpha06

В настоящее время очень важно добавить app:backgroundTint="@null" чтобы пользовательский фон не окрашивался по умолчанию с помощью backgroundTint цвет.

С более ранними версиями библиотеки компонентов материалов вам необходимо использовать AppCompatButton.

Answer 2

Л.Э.: С моей точки зрения, я предлагаю вам использовать Button или же AppCompatButton,

Попробуй это:

gradient.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <gradient
        android:angle="0"
        android:endColor="#027FEE"
        android:startColor="#2CC6F2" />
</shape>

button.xml

<!-- replace MaterialButton with Button or AppCompatButton -->
<com.google.android.material.button.MaterialButton
    android:id="@+id/materialButton"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@drawable/gradient"
    android:text="Hello" />

Результат:

С corner radius изменить файл Gradient.xml на:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <gradient
        android:angle="0"
        android:endColor="#027FEE"
        android:startColor="#2CC6F2" />
    <corners android:radius="32dp"/>
</shape>

Результат:

Answer 3

Пожалуйста, прочитайте документацию для кнопки Материал, отсюда

Он говорит: "Для заполненных кнопок colorPrimary вашей темы предоставляет цвет фона по умолчанию для компонента, а цвет текста - colorOnPrimary. Для незаполненных кнопок colorPrimary вашей темы предоставляет цвет текста по умолчанию для компонента, а цвет фона по умолчанию прозрачный.".

Я думаю, что по этой причине вы видите какой-то другой цвет (accent-color), пожалуйста, проверьте атрибуты, которые устанавливают цвет фона.

Упоминаются следующие атрибуты:

app:backgroundTint

app:backgroundTintMode

Answer 4

Чтобы установить фон, вам нужно расширить базовую тему.

Theme.AppCompat.Light.NoActionBar

и не

Theme.MaterialComponents.Light.NoActionBar