Shapeでアクアボタン風リソース
Shapeで作ってみた
前回記事と同様に、こんどは横長のアクアボタン風リソースを作ってみました。
ちょっと違うけど、なんとなくそれっぽいのではないかと思います。
緑のボタンはテキストシャドウを設定しています。
<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item> <layer-list> <item> <shape android:shape="rectangle" > <corners android:radius="100dp" /> <gradient android:endColor="#15000000" android:startColor="#23000000" android:angle="90"/> <padding android:top="3dp" android:bottom="3dp" android:left="3dp" android:right="3dp"/> </shape> </item> <item > <shape android:shape="rectangle" > <corners android:radius="100dp" /> <solid android:color="#00bfff"/> </shape> </item> <item> <shape android:shape="rectangle" > <corners android:radius="100dp" /> <gradient android:startColor="#b7000000" android:endColor="#00ffffff" android:angle="270" /> </shape> </item> <item android:top="3dp" android:left="3dp" android:right="3dp" android:bottom="3dp"> <shape android:shape="rectangle" > <corners android:radius="100dp"/> <gradient android:centerY="0.7" android:startColor="#b0ffffff" android:centerColor="#3b8b8b8b" android:endColor="#d0ffffff" android:angle="90" /> </shape> </item> </layer-list> </item> </selector>
今回も、レイヤーリストでいくつかの画像を重ねています。
Buttonのバックグラウンドとして使うと、
一部が伸びてしまったりしてバランスが変になります。
(ImageViewだと綺麗に表示されるが、テキストも表示したい)
また、Shapeはボカした感じの表現が難しいので、
ふちがくっきりしすぎています。
少しでも雰囲気をプラスするために、
グリーンのボタンには
テキストにシャドウを施してみました。
AQUAなボタン、なんか押したくなりますよね♪