Розмальовки кнопок в Android з Матеріал дизайну та AppCompat


256

До виходу AppCompatоновлення сьогодні я зміг змінити колір кнопок в Android L, але не на старих версіях. Після включення нового оновлення AppCompat я не можу змінити колір для будь-якої версії, коли я спробую, кнопка просто зникає. Хтось знає, як змінити колір кнопки?

На наступних малюнках показано, чого я хочу досягти:

малюнок, що показує бажаний результат

Біла кнопка за замовчуванням, червона - це те, що я хочу.

Це те, що я робив раніше, щоб змінити колір кнопок у styles.xml:

<item name="android:colorButtonNormal">insert color here</item>

і робити це динамічно:

button.getBackground().setColorFilter(getResources().getColor(insert color here), PorterDuff.Mode.MULTIPLY);

Також я змінив батьківську тему з @android:style/Theme.Material.Light.DarkActionBarнаTheme.AppCompat.Light.DarkActionBar


Я спробував те саме, але нічого не змінило колір кнопки. Я також видалив android: з атрибута, оскільки він знаходиться з підтримки lib, а не частина простору імен для android
Informatic0re

Якщо ви використовуєте android: colorButtonNormal з Android 5.0, він працює - але, здається, він не сумісний назад
Informatic0re

Так, саме це я переживав
mail929

Я також з’ясував, що колір наголосу не змінює колір CheckBox, але це робиться у більш старих версіях
Informatic0re

плюс один для цього динамічного методу. :)
theapache64

Відповіді:


222

Офіційно зафіксовано в Бібліотеці підтримки (Rev.22) (Пт. 13 березня 2015 р.). Див. Відповідну проблему з кодом google:

https://issuetracker.google.com/isissue/37008632

Приклад використання

topic.xml:

<item name="colorButtonNormal">@color/button_color</item>

v21 / topic.xml

<item name="android:colorButtonNormal">@color/button_color</item>

17
Чи є приклад, як його використовувати? Як я можу встановити кольори лише на одній кнопці?
інтригації

3
@WindRider У мене є проблема, хоча я хочу використовувати її для створення кнопок з різними кольорами. Я створюю стилі Button.Red, Button.Green, все з батьківським рівним базовим стилем Button. Я встановив елемент colorButtonNormal на потрібний колір, встановив це як тему кнопки. На жаль, це лише кольори кнопок для 21. Знизу він не перекреслює кольорову кнопкуNormal, визначену в темі.
dominik4142

71
З AppCompat 22.1.1 він працює для мене на 2.3.7, 4.4.4 та 5.1 теж лише для однієї кнопки: кнопки налаштування android:theme="@style/ColoredButton", а в styles.xml <style name="ColoredButton" parent="Widget.AppCompat.Button"> <item name="colorButtonNormal">@color/button_yellow</item> </style>
hunyadym

2
@hunyadym, додавши тему до кнопки, перервається onClick чомусь. Я б класифікував це як спосіб вирішення, поки бібліотека Design не надасть кращого способу.
засклений

3
@gladed: Здається, у вашому випадку проблема в цій помилці: code.google.com/p/android/isissue/detail?id=62795#c1
hunyadym

148

Редагувати (22.06.2016):

Бібліотека Appcompat почала підтримувати кнопки матеріалів після того, як я опублікувала оригінальну відповідь. У цій публікації ви можете побачити найпростішу реалізацію піднятих і плоских кнопок.

Оригінальний відповідь:

Оскільки цей AppCompat не підтримує цю кнопку, ви можете використовувати xml як фони. Для цього я ознайомився з вихідним кодом Android і знайшов відповідні файли для стилізації кнопок матеріалу.

1 - Подивіться на оригінальну реалізацію кнопки матеріалу з джерела.

Погляньте на btn_default_material.xml на вихідний код для Android .

Ви можете скопіювати файл у папку dravable-v21 своїх проектів. Але не торкайтеся тут кольорів attr. Файл, який потрібно змінити, - це другий файл.

dravable-v21 / custom_btn.xml

<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="?attr/colorControlHighlight">
    <item android:drawable="@drawable/btn_default_mtrl_shape" />
</ripple>

2 - Отримайте форму кнопки оригінального матеріалу

Як ви розумієте, всередині цього малювання є форма, яку ви можете знайти в цьому файлі вихідного коду .

