Кнопки раскраски в Android с материальным дизайном и AppCompat
До выхода AppCompat
сегодня я смог изменить цвет кнопок в Android L, но не в более старых версиях. После включения нового обновления AppCompat я не могу изменить цвет для любой версии, когда я пытаюсь, кнопка просто исчезает. Кто-нибудь знает, как изменить цвет кнопки?
На следующих рисунках показано, чего я хочу достичь:
- Что такое разделение проблем?
- Как использовать TabLayout с панелью инструментов внутри CollapsingToolbarLayout?
- Как изменить цвет заголовка AlertDialog и цвет линии под ним
- CollapsingToolbarLayout setTitle () не обновляется, если не свернут
- Каким должен быть цвет Ripple, colorPrimary или colorAccent? (Дизайн материалов)
Белая кнопка по умолчанию, красный – это то, что я хочу.
Это то, что я делал ранее, чтобы изменить цвет кнопок в styles.xml
:
insert color here
и сделать это динамически:
button.getBackground().setColorFilter(getResources().getColor(insert color here), PorterDuff.Mode.MULTIPLY);
Также я изменил родительскую тему от @android:style/Theme.Material.Light.DarkActionBar
к Theme.AppCompat.Light.DarkActionBar
- Совместимость материалов дизайна с версиями ниже Android 5.0?
- Каким будет лучший способ создать мою программу?
- Заказ параметров для использования каррирования
- Действительно ли метатег видового экрана необходим?
- Java AWT / SWT / Swing: как планировать графический интерфейс?
- Когда добавляется новая строка в базе данных, необходимо вызвать внешнюю программу командной строки
- Почему статические методы не считаются хорошей практикой OO?
- Как сделать панель инструментов прозрачной?
Официально зафиксировано в Библиотеке поддержки rev.22 (Пт 13 марта 2015 г.). См. Соответствующую проблему с кодом Google:
https://issuetracker.google.com/issues/37008632
Пример использования
theme.xml:
- @color/button_color
v21 / theme.xml
- @color/button_color
Изменить (22.06.2016):
Библиотека Appcompat начала поддерживать кнопки материала после того, как я отправил исходный ответ. В этом посте вы можете увидеть самую легкую реализацию поднятых и плоских кнопок.
Оригинальный ответ:
Поскольку этот AppCompat не поддерживает кнопку, вы можете использовать xml в качестве фона. Для этого я взглянул на исходный код Android и нашел связанные файлы для кнопок стилей материала.
1 – Посмотрите на оригинальную реализацию кнопки материала из источника.
Посмотрите на btn_default_material.xml на исходный код Android .
Вы можете скопировать файл в свою папку drawable-v21. Но не прикасайтесь к цвету attr здесь. Файл, который вам нужно изменить, – это второй файл.
вытяжка-V21 / custom_btn.xml
2 – Получить форму кнопки исходного материала
Как вы понимаете, в этом чертеже используется форма, которую вы можете найти в этом файле исходного кода .
3 – Получение размеров кнопки материала
И в этом файле вы найдете некоторые размеры, используемые в файле, который вы можете найти здесь . Вы можете скопировать весь файл и поместить его в папку значений . Это важно для применения одинакового размера (который используется в кнопках материала) ко всем кнопкам
4 – Создайте еще один файл для старых версий
Для более старых версий у вас должен быть другой вариант с одинаковым именем. Я просто помещаю элементы inline вместо ссылки. Вы можете обратиться к ним. Но опять же, самое главное – это оригинальные размеры кнопки материала.
рисуем / custom_btn.xml
-
-
-
результат
Ваша кнопка будет иметь эффект пульсации на устройствах Lollipop. Старые версии будут иметь точно такую же кнопку, кроме эффекта пульсации. Но так как вы предоставляете чертежи для разных состояний, они также будут реагировать на события касания (как по-старому).
Это было расширено в 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
- @style/BrandButtonStyle
В ваших values/style
В ваших values-v21/style
Поскольку ваша тема кнопки основана на Widget.AppCompat.Button.Colored
Цвет текста на кнопке по умолчанию белый!
но кажется, что есть проблема, когда вы отключите кнопку, кнопка изменит ее цвет на светло-серый, но цвет текста останется белым!
обходным путем для этого является установка цвета текста на кнопке на белый! как я сделал в стиле, показанном выше.
теперь вы можете просто определить свою кнопку и позволить AppCompat делать все остальное 🙂
Состояние инвалидов
Включенное государство
В Android Support Library 22.1.0 Google запустил значок Button
. Таким образом, другой способ настроить цвет фона кнопки – использовать атрибут backgroundTint
.
Например,
Для поддержки цветных кнопок используйте последнюю библиотеку AppCompat (> 23.2.1 ) с помощью:
раздуть – XML
Виджет AppCompat:
android.support.v7.widget.AppCompatButton
Стиль AppCompat:
style="@style/Widget.AppCompat.Button.Colored"
NB! Чтобы установить собственный цвет в xml: используйте app
attr: app
вместо android
(используйте приложение alt+enter
или объявите xmlns:app="http://schemas.android.com/apk/res-auto"
чтобы использовать app
)
app : backgroundTint = “@ color / your_custom_color”
Пример:
или установить его программно – JAVA
ViewCompat.setBackgroundTintList(your_colored_button, ContextCompat.getColorStateList(getContext(),R.color.your_custom_color));
С помощью последней библиотеки поддержки вы можете просто наследовать свою активность из AppCompatActivity
, поэтому она будет раздувать вашу Button
как AppCompatButton
и дать вам возможность android:theme="@style/SomeButtonStyle"
цвет каждой отдельной кнопки на макете с использованием android:theme="@style/SomeButtonStyle"
, где SomeButtonStyle
:
Работал для меня в 2.3.7, 4.4.1, 5.0.2
если вы хотите ниже стиль
добавьте этот стиль в свою кнопку
style="@style/Widget.AppCompat.Button.Borderless.Colored"
если вы хотите этот стиль
добавить ниже код
style="@style/Widget.AppCompat.Button.Colored"
Ответ в THEME не стиль
Проблема в том, что цвет кнопки имеет значение colorButtonNormal темы. Я попытался изменить стиль разными способами без везения. Поэтому я изменил тему кнопки .
Создайте тему с помощью colorButtonNormal и colorPrimary:
Используйте эту тему в кнопке
«AppTheme.Button» может быть любой вещью, расширяющей стиль Button, так как здесь я использую основной цвет для цвета текста:
И вы получаете кнопку любого цвета, который вы хотите, совместимый с материальным дизайном.
Я только что создал андроидную библиотеку, которая позволяет легко изменять цвет кнопки и цвет пульсации
https://github.com/xgc1986/RippleButton
Вам не нужно создавать стиль для каждой кнопки, которую вы хотите, с другим цветом, что позволяет настраивать цвета в случайном порядке
эта работа для меня с appcompat-v7: 22.2.0 в android + 4.0
в ваших стилях.xml
в вашем файле макета
Планировка:
styles.xml:
цвет / button_background_selector.xml:
цвет / button_text_selector.xml:
Для тех, кто использует ImageButton
вот как вы это делаете:
В style.xml:
в v21 / style.xml:
Затем в вашем файле макета:
Если вы используете решение стиля с помощью colorButtonNormal , не забудьте унаследовать от Widget.AppCompat.Button.Colored, так что эффект пульсации работает;)
подобно
Если вы хотите только кнопку «Плоский» материал, вы можете настроить их фон, используя атрибут selectableItemBackground, как описано здесь .
Для меня проблема заключалась в том, что в Android 5.0 android:colorButtonNormal
имел никакого эффекта, и фактически ни один элемент из темы (например, android:colorAccent
), но, например, в Android 4.4.3. Проект был сконфигурирован с compileSdkVersion
и targetSdkVersion
на 22, поэтому я внес все изменения, как @Muhammad Alfaifi sugessted, но, в конце концов, я заметил, что проблема была в buildToolsVersion , которая не обновлялась. Как только я перешел на 23.0.1 , все начинает работать почти как обычно. Теперь android:colorButtonNormal
все еще не действует, но по крайней мере кнопка реагирует на android:colorAccent
, что для меня приемлемо.
Надеюсь, что этот намек может помочь кому-то. Примечание. Я применил стиль непосредственно к кнопке, так как android:theme=[...]
кнопки android:theme=[...]
также не имел эффекта.
Один из способов сделать это позволяет вам просто указать стиль и НЕ тему ВСЕ кнопки в вашем приложении одинаковые.
В theme.xml добавьте тему
Теперь в styles.xml add
Теперь в вашем макете просто укажите STYLE в вашей кнопке
ОБНОВИТЬ
Используйте библиотеку поддержки дизайна (23.2.0) и appcompatwidgets, как показано ниже.
В Android Support Library 22.1 :
Это делается автоматически при раздувании макетов – замена кнопки с помощью AppCompatButton, TextView с AppCompatTextView и т. Д., Чтобы гарантировать, что каждый из них может поддерживать тонирование. В этом выпуске эти виджеты с подсветкой становятся общедоступными, что позволяет поддерживать поддержку тонирования, даже если вам нужно подclassифицировать один из поддерживаемых виджетов.
Полный список виджетов:
AppCompatAutoCompleteTextView AppCompatButton AppCompatCheckBox AppCompatCheckedTextView AppCompatEditText AppCompatMultiAutoCompleteTextView AppCompatRadioButton AppCompatRatingBar AppCompatSpinner AppCompatTextView
Конструкция материалов для устройств с предварительным охлаждением :
AppCompat (aka ActionBarCompat) начал работать как backport для Android 4.0 ActionBar API для устройств, работающих на Gingerbread, обеспечивая общий уровень API поверх реализации с поддержкой backported и реализации фреймворка. AppCompat v21 предоставляет API и набор функций, обновляемый с Android 5.0
Если вы хотите использовать стиль AppCompat, такой как Widget.AppCompat.Button , Base.Widget.AppCompat.Button.Colored и т. Д., Вам нужно использовать эти стили с совместимыми представлениями из библиотеки поддержки.
Код ниже не работает для прелолипопных устройств:
Вам нужно использовать AppCompatButton для включения стилей AppCompat:
Я действительно не хотел менять свои пользовательские стили кнопок, но, к сожалению, они больше не работали.
Мое приложение имеет minSdkVersion 9 и все работает раньше.
Я не знаю, почему, но так как я удалил андроид: перед buttonStyle, похоже, снова работает
now = working:
before = только серые кнопки материала:
У меня нет специальной папки для новой версии Android, так как мои кнопки довольно плоские, и они должны выглядеть одинаково во всех версиях Android.
Может быть, кто-то может сказать мне, почему мне пришлось удалить «андроид»: ImageButton все еще работает с «android:»
- @style/ImageButtonmyTimeGreen
Спустя 2 дня, чтобы найти ответы, тематическая тематика не работала для меня в API <21.
Мое единственное решение состоит в том, чтобы переопределить AppCompatButton тонировку не только с базовой темой приложения «colorButtonNormal», но и с фоном backgroundtint вида:
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); } }
Затем вы можете определить свой цвет кнопки следующим образом:
Чтобы изменить цвет одной кнопки
ViewCompat.setBackgroundTintList(button, getResources().getColorStateList(R.color.colorId));
Этот ответ SO помог мне прийти к ответу 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, если вы просто хотите изменить оттенок фона и ничего больше, кроме сохранения эффектных эффектов кнопок, а что нет.
Еще одно простое решение с помощью AppCompatButton
Я установил android:textColor
@null
в моей теме кнопки, и это помогает.
styles.xml
some_layout.xml
Теперь цвет текста кнопки colorAccent
определен в AppTheme