EditTextのスタイルを変更

Android3.0以降のデフォルトのEditTextのデザインがイマイチだなぁと思うので、
テーマを変更してみることにした。

以下のログインID、パスワードの右側にあるようなスタイルに変更してみた。

f:id:ats337:20140414012555p:plain


どうもEditTextの枠線を設定するパラメータが見当たらなかったので、
layer-listを使い、2つの四角形を重ねてやり、枠線を表現した。

以下のedit_text.xmlファイルをdrawableフォルダに配置する。

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- グレーの四角形を配置 -->
    <item>
        <shape>
            <solid android:color="#c2c2c2"/>
        </shape>
    </item>
    <!-- 白い四角形を上記の四角形に重ねて配置。ただし、2dpだけ内側にずらす -->
    <item
        android:bottom="2dp"
        android:left="2dp"
        android:right="2dp"
        android:top="2dp">
        <shape>
            <solid android:color="#ffffff"/>
        </shape>
    </item>
</layer-list>

次はstyle.xmlファイルに上記の設定を適用する。

<resources>
    <!-- アプリのテーマ -->
    <style name="AppTheme" parent="android:Theme.Holo.Light.DarkActionBar">
        <item name="android:editTextStyle">@style/EditText</item>
    </style>

    <!-- EditTextのスタイル -->
    <style name="EditText" parent="android:Widget.EditText">
        <item name="android:background">@drawable/edit_text</item>
        <item name="android:paddingLeft">8dp</item>
        <item name="android:paddingRight">8dp</item>
    </style>

</resources>

Widget.EditTextを継承したスタイルをEditTextという定義名で作成し、
先ほど定義したedit_textをbackgroundに設定
paddingLeftとpaddingRightは、文字を入力した時に枠に重なってしまうため、若干余白を空けた。

更に、EditTextをアプリのテーマAppThemeのeditTextStyleに定義。

もちろんAppThemeはAndroidManifest.xmlでデフォルトのテーマとして定義している。
これで完了。