<inset xmlns:android="http://schemas.android.com/apk/res/android"
   android:insetLeft="@dimen/button_inset_horizontal_material"
   android:insetTop="@dimen/button_inset_vertical_material"
   android:insetRight="@dimen/button_inset_horizontal_material"
   android:insetBottom="@dimen/button_inset_vertical_material">
<shape android:shape="rectangle">
    <corners android:radius="@dimen/control_corner_material" />
    <solid android:color="?attr/colorButtonNormal" />
    <padding android:left="@dimen/button_padding_horizontal_material"
             android:top="@dimen/button_padding_vertical_material"
             android:right="@dimen/button_padding_horizontal_material"
             android:bottom="@dimen/button_padding_vertical_material" />
</shape>

3 - Отримання розмірів кнопки матеріалу

І в цьому файлі ви знайдете деякі параметри, використані з файлу, який ви можете знайти тут . Ви можете скопіювати весь файл і ввести свої значення папку зі . Це важливо для застосування однакового розміру (який використовується у кнопках матеріалів) до всіх кнопок

4 - Створіть ще один файл, що виводиться для старих версій

Для старих версій у вас повинен бути інший малюнок із таким же ім’ям. Я безпосередньо ставлю елементи в рядку замість посилання. Ви можете посилатися на них. Але знову ж таки, найголовніше - це оригінальні розміри кнопки матеріалу.

dravable / custom_btn.xml

    <?xml version="1.0" encoding="utf-8"?>
    <selector xmlns:android="http://schemas.android.com/apk/res/android">
    
    <!-- pressed state -->
    <item android:state_pressed="true">
        <inset xmlns:android="http://schemas.android.com/apk/res/android"
            android:insetLeft="@dimen/button_inset_horizontal_material"
            android:insetTop="@dimen/button_inset_vertical_material"
            android:insetRight="@dimen/button_inset_horizontal_material"
            android:insetBottom="@dimen/button_inset_vertical_material">
            <shape android:shape="rectangle">
                <corners android:radius="@dimen/control_corner_material" />
                <solid android:color="@color/PRESSED_STATE_COLOR" />
                <padding android:left="@dimen/button_padding_horizontal_material"
                    android:top="@dimen/button_padding_vertical_material"
                    android:right="@dimen/button_padding_horizontal_material"
                    android:bottom="@dimen/button_padding_vertical_material" />
            </shape>
        </inset>
    </item>
    
    <!-- focused state -->
    <item android:state_focused="true">
        <inset xmlns:android="http://schemas.android.com/apk/res/android"
            android:insetLeft="@dimen/button_inset_horizontal_material"
            android:insetTop="@dimen/button_inset_vertical_material"
            android:insetRight="@dimen/button_inset_horizontal_material"
            android:insetBottom="@dimen/button_inset_vertical_material">
            <shape android:shape="rectangle">
                <corners android:radius="@dimen/control_corner_material" />
                <solid android:color="@color/FOCUSED_STATE_COLOR" />
                <padding android:left="@dimen/button_padding_horizontal_material"
                    android:top="@dimen/button_padding_vertical_material"
                    android:right="@dimen/button_padding_horizontal_material"
                    android:bottom="@dimen/button_padding_vertical_material" />
            </shape>
        </inset>
    </item>
    
    <!-- normal state -->
    <item>
        <inset xmlns:android="http://schemas.android.com/apk/res/android"
            android:insetLeft="@dimen/button_inset_horizontal_material"
            android:insetTop="@dimen/button_inset_vertical_material"
            android:insetRight="@dimen/button_inset_horizontal_material"
            android:insetBottom="@dimen/button_inset_vertical_material">
            <shape android:shape="rectangle">
                <corners android:radius="@dimen/control_corner_material" />
                <solid android:color="@color/NORMAL_STATE_COLOR" />
                <padding android:left="@dimen/button_padding_horizontal_material"
                    android:top="@dimen/button_padding_vertical_material"
                    android:right="@dimen/button_padding_horizontal_material"
                    android:bottom="@dimen/button_padding_vertical_material" />
            </shape>
        </inset>
    </item>
</selector>

Результат

Ваша кнопка матиме пульсаційний ефект на пристроях Lollipop. У старих версіях буде точно така ж кнопка, крім ефекту пульсацій. Але оскільки ви надаєте чернетки для різних станів, вони також реагуватимуть на події, що торкаються (як старий спосіб).


