android - Android ボタンのボーダー シャドウ

Question

ボタン ビューの Shadow プロパティは、テキストに影を付けます。ボタンの右と下の境界線に影を付けるにはどうすればよいですか?以下に示すように:

Answer 1

あなたはそれを試すことができます。私は自分のプロジェクトでそれを使用します。Button の右と下の境界線に影を付けます。

ボタン xml

<Button
      android:id="@+id/buttonSignIn"
      android:layout_width="fill_parent"
      android:layout_height="50dp"
      android:background="@drawable/button_dropshadow"
      android:textColor="000000"
      android:text="Sign In" />

ドローアブル ファイルに button_dropshadow.xml を追加します。

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
    <layer-list>
        <item android:left="5dp" android:top="5dp">
            <shape>
                <corners android:radius="3dp" />
                <solid android:color="#000000" />
            </shape>
        </item>
        <item android:bottom="2dp" android:right="2dp">
            <shape>
                <gradient android:angle="270" 
                    android:endColor="#ffffff" android:startColor="#ffffff" />
                <stroke android:width="1dp" android:color="#000000" />
                <corners android:radius="4dp" />
                <padding android:bottom="10dp" android:left="10dp" 
                    android:right="10dp" android:top="10dp" />
            </shape>
        </item>
    </layer-list>
</item>

</selector>

ありがとうございました。

Answer 2

セレクターを使用して独自のボタン 9 パッチ イメージを作成してみてください。

btn_normal.9.png :

btn_pressed.9.png :

btn_focused.9.png :

btn_selector.xml :

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_selected="true" android:drawable="@drawable/btn_focused" />
    <item android:state_focused="true" android:drawable="@drawable/btn_focused" />
    <item android:state_pressed="true" android:drawable="@drawable/btn_pressed" />
    <item android:drawable="@drawable/btn_normal" />
</selector>

android:background="@drawable/btn_selector"ボタンの属性を追加します。

Answer 3

私のボタンの背景はこのように設定されています

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
    <gradient
     android:startColor="@android:color/holo_green_dark"
     android:endColor="@android:color/holo_green_light"
     android:angle="90">
   </gradient>
     <stroke
     android:width="1px"
     android:color="@android:color/darker_gray" />
</shape>

影の効果は、元のボタンの形状の下に 2 番目の形状を追加し、その色を黒または灰色の暗い色に変更することで実行できます。ただし、影はボタンと同じ形にする必要があります。

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

     <solid android:color="@android:color/darker_gray"/>

 </shape>

異なるアイテムを重ねるには、「レイヤー リスト」リソースを使用し、以前の形状を含める必要があります。影が最初に表示され、次に元のボタンがいくらか変位して表示されます。この例では、ボタンの下部に 4px のオフセットで影を作成しています。

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
   <item android:drawable="@drawable/shadow"/>
   <item
     android:drawable="@drawable/button"
     android:bottom="4px" 
     android:right="4px"
     />  
 </layer-list>

ボタンの背景をレイヤリスト ドローアブルとして設定します。これは部分的にそれを行う必要があります。

Answer 4

これは、私が見つけて役立つ可能性のあるブロブ投稿です。RelativeLayout でのみ機能します。ボタンと同じサイズの View コンポーネントを作成し、すぐ下に配置します。

<Button
    android:id="+@id\my_button"
    android:layout_below="@id/some_layout_item"
    android:layout_width="100dp"
    android:layout_height="5dp"
    >
</Button>
<View
    android:layout_below="@id/my_button"
    android:layout_width="100dp"
    android:layout_height="5dp"
    android:background="@drawable/drop_shadow"
    >
</View>

影をドローアブル (drop_shadow.xml) として作成します。

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android=”http://schemas.android.com/apk/res/android”&gt;    
    <gradient
        android:startColor="@color/cream_dark"
        android:endColor="@color/cream"
        android:angle="270"
        >
    </gradient>
</shape>