Как закруглить углы кнопки и менять цвет при нажатии в android
У меня есть button.xml и мне нужно в нем закруглить кнопку и одновременно с этим менять цвета при нажатии. Вот код:
Однако оно не работает. Если убрать закругление или обработку нажатия, то все нормально, но вместе нет. Как реализовать эту функцию?
Отслеживать
задан 2 июн 2017 в 19:41
71 1 1 золотой знак 1 1 серебряный знак 10 10 бронзовых знаков
1 ответ 1
Сортировка: Сброс на вариант по умолчанию
Всё делается довольно просто, и я посоветую поступить именно так, ибо так намного удобнее:
Укажите стиль для своей кнопки:
Создайте свой стиль в res/values/styles.xml :
Теперь далее, /res/drawable/button_main.xml :
И уже в этих файлах проводите настройку, как будет выглядеть кнопка в обычном состоянии, при нажатии и так далее, например button_main_shape.xml :
Здесь уже указываете все необходимые параметры. Таким образом, вы можете сделать так, чтобы при нажатии и в обычном состоянии кнопки выглядели абсолютно по-разному.
Могу посоветовать этот и этот сервисы, с помощью которых удобно и наглядно можно создать нужный вам shape.
Drawable. Фигуры и градиенты
Фигуры являются подмножеством Drawable-ресурсов.
Данный вид ресурсов на основе класса ShapeDrawable позволяет описывать простые геометрические фигуры, указывая их размеры, фон и контур с помощью тега .
Можно создавать ресурсы фигур на основе стандартных фигур вроде прямоугольника, эллипса, линии. Для использования ресурсов фигур нужно создать в подкаталоге res/drawable XML-файл, в котором будет присутствовать тег , который в свою очередь может содержать дочерние элементы , , , , , .
Имя файла без расширения будет служить идентификатором (ID): R.drawable.filename в Java-коде и @[package:]drawable/filename в XML-файлах.
Элементы фигуры
- xmlns:android — обязательный атрибут со строкой «http://schemas.android.com/apk/res/android»
- android:shape — задаёт тип фигуры: rectangle (прямоугольник, заполняющий элемент, является фигурой по умолчанию), oval (овал), line (линия, требуется также наличие элемента для задания ширины линии), ring (окружность, для данной фигуры можно использовать атрибуты android:innerRadius, android:innerRadiusRatio, android:thickness, android:thicknessRatio, android:useLevel)
- — создаёт закругленные углы для фигуры. Только для прямоугольника. Возможные атрибуты: android:radius, android:topLeftRadius, android:topRightRadius, android:bottomLeftRadius, android:bottomRightRadius
- — задаёт градиентную заливку для фигуры. Возможные атрибуты: android:angle, android:centerX, android:centerY, android:centerColor, android:endColor, android:gradientRadius, android:startColor, android:type, android:useLevel
- — отступы. Возможные атрибуты: android:left, android:top, android:right, android:bottom
- — размеры фигуры. Возможные атрибуты: android:height, android:width
- — сплошной цвет для фигуры. Возможные атрибуты: android:color
- — контур фигуры. Возможные атрибуты: android:width, android:color, android:dashGap (расстояние между черточками), android:dashWidth (длина пунктирной черточки)
rectangle (Прямоугольник)
shape_rect.xml — Атрибут android:shape здесь необязателен: rectangle — это значение по умолчанию.
Пример с градиентным прямоугольником в качестве разделителя
Создадим файл separator.xml:
В разметке приложения добавим код:
У первого разделителя ширина 1dp, у второго — 3dp. Получили красивую полоску.
У прямоугольников можно скруглить углы при помощи тега corners
Можно закруглить углы по отдельности:
rectangle_rounded_some.xml
oval (Эллипс)
shape_oval.xml
Другой вариант с пунктиром:
ring (Кольцо)
shape_ring.xml — Для кольца имеются дополнительные атрибуты:
innerRadius Внутренний радиус innerRadiusRatio Отношение между внешним и внутренним радиусами. По умолчанию равно 3 thickness Толщина кольца (т.е. разница между внешним и внутренним радиусами) thicknessRatio Отношение ширины кольца к его толщине. По умолчанию равно 9
line (Горизонтальная линия)
shape_line.xml — Линия может быть только горизонтальной
Градиенты: gradient и GradientDrawable
Тег gradient (класс GradientDrawable) позволяет создавать сложные градиентные заливки. Каждый градиент описывает плавный переход между двумя или тремя цветами с помощью линейного/радиального алгоритма или же используя метод развертки.
Тег gradient внутри тега shape. Основные атрибуты: type, startColor (обязателен), endColor (обязателен) и middleColor (необязателен). Также иногда оказывается полезным атрибут centerColor.
Используя атрибут type, вы можете описать свой градиент:
linear
gradient_linear.xml
- android:type=»linear» можно опустить, он так и есть по умолчанию. Отображает прямой переход от цвета startColor к цвету endColor под углом, заданным в атрибуте angle.
- Атрибут android:angle используется только линейным градиентом и должен быть кратным значению 45.
Дополнительный материал: Android Dev Tip #3 — помните о прозрачности, который может привести к другому результату.
Также можно задействовать атрибуты centerX и centerY.
radial
- android:gradientRadius является обязательным для радиального градиента, а у остальных игнорируется. Рисует круговой градиент, начиная с цвета startColor и заканчивая endColor, от внешнего края фигуры до её центра (ещё есть centerColor). Атрибут gradientRadius указывает радиус градиентного перехода в пикселях. Поскольку радиус градиента указывается в пикселях, он не будет автоматически масштабироваться при разной плотности точек на экране. Чтобы минимизировать эффект ступенчатости, необходимо указывать разные значения радиуса для дисплеев с разным разрешением.
- Имеются также необязательные атрибуты android:centerX и android:centerY, в которых можно задавать относительное (0.0 – 1.0), описывающие сдвиг центральной точки градиента.
gradient_radial.xml
Интересный эффект получается при использовании множества радиальных градиентов.
sweep
Рисует развёрточный градиент с помощью перехода между цветами startColor и endColor вдоль внешнего края фигуры (как правило, кольца).
Можно использовать атрибуты android:centerX и android:centerY.
gradient_sweep.xml
gradient_circle.xml
Попробуйте также такой вариант.
А почему бы не повращать?
Примеры с shape
Закругляем уголки у компонентов
Создадим отдельный файл res/drawable/roundrect.xml и с его помощью скруглим уголки у LinearLayout, ImageView, TextView, EditText:
В разметке активности пишем следующее:
Овальный кабинет
В Белом доме есть Овальный кабинет. Если вам придётся писать приложение для администрации президента США, то все элементы нужно сделать овальными. Создадим файл res/drawable/oval.xml:
Заменим в предыдущем примере android:background=»@drawable/roundrect» на android:background=»@drawable/oval».
Получим овальный интерфейс:
Учебник Android Studio – круглая иконка в приложении
Как сделать круглую иконку в андроид-приложении с помощью библиотеки.
Вам також може сподобатися
Уроки по android разработке на Java 0 1 919
Добро пожаловать в Now in Android, ваше текущее руководство по новинкам и важным событиям
Архитектура андроид-приложений 0 10 396
Продолжая серию уроков о разработке мобильных приложений, мы будем изучать компонент Navigation набора инструментов
Документация по android 2 31 812
Перевод статьи на Медиуме о технологии Broadcast Receivers (широковещательные приемники). Это компоненты андроид, которые
Как убрать скругленные углы у кнопок в Android Studio?
Android Studio по умолчанию делает скругленные края у кнопки. Не могу понять как это скругление убрать.
- Вопрос задан более двух лет назад
- 1269 просмотров
Комментировать
Решения вопроса 0
Ответы на вопрос 1
Вариант скругления углов Button в Android Studio с помощью интерфейса:
Переходим к xml файлу где находится кнопка, нажимаем на кнопку в которой хотим убрать скругление углов, далее справа сверху, в углу переходим во вкладку Desing. Ниже ищем вкладку Common Attributes, затем находим свойство cornerRadius и выставляем интересующее нас значение. К примеру, если мы поставим значение 0dp, мы полностью уберем скругление углов у кнопки, чем выше будет значение, тем больше будет скругление.
Вариант через xml code: Вместо вкладки Design выбираем вкладку Code или Split
После чего, в самом xml файле, создаем или выбираем какой кнопке необходимо убрать скругление. Далее добавляем параметр app:cornerRadius=»0dp»
До: 
После: 
Ответ написан более года назад
Комментировать
Нравится Комментировать