4
Так саме. Якщо ви використовуєте однаковий фон для всіх кнопок, і якщо ви не хочете додавати це знову і знову, визначте стиль кнопки у ваших стилях.xml <style name = "ButtonStyle" parent = "android: Widget.Button"> < item name = "android: background"> ​​@ dravable / custom_btn </item> </style> та додай стиль кнопки у свою тему <item name = "android: buttonStyle"> @ style / ButtonStyle </item>
eluleci

1
як я можу додати висоту до цієї кнопки до 21 року? як я розумію, я повинен додати нову форму з тінню під кнопкою, але де саме я повинен її розмістити?
xakz

7
Дуже прикро, що це не підтримується з-за меж
Сем

39
Я повністю з вами згоден. Кнопка - це найчастіше використовуваний віджет, але він не входить у бібліотеку підтримки матеріалів. Цікаво, що вони думали.
eluleci

1
Крім того, за вашим посібником здається, що фон взагалі не відображається ...
JMRboosties

111

Це було покращено в v23.0.0 бібліотеки AppCompat, додавши ще теми, в тому числі

Widget.AppCompat.Button.Colored

Перш за все, включіть залежність appCompat, якщо ви ще цього не зробили

compile('com.android.support:appcompat-v7:23.0.0') {
    exclude group: 'com.google.android', module: 'support-v4'
}

Тепер, оскільки вам потрібно використовувати v23 програми для компат-додатків, вам також потрібно націлити SDK-v23!

    compileSdkVersion = 23
    targetSdkVersion = 23

У вашому values/theme

<item name="android:buttonStyle">@style/BrandButtonStyle</item>

У вашому values/style

<style name="BrandButtonStyle" parent="Widget.AppCompat.Button.Colored">
    <item name="colorButtonNormal">@color/yourButtonColor</item>
    <item name="android:textColor">@color/White</item>
</style>

У вашому values-v21/style

<style name="BrandButtonStyle" parent="Widget.AppCompat.Button.Colored">
    <item name="android:colorButtonNormal">@color/yourButtonColor</item>
    <item name="android:textColor">@color/White</item>
</style>

Оскільки тема вашої кнопки заснована на Widget.AppCompat.Button.Coloredкольорі тексту на кнопці за замовчуванням білий!

але здається, що при відключенні кнопки виникає проблема, кнопка змінить свій колір на світло-сірий, але колір тексту залишиться білим!

Вирішенням цього є спеціально встановити колір тексту на кнопці білий! як я це робив у стилі, показаному вище.

тепер ви можете просто визначити свою кнопку і дозволити AppCompat робити все інше :)

<Button
        android:layout_width="200dp"
        android:layout_height="48dp" />

Держава-інвалід Стан інвалідів

Увімкнено стан Увімкнено стан

Редагувати:

Додати <Button android:theme="@style/BrandButtonStyle"/>


19
Це найкращий спосіб це зробити зараз! Ви також можете використовувати стиль на окремих кнопках за допомогою <Button android:theme="@style/BrandButtonStyle"/>. Він повинен бути themeатрибутом і НЕstyle атрибут.
mohlendo

7
@Muhammad Alfaifi У вас є зразок проекту чи суть цього? Я створив чистий проект, і він не працює: github.com/Bresiu/ThemeTest . У кольорах кнопки Lolipop з кольором наголосу та на API v16 кнопка залишається сірою: i.imgur.com/EVwkpk2.png
Bresiu

4
Це спрацювало лише тоді, коли вказували атрибут android: theme. Я не міг змусити стиль атрибуту працювати для мене за допомогою тега кнопки.
Рей Хантер

8
Використовуючи v23.1 lib, це не спрацювало правильно, він завжди показував колір наголосу як bg, а не той, що визначений, коли намагався встановити його на всю тему
Патрік Фавр

3
Ця ж проблема тут, на v23.1 відключена кнопка того ж кольору, що і кнопка з увімкненою функцією. дуже засмучує. хтось це зрозуміє?
AhmedW

63

У бібліотеці підтримки Android 22.1.0 Google відзначив Buttonвідтінок. Отже, ще один спосіб налаштувати колір тла кнопки - використовувати backgroundTintатрибут.

Наприклад,

<Button
       android:id="@+id/add_remove_button"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:backgroundTint="@color/bg_remove_btn_default"
       android:textColor="@android:color/white"
       tools:text="Remove" />

1
Нарешті! Блог про випуск 22.1: android-developers.blogspot.no/2015/04/…
GuillermoMP

