2016-07-11 7 views
1

Я хочу использовать кнопку этой формы, указывая вправо или влево в своем приложении.Как сделать кнопку, указывающую вправо или влево?

Два угла кнопки закруглены, а другая сторона треугольная.

Мне удалось выполнить это несколько, используя png-изображение в качестве фона, но я бы предпочел знать, как это сделать в xml.

enter image description here

+0

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

ответ

1

Не уверен, что точный способ сделать это, но вы всегда можете увеличить radius из topLeft и bottomLeft или справа на максимум, чтобы получить полукруглый указательный конец. Это, как я пытался сделать это

<?xml version="1.0" encoding="utf-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android" 
android:shape="rectangle" > 
<corners 
android:topLeftRadius="100dp" 
android:topRightRadius="31dp" 
android:bottomLeftRadius="100dp" 
android:bottomRightRadius="31dp" 
/> 
<gradient 
android:angle="45" 
android:centerX="35%" 
android:centerColor="#7995A8" 
android:startColor="#E8E8E8" 
android:endColor="#000000" 
android:type="linear" 
/> 
<size 
android:width="172dp" 
android:height="60dp" 
/> 
<stroke 
android:width="3dp" 
android:color="#878787" 
/> 
</shape> 

This is how it looks..

+0

Не совсем то, что я искал. Но теперь можно работать с ним. –

+0

почему вы использовали прокладку ?? – sushildlh

1

Обычная практика состоит в использовании изображений для сложных форм. Если вы пытаетесь контролировать размер приложения, вы можете использовать одно изображение, которое указывает в одном направлении, и повернуть его в drawable xml, чтобы указать другой путь.

Однако, если вы действительно хотите реализовать это в xml, у меня есть треугольник, указывающий влево/вправо ниже. Вы можете попробовать улучшить это в соответствии с вашими требованиями.

правой затирать,

<?xml version="1.0" encoding="utf-8"?> 
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"> 
<item> 
    <rotate 
     android:fromDegrees="45" 
     android:pivotX="0%" 
     android:pivotY="0%" 
     android:toDegrees="0"> 
     <shape android:shape="rectangle"> 

      <solid android:color="@color/colorAccent" /> 
     </shape> 
    </rotate> 
</item> 
</layer-list> 

Right pointing sample image

Левый затирать,

<?xml version="1.0" encoding="utf-8"?> 
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"> 
<item> 
    <rotate 
     android:fromDegrees="-45" 
     android:pivotX="100%" 
     android:pivotY="0%" 
     android:toDegrees="0"> 
     <shape android:shape="rectangle"> 

      <solid android:color="@color/colorAccent" /> 
     </shape> 
    </rotate> 
</item> 
</layer-list> 

Left point sample image

0

Вы можете сделать форму, как этот список с помощью слоя, узнать больше о списке слоев here. Это должно дать вам желаемый результат:

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

    <item> 
     <shape android:shape="rectangle"> 
      <size 
       android:width="100dp" 
       android:height="40dp" /> 
      <solid android:color="#5e88b8" /> 
      <corners android:topRightRadius="3dp" android:bottomRightRadius="3dp" android:radius="0dp"/> 
     </shape> 
    </item> 

    <item 
     android:top="-40dp" 
     android:bottom="65dp" 
     android:left="-30dp"> 
     <rotate 
      android:fromDegrees="-45"> 
      <shape android:shape="rectangle"> 
       <solid android:color="#ffffff" /> 
      </shape> 
     </rotate> 
    </item> 

    <item 
     android:top="65dp" 
     android:bottom="-40dp" 
     android:left="-30dp"> 
     <rotate 
      android:fromDegrees="45"> 
      <shape android:shape="rectangle"> 
       <solid android:color="#ffffff" /> 
      </shape> 
     </rotate> 
    </item> 

</layer-list> 

, а затем установить его в качестве фона кнопки:

<Button 
    android:id="@+id/button" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:background="@drawable/button_background" 
    android:text="button" /> 

ВЫВОД:

Check here

UPDATE

Измените радиус угла, чтобы получить нужный угловой вид.

Смежные вопросы