2011-05-19 148 views
306

我想做一個button回合的角落。有沒有一種簡單的方法可以在Android中實現這一點?如何使一個按鈕的角落圓?

+8

蘇尼爾:哥們,這是一個誠實的問題。我也搜索了很多自己,想出一個合理的答案 - 這並不簡單。我期待Android SDK在Button對象本身提供這個屬性... – 2011-11-21 18:25:06

+2

看看這個:http://nishantvnair.wordpress.com/2010/11/09/customize-button-in-android/ – Lavanya 2011-05-19 06:19:24

+0

檢查這個out http://www.gadgetsaint.com/tips/rounded-corners-views-layouts-android/#.WPz2QVN97BI – ASP 2017-04-23 18:50:07

回答

501

如果你想是這樣的

Button preview

這裏是代碼。

1,創建像mybutton.xml您繪製文件夾中的XML文件,並粘貼以下標記:

<?xml version="1.0" encoding="utf-8"?> 
<selector xmlns:android="http://schemas.android.com/apk/res/android" > 
<item android:state_pressed="true" > 
    <shape android:shape="rectangle" > 
     <corners android:radius="3dip" /> 
     <stroke android:width="1dip" android:color="#5e7974" /> 
     <gradient android:angle="-90" android:startColor="#345953" android:endColor="#689a92" />    
    </shape> 
</item> 
<item android:state_focused="true"> 
    <shape android:shape="rectangle" > 
     <corners android:radius="3dip" /> 
     <stroke android:width="1dip" android:color="#5e7974" /> 
     <solid android:color="#58857e"/>  
    </shape> 
</item> 
<item > 
    <shape android:shape="rectangle" > 
     <corners android:radius="3dip" /> 
     <stroke android:width="1dip" android:color="#5e7974" /> 
     <gradient android:angle="-90" android:startColor="#8dbab3" android:endColor="#58857e" />    
    </shape> 
</item> 
</selector> 

2.Now使用此繪製你的視圖的背景。如果該視圖按鈕,然後是這樣的:

<Button 
    android:id="@+id/button1" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:padding="10dp" 
    android:textColor="#ffffff" 
    android:background="@drawable/mybutton" 
    android:text="Buttons" /> 
+0

它崩潰:原因:org.xmlpull.v1.XmlPullParserException:二進制XML文件行#24:標記需要'drawable'屬性或子標記定義可繪製的 – Zennichimaro 2014-07-03 07:50:12

+2

我們可以通過編程來實現。 – Killer 2015-07-24 15:00:17

+0

它說元素選擇器必須聲明編輯:對不起,該文件是在值文件夾而不是drawable。當我轉移它時,它工作。 – 2016-11-17 07:51:26

4

如果您使用的是矢量繪圖,那麼您只需在您的可繪製定義中指定<角落>元素。我已經在blog post中報道過這個問題。

如果您使用位圖/ 9-補丁drawables,則需要在位圖圖像中創建具有透明度的邊角。

274

像下面

<?xml version="1.0" encoding="utf-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android" 
    android:shape="rectangle" android:padding="10dp"> 
    <!-- you can use any color you want I used here gray color--> 
    <solid android:color="#ABABAB"/> 
    <corners android:radius="10dp"/> 
</shape> 

應用以此爲背景按鈕創建繪製文件夾中的XML文件,你想要做的角落一輪。

或者你可以使用不同的半徑每一個角落,像下面

android:bottomRightRadius="10dp" 
android:bottomLeftRadius="10dp" 
android:topLeftRadius="10dp" 
android:topRightRadius="10dp" 
+45

你可以縮短角落到android:radius =「10dp」,這將適用於所有 – 2012-06-30 19:01:34

+20

這是不是一個完整的解決方案,因爲它不支持各種按鈕狀態(按下,關注,默認)。爲了更好的解決方案,請參閱http://stackoverflow.com/questions/9334618/roundedbutton-android – JosephL 2013-03-21 21:10:15

+3

@BenSimpson,你會看到,當你只放一條線而不是定義每一個角落半徑單獨。 – 2013-05-29 05:27:25

19

在繪製文件夾

創建shape.xml像shape.xml

<?xml version="1.0" encoding="utf-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android" > 
    <stroke android:width="2dp" 
    android:color="#FFFFFF"/> 
    <gradient 
    android:angle="225" 
    android:startColor="#DD2ECCFA" 
    android:endColor="#DD000000"/> 