5
Документація говорить: "Це буде автоматично використано, коли ви використовуєте Кнопку у своїх макетах. Вам потрібно буде використовувати цей клас лише вручну під час написання користувацьких представлень". developer.android.com/reference/android/support/v7/widget/… це означає, що нам не потрібно вручну змінювати всі наші макети та код Java?
Стефан

@Stephane ні, ми повинні змінити макети. chris.banes.me/2015/04/22/support-libraries-v22-1-0
Антон Головін

ДУЖЕ! Тепер, чи існує AppCompatToggleButton, який дозволяє змінювати фон ToggleButtons? Можливо, я можу плагіатувати код ...
swooby

19
На жаль, це працює лише на API 21+. Атрибут android: backgroundTint не працює на попередньому Lollipop навіть з бібліотекою AppCompat. Тільки colorButtonNormal з теми працює на попередньому Lollipop.
Timur_C

42

Для підтримки кольорових кнопок використовуйте останню бібліотеку AppCompat (> 23.2.1 ) з:

надути - XML

Віджет AppCompat:

android.support.v7.widget.AppCompatButton

Стиль AppCompat:

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

NB! Щоб встановити спеціальний колір у xml: використовуйте attr: appзамістьandroid

(використовувати alt+enterабо оголосити xmlns:app="http://schemas.android.com/apk/res-auto"про використання app)

додаток : backgroundTint = "@ color / your_custom_color"

Приклад:

<android.support.v7.widget.AppCompatButton
     style="@style/Widget.AppCompat.Button.Colored"
     app:backgroundTint="@color/your_custom_color"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"     
     android:text="Colored Button"/>

або встановити програмно - JAVA

 ViewCompat.setBackgroundTintList(your_colored_button,
 ContextCompat.getColorStateList(getContext(),R.color.your_custom_color));

Ваш код Java працював на мене. І відповідь Мухаммада Альфайфі допомогла встановити колір тексту кнопки.
Мікро,

чи є простий спосіб програмно встановити відтінок (а не фон)?
склепіння

Чудово! Працює і на 4.4.4! І селекторний стан також підтримується досить добре!
sud007

За документами : Це автоматично використовується під час встановлення кнопок у ваших макетах. Потрібно вказати AppCompatButton лише під час створення спеціальних представлень.
gMale

Цікаво, що зміни XML чудово працювали у фрагменті, але не у макеті Activity. Кнопки активності використовували лише colorAccent Хоча програмна версія працювала.
Леон

25

За допомогою останньої бібліотеки підтримки ви можете просто успадкувати вашу діяльність від AppCompatActivity, тому вона роздує ваш Buttonяк AppCompatButtonі надасть вам можливість стилю кольору кожної окремої кнопки на макеті з використанням android:theme="@style/SomeButtonStyle", де SomeButtonStyle:

<style name="SomeButtonStyle" parent="@android:style/Widget.Button">
    <item name="colorButtonNormal">@color/example_color</item>
</style>

Для мене працювали в 2.3.7, 4.4.1, 5.0.2


Дякую!!! Я щойно змінив батьківське значення для "Widget.AppCompat.EditText", оскільки мені потрібно оновити стиль EditText.
Хуан Саравія

3
Дякую, працювали і для мене. Обов’язково використовуйте, android:themeа ні style. Ви також можете додати colorControlHighlightі colorControlActivated.
Рейчел

не працює, API 22, AppCompatActivity, тема Матеріал.Літ
Андрій Углев

1
@AndreyUglev спробуйте використовувати Theme.AppCompat.Lightзамість цього.
Артем

Привіт, це змінює потрібний колір, АЛЕ видаляє тіні.
Amio.io

16

якщо ви хочете нижче стилю

введіть тут опис зображення

додайте цей стиль вашої кнопки

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

якщо ви хочете цього стилю

введіть тут опис зображення

додати код нижче

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

1
compile 'com.android.support:appcompat-v7:23.1.0'Ви повинні додати.
Пратік Бутані

1
але питання полягає в тому, як мати кнопки матеріалу з різними кольорами, щоб не всі мали основний колір теми.
Апострофікс

15

Відповідь - ТЕМА, а не стиль

Проблема полягає в тому, що колір кнопки дотримується кольоруButtonNormal теми. Я намагався змінити Стиль різними способами, не пощастивши. Тому я змінив тему кнопки .

Створіть тему кольоромButtonNormal and colorPrimary:

<style name="ThemeAwesomeButtonColor" parent="AppTheme">
    <item name="colorPrimary">@color/awesomePrimaryColor</item>
    <item name="colorButtonNormal">@color/awesomeButtonColor</item>
