Android: ボタンをdrawable/xmlで作る

絵画センス０に自分にはフォトショやらイラレやらは操作はできても
まともなボタンを作ることはできないので、
せめて単純な角丸グラデのボタンくらいXMLで作れないかということで。

結果こんなかんじになりました。

メインに配置するボタン

#layout/main.xml
<Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/submitButton"
    style="@style/myButton"
/>

ボタンのスタイル設定

#values/style.xml
<resources>
<style name="myButton" parent="android:Widget.Button">
        <item name="android:textColor">#444444</item>
        <item name="android:layout_margin">10dp</item>
        <item name="android:padding">10dip</item>
        <item name="android:background">@drawable/frame</item>
</style>
</resources>

#drawable
frame.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <stroke android:width="1dp" android:color="#cccccc" />
    <corners android:radius="5dp" />
    <gradient
        android:angle="270"
        android:startColor="#ffffff"
        android:centerColor="#dddddd"
        android:endColor="#eeeeee"
        android:type="linear"
        android:centerX="0.5"
        android:centerY="0.5"
    />
</shape>

これでiphoneっぽいアイコンになります！

デザインができない人用に
こんな感じのXMLのテンプレートみたいなの公開してるとこないのかなぁ。。

Tweet