Как сделать форму капсулы в андроиде?
Я хочу сделать кнопку точно так же, как на этом изображении
![Capsule button]()
Я хочу использовать xml файл, который будет использоваться для создания такой кнопки. Может ли кто-нибудь сказать мне, как это сделать?
Ответы
Ответ 1
Наконец, я нашел способ сделать это с помощью xml файла. вот код файла xml, который дал мне кнопку формы капсулы.
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
<corners
android:bottomLeftRadius="30dp"
android:bottomRightRadius="30dp"
android:radius="60dp"
android:topLeftRadius="30dp"
android:topRightRadius="30dp" />
<solid android:color="#CFCFCF" />
<padding
android:bottom="0dp"
android:left="0dp"
android:right="0dp"
android:top="0dp" />
<size
android:height="60dp"
android:width="270dp" />
</shape>
Ответ 2
Я не попробовал все ответы здесь, но я полагаю, что некоторые/все они - работы.
Принятый ответ тоже работает, но его можно упростить. Поскольку я люблю элегантное и простое решение, я придумала собственное решение. По сути, нам просто нужно добавить достаточно большой радиус по сравнению с вашими шириной и высотой View
, чтобы получился круглый angular. В этом случае я положил 1000dp
, чтобы сделать его безопасным. Нам даже не нужно добавлять android:shape="rectangle"
.
Просто выполните следующие 2 простых шага:
Создайте файл XML в вашей папке Drawable. Например, назовите его bg.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<corners android:radius="1000dp"/>
<solid android:color="@color/yourPreferredColor"/>
</shape>
Затем вы можете использовать его в XML файле макета как свойство View
android:background="@drawable/bg"
или прямо в коде view.setBackgroundResource(R.drawable.bg)
Ответ 3
рассмотрите возможность настройки shape
к нему и используйте corners
внутри этой формы:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners android:radius="10dp"/> <!-- increasing the value, increases the rounding. And as TTransmit said, to make it like a capsule make the radius half of your button height -->
<solid android:color="#AAAAAA"/> <!-- the button color -->
</shape>
Итак, сохраните эту форму в вашей папке /drawable
, скажем, она будет сохранена как " button_bg.xml", поэтому при объявлении кнопки в вашем макете xml:
<Button
android:background="@drawable/button_bg"
android:layout_height="20dp"
.
. />
Ответ 4
Вот код для создания кнопки в xml, но если вы хотите создать кнопку в форме капсулы, вам нужно добавить фон
<Button
android:id="@+id/image"
android:layout_width="match_parent"
android:layout_height="wrap_content"
**android:background="@drawable/button_background"**
android:text="@string/image" >
</Button>
создайте button_background.xml в папке с возможностью переноса, напишите следующий код в button_background.xml
<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" android:padding="40dp">
<!-- you can use any color you want I used here gray color-->
<solid android:color="#01A9DB"/>
<corners
android:bottomRightRadius="20dp"
android:bottomLeftRadius="20dp"
android:topLeftRadius="20dp"
android:topRightRadius="20dp"/>
</shape>
Ответ 5
Он называется Chip in Material и может использоваться следующим образом:
<com.google.android.material.chip.Chip
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/hello_world"/>
Более подробную информацию можно найти здесь и здесь.
Чтобы использовать компоненты Material в своем проекте, вы должны добавить соответствующую библиотеку в свой build.gradle:
dependencies {
// ...
implementation 'com.google.android.material:material:1.0.0-beta01'
// ...
}
Подробнее о добавлении материала в ваш проект можно найти здесь.
Кроме того, вы можете использовать последнюю версию библиотеки поддержки дизайна:
<android.support.design.chip.Chip
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:chipText="@string/hello_world"/>
Также вставьте соответствующие библиотеки:
dependencies {
// ...
implementation 'com.android.support:appcompat-v7:28.0.0-alpha1'
implementation 'com.android.support:design:28.0.0-alpha1'
// OR
implementation 'com.android.support:design-chip:28.0.0-alpha1'
// ...
}
Смотрите этот ответ, чтобы узнать больше о последнем подходе.
Ответ 6
Попробуйте ниже, работает с любым размером представления:
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners android:radius="1000dp" />
<solid android:color="@android:color/black" />
</shape>
Ответ 7
Просто используйте MaterialButton
, используя атрибут app:cornerRadius
и свою любимую ширину.
<com.google.android.material.button.MaterialButton
android:layout_width="100dp"
android:layout_height="wrap_content"
app:cornerRadius="18dp"
android:text="BUTTON"
/>
![enter image description here]()