</style>

Використовуйте цю тему в кнопці

<Button
        android:id="@+id/btn_awesome"
        style="@style/AppTheme.Button"
        android:theme="@style/ThemeAwesomeButtonColor"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="@string/btn_awesome"/>

"AppTheme.Button" може бути будь-якою річчю, розширює стиль кнопки, як тут, я використовую основний колір для тексту тексту:

<style name="AppTheme.Button" parent="Base.Widget.AppCompat.Button">
    ...
    <item name="android:textColor">?attr/colorPrimary</item>
    ...
</style>

І ви отримуєте кнопку в будь-якому кольорі, який ви хочете, що сумісний з матеріалом дизайну.


які ще атрибути я можу додати до стилів.
Сагар Наяк

4

Я щойно створив бібліотеку Android, що дозволяє легко змінювати колір кнопки та колір пульсацій

https://github.com/xgc1986/RippleButton

<com.xgc1986.ripplebutton.widget.RippleButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/btn"
    android:text="Android button modified in layout"
    android:textColor="@android:color/white"
    app:buttonColor="@android:color/black"
    app:rippleColor="@android:color/white"/>

Вам не потрібно створювати стиль для кожної кнопки, яку ви хочете, з іншим кольором, що дозволяє вам налаштовувати кольори випадковим чином


4

ця робота для мене з appcompat-v7: 22.2.0 в android + 4.0

у ваших стилях.xml

<style name="Button.Tinted" parent="Widget.AppCompat.Button">
    <item name="colorButtonNormal">YOUR_TINT_COLOR</item>
    <item name="colorControlHighlight">@color/colorAccent</item>
    <item name="android:textColor">@android:color/white</item>
</style>

у вашому файлі компонування

<Button
    android:id="@+id/but_next"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="@string/but_continue"
    android:theme="@style/Button.Tinted" />

Привіт, це змінює потрібний колір, АЛЕ видаляє тіні.
Amio.io

Привіт знову, я бачу. Зараз це правильна поведінка.
Amio.io

Як це можна зробити на Java?
Мікро,

@MicroR перевірте відповідь вище.
ingyesid

4

Макет:

<android.support.v7.widget.AppCompatButton
  style="@style/MyButton"
  ...
  />

styles.xml:

<style name="MyButton" parent="Widget.AppCompat.Button.Colored">
  <item name="backgroundTint">@color/button_background_selector</item>
  <item name="android:textColor">@color/button_text_selector</item>
</style>

color / button_background_selector.xml:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_enabled="false" android:color="#555555"/>
    <item android:color="#00ff00"/>
</selector>

color / button_text_selector.xml:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_enabled="false" android:color="#888888"/>
    <item android:color="#ffffff"/>
</selector>

3

Для тих, хто використовує ImageButton тут, як це зробити:

У style.xml:

<style name="BlueImageButton" parent="Base.Widget.AppCompat.ImageButton">
    <item name="colorButtonNormal">@color/primary</item>
    <item name="android:tint">@color/white</item>
</style>

у v21 / style.xml:

<style name="BlueImageButton" parent="Widget.AppCompat.ImageButton">
    <item name="android:colorButtonNormal">@color/primary</item>
    <item name="android:tint">@color/white</item>
</style>

Потім у вашому файлі компонування:

<android.support.v7.widget.AppCompatImageButton
    android:id="@+id/my_button"
    android:theme="@style/BlueImageButton"
    android:layout_width="42dp"
    android:layout_height="42dp"
    android:layout_gravity="center_vertical"
    android:src="@drawable/ic_check_black_24dp"
    />

Це допомогло .... Я думаю, важливо зазначити, що застосувати стиль кнопки як тему замість стилю у віджеті Button. Я застосовував його під style = "@ style / BlueImageButton", і це не спрацювало
velval

3

Якщо ви використовуєте стильове рішення з colorButtonNormal , не забудьте успадкувати від Widget.AppCompat.Button.Colored щоб ефект пульсацій працював;)

Подібно до

<style name="CustomButtonStyle" parent="Widget.AppCompat.Button.Colored">
      <item name="colorButtonNormal">@android:color/white</item>
</style>

2

Ще одне просте рішення за допомогою AppCompatButton

<android.support.v7.widget.AppCompatButton
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     style="@style/Widget.AppCompat.Button.Colored"
     app:backgroundTint="@color/red"
     android:text="UNINSTALL" />

2

Використання:

android:backgroundTint="@color/customColor"