<corners 
    android:bottomLeftRadius="7dp" 
    android:bottomRightRadius="7dp" 
    android:topLeftRadius="7dp" 
    android:topRightRadius="7dp" /> 
</shape> 

和myactivity.xml

可以使用

<Button 
    android:id="@+id/btn_Shap" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:text="@string/Shape" 
    android:background="@drawable/shape"/> 
8

我發現的簡單方法是在可繪製文件夾中創建一個新的xml文件,然後將按鈕背景指向該xml文件。繼承人的代碼我使用:

<?xml version="1.0" encoding="utf-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> 

<solid android:color="#ff8100"/> 
<corners android:radius="5dp"/> 

</shape> 
+0

要在自定義可繪製背景中恢復材質主題漣漪效果,請在按鈕視圖中添加'android:foreground =「?attr/selectableItemBackground」''。請參閱https://stackoverflow.com/questions/38327188/android-setting-background-color-of-button-loses-ripple-effect – 2018-02-13 17:58:12

10

創建可繪製文件夾rounded_btn.xml文件...

<?xml version="1.0" encoding="utf-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android"> 
    <solid android:color="@color/#FFFFFF"/>  

    <stroke android:width="1dp" 
     android:color="@color/#000000" 
     /> 

    <padding android:left="1dp" 
     android:top="1dp" 
     android:right="1dp" 
     android:bottom="1dp" 
     /> 

    <corners android:bottomRightRadius="5dip" android:bottomLeftRadius="5dip" 
     android:topLeftRadius="5dip" android:topRightRadius="5dip"/> 
    </shape> 

,並使用this.xml文件作爲按鈕的背景

<Button 
android:id="@+id/btn" 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:background="@drawable/rounded_btn" 
android:text="Test" /> 
2

風格的按鈕帶圖標 enter image description here

<Button 
     android:id="@+id/buttonVisaProgress" 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:layout_gravity="center_horizontal" 
     android:layout_marginTop="5dp" 
     android:background="@drawable/shape" 
     android:onClick="visaProgress" 
     android:drawableTop="@drawable/ic_1468863158_double_loop" 
     android:padding="10dp" 
     android:text="Visa Progress" 
     android:textColor="@android:color/white" /> 

形狀。XML

<?xml version="1.0" encoding="utf-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android" 
android:shape="rectangle"> 
<corners android:radius="14dp" /> 
<gradient 
    android:angle="45" 
    android:centerColor="#1FA8D1" 
    android:centerX="35%" 
    android:endColor="#060d96" 
    android:startColor="#0e7e1d" 
    android:type="linear" /> 
<padding 
    android:bottom="0dp" 
    android:left="0dp" 
    android:right="0dp" 
    android:top="0dp" /> 
<size 
    android:width="270dp" 
    android:height="60dp" /> 
<stroke 
    android:width="3dp" 
    android:color="#000000" /> 

2

創建文件myButton.xml

<?xml version="1.0" encoding="utf-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android"> 
    <solid android:color="@color/colorButton"/> 
    <corners android:radius="10dp"/> 
</shape> 

添加到您的按鈕

<Button 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:background">@drawable/myButton 
     /> 
4

此鏈接有你需要的所有信息。 Here

Shape.xml

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

    <solid android:color="#EAEAEA"/> 

    <corners android:bottomLeftRadius="8dip" 
       android:topRightRadius="8dip" 
       android:topLeftRadius="1dip" 
       android:bottomRightRadius="1dip" 
       /> 
</shape> 

和main.xml中

<?xml version="1.0" encoding="UTF-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
       android:orientation="vertical" 
       android:layout_width="fill_parent" 
       android:layout_height="fill_parent"> 

    <TextView android:layout_width="fill_parent" 
       android:layout_height="wrap_content" 
       android:text="Hello Android from NetBeans"/> 

    <Button android:id="@+id/button" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:text="Nishant Nair" 
      android:padding="5dip" 
      android:layout_gravity="center" 
      android:background="@drawable/button_shape" 
      /> 
</LinearLayout> 

這應該給你你想要的結果。

祝你好運

9

這很簡單。創建一個如下所示的XML文件。將其設置爲按鈕的背景。如果需要更多按鈕的曲線,請將radius屬性更改爲您的願望。

button_background.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android" 
    android:shape="rectangle"> 
    <solid android:color="@color/primary" /> 
    <corners android:radius="5dp" /> 
</shape> 

設置背景您的按鈕:

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