Стили кнопок для Android Material Design

Я запутался в стилях кнопок для Material Design. Я хотел бы получить разноцветные рельефные кнопки, как в прикрепленной ссылке. как кнопки "принудительной остановки" и "удаления", которые можно увидеть в разделе использования. Существуют ли доступные стили или мне нужно определить их?

http://www.google.com/design/spec/components/buttons.html#buttons-usage

Я не смог найти стили кнопок по умолчанию.

Пример:

 <Button style="@style/PrimaryButton"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Calculate"
    android:id="@+id/button3"
    android:layout_below="@+id/editText5"
    android:layout_alignEnd="@+id/editText5"
    android:enabled="true" />

Если я попытаюсь изменить цвет фона кнопки, добавив

    android:background="@color/primary"

все стили исчезают, например, анимация прикосновения, тень, закругленный угол и т.д.

Markus Pscheidt
Редактировал вопрос 2-го августа 2018 в 4:03
Программирование
button android material-design android-5.0-lollipop
13-го октября 2014 в 6:40
399 просмотров
Комментарии к вопросу (2)
Решение

Я добавлю мой ответ, так как я Дон'т использовать любые другие ответы.

С библиотекой поддержки В7, все стили уже определены и готовы к использованию, для стандартных кнопок, все эти стили доступны:

style="@style/Widget.AppCompat.Button"
style="@style/Widget.AppCompat.Button.Colored"
style="@style/Widget.AppCompat.Button.Borderless"
style="@style/Widget.AppCompat.Button.Borderless.Colored"

Виджетов.Совместимости приложений.Кнопка`:

Виджетов.Совместимости приложений.Кнопки.Цвета:

Виджетов.Совместимости приложений.Кнопки.Без границ`

Виджетов.Совместимости приложений.Кнопки.Без границ.Цвета:

Чтобы ответить на вопрос, поэтому стиль использовать

Как изменить цвет

Приложения:

Цвета всех элементов управления пользовательского интерфейса (не только кнопки, но и плавающие кнопки, чекбоксы и т. д.) управляется colorAccent атрибут `` как объяснил здесь. Вы можете изменить этот стиль и применить ваши собственные цвета в определении темы:


    ...
    @color/Orange

Для конкретной кнопки:

Если вам нужно изменить стиль конкретную кнопку, можно определить новый стиль, наследование одним из родителей, описанных выше стилей. В примере ниже я просто изменил цвет фона и шрифта:


    @color/Red
    @color/White

Тогда вам просто нужно применить этот новый стиль на кнопку с:

android:theme="@style/AppTheme.Button"

Установить дизайн кнопки по умолчанию в макете, добавьте в тему styles.xml :

@style/btn

где `@стиль/БТН-это ваши темы. Это задает стиль кнопки для всех кнопок в макете с определенной темой

Suhaib
Редактировал ответ 4-го июля 2017 в 6:44
Комментарии (17)

Простое Решение

Шаг 1: Используйте новейшие библиотеки поддержки

compile 'com.android.support:appcompat-v7:25.2.0'

Шаг 2: Используйте AppCompatActivity как родительский класс Activity

public class MainActivity extends AppCompatActivity

Шаг 3: Используйте приложение пространства имен в макете XML-файл

Шаг 4: Используйте AppCompatButton кнопку вместо

Ehtesham Hasan
Редактировал ответ 22-го марта 2017 в 7:10
Комментарии (6)

Если я правильно вас понял, вы хотите сделать что-то вроде этого:

В таком случае этого должно быть достаточно для использования:

#2196f3

Или для API меньше 21:

#2196f3

В дополнение к Учебнику по использованию темы Material.

Анимированный вариант находится [здесь][3].

MobileMon
Редактировал ответ 9-го июня 2016 в 5:48
Комментарии (9)

Вот как я получил то, что хотел.

Сначала я сделал кнопку (в styles.xml):


    @color/white
    0dp
    88dp
    36dp
    3dp
    1dp
    1dp
    @drawable/primary_round

Пульсация и фон для кнопки, как рисуемый primary_round.xml:

Это добавило эффект пульсации, который я искал.

David d C e Freitas
Редактировал ответ 11-го ноября 2014 в 2:55
Комментарии (13)

С стабильный выпуск материальных компонентов Android В ноября 2018, Гугл перевел материалы из пространства имен для Андроид.поддержка.дизайн в ком.Гугл.андроид.материал. Материал компонента библиотека является заменой для проектирования библиотека поддержки Андроида.

Добавить зависимость в сборке.Gradle в`:

dependencies { implementation ‘com.google.android.material:material:1.0.0’ }

Затем добавить MaterialButton по вашему макету:

Вы можете проверить полная документация здесь и по API здесь.

Изменить цвет фона у вас есть 2 варианта.

  1. Используя backgroundTint атрибут.

Что-то вроде:


    @color/button_selector
    //..
  1. Это будет лучший вариант на мой взгляд. Если вы хотите переопределить некоторые атрибуты темы из стиля по умолчанию, то можно использовать новый materialThemeOverlay атрибут.

Что-то вроде:


   @style/GreenButtonThemeOverlay




  @color/green

Вариант#2 требует &#39;сом.Гугл.андроид.материал:материал:1.1.0&#39;.

Старую библиотеку поддержки:

С новым библиотека поддержки 28.0.0, библиотека дизайна теперь содержит MaterialButton.

Вы можете добавить эту кнопку, чтобы наш файл макета с:

По умолчанию этот класс будет использовать цветовой акцент вашего теме кнопки заполнено цвет фона и белый для кнопок цвет текста.

Можно настроить кнопки с этими атрибутами:

  • приложение:rippleColor`: цвет используется для кнопки волновой эффект

  • приложение:backgroundTint`: применять оттенок на фоне кнопки. Если вы хотите изменить цвет фона кнопки, использовать этот атрибут вместо фона.

  • приложение:strokeColor: в цвет, который будет использоваться для кнопки инсульта

  • приложение:strokeWidth`: ширину использовать для нажатия кнопки

  • приложение:структура cornerradius`: используется для определения радиуса используется для углов кнопки

Gabriele Mariotti
Редактировал ответ 30-го августа 2019 в 2:25
Комментарии (3)

Вот образец, который поможет в нанесением стиль кнопки последовательно через ваше приложение.

Вот пример темы я использовал с конкретными стилями..


   @color/primary
    @color/primary_dark
    @color/accent
    @style/ButtonAppTheme


@drawable/material_button

Это, как я определил форму кнопку & эффекты внутри РЭС/папки холст-в21...

<?xml version="1.0" encoding="utf-8"?>

2dp фирмы углы, чтобы держать его в соответствии с материалом темы.

Комментарии (2)

Рядом с андроида.поддержка.дизайн.кнопки.MaterialButton` (который отметил Габриэле Мариотти),

Появилась другая кнопка виджет ком.Гугл.андроид.материал.кнопки.MaterialButton, которая имеет различные стили и простирается от AppCompatButton:

style="@style/Widget.MaterialComponents.Button"
style="@style/Widget.MaterialComponents.Button.UnelevatedButton"
style="@style/Widget.MaterialComponents.Button.TextButton"
style="@style/Widget.MaterialComponents.Button.Icon"
style="@style/Widget.MaterialComponents.Button.TextButton.Icon"

Заполняется, повышенный кнопка (по умолчанию): 

style="@style/Widget.MaterialComponents.Button"

Заполняется, unelevated кнопка: 

style="@style/Widget.MaterialComponents.Button.UnelevatedButton"

Текст Кнопка: 

style="@style/Widget.MaterialComponents.Button.TextButton"

Значок``: 

style="@style/Widget.MaterialComponents.Button.Icon"
app:icon="@drawable/icon_24px" // Icons can be added from this

Текст кнопки с пиктограммой::

Читать: https://material.io/develop/android/components/material-button/

класс комфорта для создания новой кнопки материал.

этот класс предоставляет обновленный материал стили для кнопки в конструктор. Виджет будет отображать правильный материал по умолчанию стили без использования флага стиль.

Комментарии (3)

Я пробовал много ответов & сторонние библиотеки, но никто не держал границу и подняли воздействие на предварительно леденец, а оказывает волновой эффект на Lollipop без недостаток. Вот мое окончательное решение, объединяющее несколько ответов (границы/поднял не вынесено из-за картинки в оттенки серого глубина цвета) :

Леденец

Предварительно леденец

сборки.Gradle в

compile 'com.android.support:cardview-v7:23.1.1'

layout.xml

drawable-v21/btn_bg.xml

<?xml version="1.0" encoding="utf-8"?>

drawable/btn_bg.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

Активность'ы метод onCreate

    final CardView cardView = (CardView) findViewById(R.id.card);
    final Button button = (Button) findViewById(R.id.button);
    button.setOnTouchListener(new View.OnTouchListener() {
        ObjectAnimator o1 = ObjectAnimator.ofFloat(cardView, "cardElevation", 2, 8)
                .setDuration
                        (80);
        ObjectAnimator o2 = ObjectAnimator.ofFloat(cardView, "cardElevation", 8, 2)
                .setDuration
                        (80);

        @Override
        public boolean onTouch(View v, MotionEvent event) {

            switch (event.getAction()) {
                case MotionEvent.ACTION_DOWN:
                    o1.start();
                    break;
                case MotionEvent.ACTION_CANCEL:
                case MotionEvent.ACTION_UP:
                    o2.start();
                    break;
            }
            return false;
        }
    });
Rémy DAVID
Редактировал ответ 2-го февраля 2016 в 2:05
Комментарии (1)
  1. Вы можете создать кнопка закругленный угол путем определения XML-drawable и вы можете увеличить или уменьшить радиус, чтобы увеличить или уменьшить округлость углу кнопку. Установить этот XML-холст в качестве фона кнопки.
<?xml version="1.0" encoding="utf-8"?>

  1. изменить тени и тени, анимацию перехода между состояниями кнопок, нужно определить селектор и применить его к кнопке с помощью Android:собственность stateListAnimator. Для полной настройки кнопка ссылка : http://www.zoftino.com/android-button
Комментарии (0)

Я'вэ просто создан для Андроид библиотеки, что позволяет легко изменять цвет кнопки и пульсация цвета

https://github.com/xgc1986/RippleButton

Вы Don'т нужно создать стиль для каждой кнопки вы хотите, остроумие другой цвет, что позволяет настроить цвета случайным образом

Комментарии (1)

Вы можете придать вид авиации, добавив к нему ось z и добавив к нему тень по умолчанию. Эта возможность была предоставлена в предварительном просмотре L и будет доступна после его выхода. На данный момент вы можете просто добавить изображение с таким видом для фона кнопки

Комментарии (2)