Або навіть :

android:background="@color/customColor"

і це додасть кнопці користувальницький колір.


1

Якщо ви хочете лише кнопку "Плоский", ви можете налаштувати їх фон за допомогою атрибута selectableItemBackground, як пояснено тут .


Якщо ви не хочете змінювати жоден з "відтінків" кольорів або вибраних кольорів, це, безумовно, просте рішення, як і раніше отримати зворотній зв'язок з кольоровими кнопками. Дякую!
theblang

1

Для зміни кольору однієї кнопки

ViewCompat.setBackgroundTintList(button, getResources().getColorStateList(R.color.colorId));

1

Для мене проблема полягала в тому, що в Android 5.0 це android:colorButtonNormalне мало ефекту, і насправді жодного пункту з теми (як android:colorAccent), але, наприклад, в Android 4.4.3. Проект був налаштований на compileSdkVersionта targetSdkVersionдо 22, тому я вніс усі зміни, як @Muhammad Alfaifi сугестирував, але врешті-решт я помітив, що проблема полягала у складанні buildToolsVersion , яка не оновлювалася. Як тільки я змінився на 23.0.1 , все починає працювати майже як нормально. Тепер, android:colorButtonNormalефект все ще не має ефекту, але принаймні кнопка реагує на цеandroid:colorAccent , що для мене прийнятно.

Я сподіваюся, що цей підказ може комусь допомогти. Примітка: я застосував стиль безпосередньо до кнопки, оскільки кнопка android:theme=[...]також не мала ефекту.


Ви майже знайшли 100% правильний спосіб використання нового @ style / Widget.AppCompat.Button.Colored;) - дивіться цю відповідь stackoverflow.com/a/35811157/19733911
sosite

1

Один із способів усунути це дозволяє просто вказувати на стиль, а НЕ темати ВСІ кнопки у вашому додатку однаковими.
У themes.xml додайте тему

    <style name="Theme.MyApp.Button.Primary.Blue" parent="Widget.AppCompat.Button">
        <item name="colorButtonNormal">@color/someColor</item>
        <item name="android:textColorPrimary">@android:color/white</item>
    </style>

Тепер у styles.xml add

    <style name="MyApp.Button.Primary.Blue" parent="">
        <item name="android:theme">@style/Theme.MyApp.Button.Primary.Blue</item>
    </style>

Тепер у своєму макеті просто вкажіть на СТИЛЬ у вашій кнопці

    <Button
        ...
        style="@style/MyApp.Button.Primary.Blue"
        ...  />

1

ОНОВЛЕННЯ

Використовуйте бібліотеку підтримки дизайну (23.2.0) та appcompatwidgets, як показано нижче

У бібліотеці підтримки Android 22.1 :

Це робиться автоматично при надуванні макетів - замінюючи кнопку на AppCompatButton, TextView на AppCompatTextView тощо, щоб гарантувати, що кожен може підтримувати тонування. У цьому випуску ці віджети про відтінки тепер доступні для загального користування, що дозволяє вам підтримувати підтримку тонування, навіть якщо вам потрібно підкласирувати один із підтримуваних віджетів.

Повний список віджетів з відтінком:

AppCompatAutoCompleteTextView
AppCompatButton
AppCompatCheckBox
AppCompatCheckedTextView
AppCompatEditText
AppCompatMultiAutoCompleteTextView
AppCompatRadioButton
AppCompatRatingBar
AppCompatSpinner
AppCompatTextView

Конструкція матеріалу для пристроїв, що попередньо розмолоті :

AppCompat (він же ActionBarCompat) розпочався як підтримка Android 4.0 ActionBar API для пристроїв, що працюють на Gingerbread, забезпечуючи загальний API API поверх підтримуваної реалізації та реалізації рамки. AppCompat v21 пропонує API та набір функцій, які є сучасними для Android 5.0



1

Якщо ви хочете використовувати стиль AppCompat , наприклад Widget.AppCompat.Button , Base.Widget.AppCompat.Button.Colored тощо, вам потрібно використовувати ці стилі з сумісними видами з бібліотеки підтримки.

Код, наведений нижче, не працює для пристроїв, що попередньо використовуються:

<Button
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:theme="@style/Widget.AppCompat.Button" />

Вам потрібно використовувати AppCompatButton для включених стилів AppCompat:

<android.support.v7.widget.AppCompatButton
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:theme="@style/Widget.AppCompat.Button" />

