web-dev-qa-db-ja.com

ボタンの角を丸くする方法は?

私はbuttonラウンドのコーナーを作りたいです。 Androidでこれを達成する簡単な方法はありますか?

394
artist

このようなものが欲しいなら

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.ビューの背景にこのDrawableを使用してください。ビューがボタンの場合、次のようになります。

<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" />

下記のように、描画可能なフォルダにxmlファイルを作成します。

<?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>

角を丸くしたいボタンの背景としてこれを適用します。

または、以下のように角ごとに別々の半径を使用することもできます。

Android:bottomRightRadius="10dp"
Android:bottomLeftRadius="10dp"
Android:topLeftRadius="10dp"
Android:topRightRadius="10dp"
318
Sandip Jadhav

drawableフォルダに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"/>
27
Almostafa

とても簡単です。以下のような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"/>

ファイル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"/>
13
Sky

私が見つけた簡単な方法は、描画可能なフォルダに新しい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>
11
AntonioSanchez

Drawableフォルダに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" />
10
Ravi Makvana

このリンクにはあなたが必要とするすべての情報があります。 ここに

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>

これはあなたにあなたの望ましい結果を与えるはずです。

最高の運

6

アイコン付きスタイルボタン 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" />

shape.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" />
4
A.G.THAMAYS

ベクトルのドロアブルを使用している場合は、ドロアブルの定義に<corners>要素を指定するだけです。これを ブログ記事で取り上げました

あなたがbitmap/9-patch drawableを使っているならば、あなたはビットマップ画像の透明度で角を作成する必要があるでしょう。

4
Mark Allison