-1

【Android】Buttonのデザインを変更する【Java/Kotlin】

上記サイトを参考にボタンの android:background を修正したのですが、ボタンの色が変わらず、なぜかボタンの形が変わりました。

<Button
    android:id="@+id/testButton"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/button_background"★

その後、★をやめ、以下にするとボタンの形は変わらず、色が変わったのですが、ボタンを非活性にした場合もここで指定した色のままとなってしまいます。

android:backgroundTint="@color/black"

標準的なボタンの形のまま、ボタンの状態(非活性、活性、タップ時など)で色を変えるにはどのようにすべきでしょうか?

1 件の回答 1

0

おそらく、原因ではありませんが、

android:layout_width="wrap_content"
android:layout_height="wrap_content"

としないと全体がボタンになってしまいます。
match_parentは親要素(外側)ぴったりになる。
wrap_contentは子要素(内側)ぴったりになる。
というような指定です。


本題

まず、android:backgroundにより設定されるのは背景色ではなく背景リソースであるのが実装失敗の原因かと思います。
簡単に行ってしまえば、ボタンの形も設定しているということです。
以下のようにボタンの形も設定したリソースを設定することで、調整は必要ですがデフォルトの形にすることが可能です。

button_background.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- ボタン非活性時  -->
    <item android:state_enabled="false" android:drawable="@drawable/button_background_enabled" />
    <!-- ボタン押下時 -->
    <item android:state_pressed="true" android:drawable="@drawable/button_background_pressed" />
    <!-- ボタン通常時 -->
    <item android:drawable="@drawable/button_background_default" />
</selector>

button_background_enabled.xml

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

    <!-- ボタンの色 -->
    <solid android:color="@color/red" />

    <!-- 外枠の太さ 今回は太さ0 -->
    <stroke
        android:width="0dp" />

    <!-- 角の丸さをここで調整 -->
    <corners
        android:topLeftRadius="30dp"
        android:topRightRadius="30dp"
        android:bottomRightRadius="30dp"
        android:bottomLeftRadius="30dp" />

</shape>

上記のbuttln_background_enabled.xmlはrectangle(四角形)を背景の形に設定し、円形に切り抜くことで丸角としています。
今回は30dpとしていますが、そこは調整をしてください。(リソースに追加して参照で指定することを推奨します)


backgroundTintについて

また、android:backgroundTintはbackGroundに加算や乗算をして色を変更するための設定です。
そのため、形が変わらないというわけです。
現在の色を利用したまま少し暗くしたい、もしくは半透明にしたいのような場合はこちらを使ったほうが(複数のボタンで使い回せて)便利かもしれません。

1
  • 解決しない場合は、button_background.xmlのコードを乗せていただけるとわかりやすいです。
    – lan
    Commented 1月28日 9:10

この質問に回答するには、ログインする必要があります。

求めていた回答ではありませんか? のタグが付いた他の質問を参照する。