2
Чи не використовуються автоматично віджети програм compat при надуванні макетів XML? Я вважаю, що ImageViewйого замінюють, AppCompatImageViewі це має бути однаково з усіма віджетами, які мають відповідну AppCompatверсію.
д.аемон

Ні, якщо ви не орієнтовані на останню цільову версію, вам потрібно android.support.v7.widget.AppCompatImageViewчітко визначитись .
farukcankaya

Що ти маєш на увазі last target version, @power?
d.aemon

1

Я цим користуюся. Ефект пульсації та натискання кнопки працює на тіні.

style.xml

<style name="Button.Red" parent="Widget.AppCompat.Button.Colored">
    <item name="android:textColor">@color/material_white</item>
    <item name="android:backgroundTint">@color/red</item>
</style>

Кнопка на макеті:

<Button
        style="@style/Button.Red"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="@string/close"/>

0

Я насправді не хотів змінювати свої власні стилі кнопок, але, на жаль, вони більше не працювали.

У моєму додатку є minSdkVersion 9, і все працювало раніше.

Я не знаю, чому, але, оскільки я видалив андроїд: перед кнопкою Стиль, здається, знову працює

зараз = працює:

<item name="buttonStyle">@style/ButtonmyTime</item>

до = просто сірі кнопки матеріалу:

<item name="android:buttonStyle">@style/ButtonmyTime</item>

У мене немає спеціальної папки для новішої версії Android, оскільки мої кнопки досить плоскі, і вони повинні виглядати однаково для всіх версій Android.

Можливо, хтось може сказати мені, чому мені довелося видалити "android:" ImageButton все ще працює з "android:"

<item name="android:imageButtonStyle">@style/ImageButtonmyTimeGreen</item>

0

Після 2 днів пошуку відповідей тематизація кнопок не працювала для мене в API <21.

Моє єдине рішення - замінити відтінок AppCompatButton не тільки базовою темою додатка "colorButtonNormal", але і фоном перегляду.

public class AppCompatColorButton extends AppCompatButton {

    public AppCompatColorButton(Context context) {
        this(context, null);
    }

    public AppCompatColorButton(Context context, AttributeSet attrs) {
        this(context, attrs, android.support.v7.appcompat.R.attr.buttonStyle);
    }

    public AppCompatColorButton(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);

        if (TintManager.SHOULD_BE_USED) {
            setSupportBackgroundTintList(createButtonColorStateList(getContext(), attrs, defStyleAttr));
        }
    }

    static final int[] DISABLED_STATE_SET = new int[]{-android.R.attr.state_enabled};
    static final int[] FOCUSED_STATE_SET = new int[]{android.R.attr.state_focused};
    static final int[] PRESSED_STATE_SET = new int[]{android.R.attr.state_pressed};
    static final int[] EMPTY_STATE_SET = new int[0];

    private ColorStateList createButtonColorStateList(Context context, AttributeSet attrs, int defStyleAttr) {
        final int[][] states = new int[4][];
        final int[] colors = new int[4];
        int i = 0;

        final int themeColorButtonNormal = ThemeUtils.getThemeAttrColor(context, android.support.v7.appcompat.R.attr.colorButtonNormal);
        /*TypedArray a = context.obtainStyledAttributes(attrs, new int[] { android.R.attr.backgroundTint }, defStyleAttr, 0);
        final int colorButtonNormal = a.getColor(0, themeColorButtonNormal);*/
        TypedArray a = context.obtainStyledAttributes(attrs, android.support.v7.appcompat.R.styleable.View, defStyleAttr, 0);
        final int colorButtonNormal = a.getColor(android.support.v7.appcompat.R.styleable.View_backgroundTint, themeColorButtonNormal);
        a.recycle();
        final int colorControlHighlight = ThemeUtils.getThemeAttrColor(context, android.support.v7.appcompat.R.attr.colorControlHighlight);

        // Disabled state
        states[i] = DISABLED_STATE_SET;
        colors[i] = ThemeUtils.getDisabledThemeAttrColor(context, android.support.v7.appcompat.R.attr.colorButtonNormal);
        i++;

        states[i] = PRESSED_STATE_SET;
        colors[i] = ColorUtils.compositeColors(colorControlHighlight, colorButtonNormal);
        i++;

        states[i] = FOCUSED_STATE_SET;
        colors[i] = ColorUtils.compositeColors(colorControlHighlight, colorButtonNormal);
        i++;

        // Default enabled state
        states[i] = EMPTY_STATE_SET;
        colors[i] = colorButtonNormal;
        i++;

        return new ColorStateList(states, colors);
    }
}

