【Android】Buttonのデザインを変更する方法

最近 Android の開発ネタばかりで申し訳ありません…が、今日も性懲りもなく Android について!
今回は、ボタンのデザインを変更する方法です。
デフォルトのデザインって、グレーに角ばった形をしていて、かなり味気ないというか素っ気ないデザインなので、これを変更していきます。

参考にさせていただいたサイトはこちら。

Android UI基本 Buttonをカスタマイズする
http://tech.pjin.jp/blog/2016/02/09/android ui基本-buttonをカスタマイズする/

 

さて、今回のコードで作成できるボタンのデザインは下記の2つです。

まず、ボタンのデザインを指定するxmlファイルを、drawable フォルダ以下に作成します。
左側の、背景色が水色の丸角ボタンのコードはこちら。

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
    <solid android:color="#4cb4fa"/>
    <corners android:radius="8dp"/>
</shape>

ファイル名は、entry_button.xml としています。

右側の、背景色が白色で枠線が水色の丸角ボタンのコードはこちら。

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
    <solid android:color="#FFF"/>
    <corners android:radius="8dp"/>
    <stroke android:color="#4cb4fa" android:width="1dp"/>
</shape>

こちらのファイル名は、entry_button_noactive.xml としました。

で、ボタン自体は下記のように指定します。

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:background="#FFF">
    <Button android:layout_width="0dp"
        android:layout_height="35dp"
        android:layout_weight="1"
        android:text="公開"
        android:textColor="#FFF"
        android:background="@drawable/entry_button"
        android:layout_margin="3dp"/>
    <Button
        android:layout_width="0dp"
        android:layout_height="35dp"
        android:layout_weight="1"
        android:text="下書き"
        android:background="@drawable/entry_button_noactive"
        android:layout_margin="3dp"/>
</LinearLayout>

重要なのは、12、19行目android:background を指定している箇所です。
ここで、先程作成した xmlファイルを指定すると、xmlファイルに記述したデザインがボタンに反映されます。
レイアウトファイルがごちゃごちゃしないので、分かりやすくていいですね。
xmlファイルの記述については、ググれば色々出てくるので、難しくはないはず。

 

以上、ボタンのデザインの変更方法でした。
味気ないデフォルトのデザインや、背景色変えるだけよりも、ぐっとお洒落になるので、Androidアプリを開発している方は是非取り入れてみてはいかがでしょうか。

>株式会社シーポイントラボ

株式会社シーポイントラボ

TEL:053-543-9889
営業時間:9:00~18:00(月〜金)
住所:〒432-8003
   静岡県浜松市中央区和地山3-1-7
   浜松イノベーションキューブ 315
※ご来社の際はインターホンで「316」をお呼びください

CTR IMG