Потім ви можете визначити свій колір кнопки так:

<com.example.views.AppCompatColorButton
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:backgroundTint="#ffff0000"
            app:backgroundTint="#ffff0000"
            android:text="Button"
            android:textColor="@android:color/white" />

0

Ця відповідь ТА допомогла мені дійти відповіді https://stackoverflow.com/a/30277424/3075340

Цей метод утиліти використовую для встановлення фонового відтінку кнопки. Він працює з пристроями до льодяника:

// Set button background tint programmatically so it is compatible with pre-lollipop devices.
public static void setButtonBackgroundTintAppCompat(Button button, ColorStateList colorStateList){
    Drawable d = button.getBackground();
    if (button instanceof AppCompatButton) {
        // appcompat button replaces tint of its drawable background
        ((AppCompatButton)button).setSupportBackgroundTintList(colorStateList);
    } else if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
        // Lollipop button replaces tint of its drawable background
        // however it is not equal to d.setTintList(c)
        button.setBackgroundTintList(colorStateList);
    } else {
        // this should only happen if
        // * manually creating a Button instead of AppCompatButton
        // * LayoutInflater did not translate a Button to AppCompatButton
        d = DrawableCompat.wrap(d);
        DrawableCompat.setTintList(d, colorStateList);
        button.setBackgroundDrawable(d);
    }

}

Як користуватися кодом:

Utility.setButtonBackgroundTintAppCompat(myButton,
ContextCompat.getColorStateList(mContext, R.color.your_custom_color));

Таким чином, вам не потрібно вказувати ColorStateList, якщо ви просто хочете змінити відтінок фону, і нічого іншого, крім збереження гарних ефектів кнопок, а що ні.


0

Я налаштований android:textColorна@null в моїй темі кнопки , і це допомагає.

styles.xml

<style name="Button.Base.Borderless" parent="Widget.AppCompat.Button.Borderless.Colored">
    <item name="android:textColor">@null</item>
</style>

some_layout.xml

<Button
    style="@style/Button.Base.Borderless"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/hint" />

Тепер колір тексту кнопки colorAccentвизначено вAppTheme

<style name="AppTheme" parent="@style/Theme.AppCompat.Light.NoActionBar">
    <item name="colorAccent">@color/colorAccent</item>
    <item name="borderlessButtonStyle">@style/Button.Base.Borderless</item>
    <item name="alertDialogTheme">@style/AlertDialog</item>
</style>

0

якщо ви використовуєте kotlin, чи бачите, що всі атрибути з MaterialButton підтримуються. Не використовуйте атрибут android: background. MaterialButton керує власною фоновою схемою для малювання, а встановлення нового фону означає, що колір кнопки "Матеріал" відключений більше не може гарантувати, що нові атрибути, які він вводить, працюватимуть належним чином. Якщо фон за замовчуванням змінено, кнопка "Матеріал" не може гарантувати чітко визначену поведінку. На MainActivity.kt

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        buttonClick.setOnClickListener {
            (it as MaterialButton).apply {
                backgroundTintList = ColorStateList.valueOf(Color.YELLOW)
                backgroundTintMode = PorterDuff.Mode.SRC_ATOP
            }
        }
    }
}

На Activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/constraintLayout"
    tools:context=".MainActivity">
    <com.google.android.material.button.MaterialButton
        android:id="@+id/buttonNormal"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="24dp"
        android:text="Material Button Normal"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
    <com.google.android.material.button.MaterialButton
        android:id="@+id/buttonTint"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="16dp"
        android:backgroundTint="#D3212D"
        android:text="Material Button Background Red"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/buttonNormal" />
    <com.google.android.material.button.MaterialButton
        android:id="@+id/buttonTintMode"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="16dp"
        android:backgroundTint="#D3212D"
        android:backgroundTintMode="multiply"
        android:text="Tint Red + Mode Multiply"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/buttonTint" />
    <com.google.android.material.button.MaterialButton
        android:id="@+id/buttonClick"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="32dp"
        android:text="Click To Change Background"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.498"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/buttonTintMode" />
</androidx.constraintlayout.widget.ConstraintLayout>

ресурс: Приклад зміни кнопки матеріалу


0

якщо ви хочете зробити це за допомогою коду в будь-якому кольорі, скористайтеся цим:

DrawableCompat.setTintList(button.getBackground(), ColorStateList.valueOf(yourColor));
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.