クリックしたときにAndroidのボタンの色を変更するにはどうすればよいですか？

82

私はAndroidアプリケーションに取り組んでいます。画面下部に4つのボタンを水平に配置したい。これらの4つのボタンでは、2つのボタンに画像が表示されています。ボタンの境界線は黒色で、境界線はできるだけ薄くする必要があります。ボタンをクリックすると、境界線の色を変更せずにボタンの背景を青色に変更し、しばらくの間その色のままにしておく必要があります。Androidでこのシナリオを実現するにはどうすればよいですか？

android 
— Android_programmer_camera
ソース
可能性のある重複したボタン上のベクトル描画可能なパスの色を変更する方法をクリックしてください あなたがここに私の答えを確認することができ、私は重複したとして、それをフラグが付けられ：stackoverflow.com/a/55205149/3763032
— mochadwi

回答:

129

1つのアプローチはdrawable、whatever.xmlと呼ばれる次のようなXMLファイルを作成することです。

<?xml version="1.0" encoding="utf-8"?> 
  <selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:state_focused="true"
        android:state_pressed="true"
        android:drawable="@drawable/bgalt" />

    <item
        android:state_focused="false"
        android:state_pressed="true"
        android:drawable="@drawable/bgalt" />

    <item android:drawable="@drawable/bgnorm" />
</selector>

bgaltとbgnormはドローアブルのPNG画像です。

アクティビティでプログラムでボタンを作成する場合は、次の方法で背景を設定できます。

final Button b = new Button (MyClass.this);
b.setBackgroundDrawable(getResources().getDrawable(R.drawable.whatever));

XMLを使用してボタンのスタイルを設定する場合は、次のようにします。

<Button
  android:id="@+id/mybutton"
  android:background="@drawable/watever" />

そして最後にチュートリアルへのリンク。お役に立てれば。

— 方法
ソース
16
画像の使用を避けたい場合は、XMLファイル内のこれらのドローアブルを色の定義に置き換えることもできます。
— haseman 2010年
7
@ jshin47試行錯誤の壮大な量。私は今Android開発について2冊の本を書いています：
— haseman 2012年
@ haseman-これら2冊の本のリンクを投稿するか、brk0018 @ gmail.comで私に共有してください。それらを通り抜けて、よりよく学ぶことをうれしく思います
— Ramakishna Balla 2014
1
画像ではなく色だけの場合はどうなりますか？
— カラJ
@KalaJは解決策を見つけましたか？
— Prafulla Kumar Sahu 2016年
75

このコードを「bg_button.xml」とともにdrawableフォルダーに保存し、xmlのボタンの背景として「@ drawable / bg_button」を呼び出します。

<?xml version="1.0" encoding="UTF-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true" >
        <shape>
            <solid
                android:color="#004F81" />
            <stroke
                android:width="1dp"
                android:color="#222222" />
            <corners
                android:radius="7dp" />
            <padding
                android:left="10dp"
                android:top="10dp"
                android:right="10dp"
                android:bottom="10dp" />
        </shape>
    </item>
    <item>
        <shape>
            <gradient
                android:startColor="#89cbee"
                android:endColor="#004F81"
                android:angle="270" />
            <stroke
                android:width="1dp"
                android:color="#4aa5d4" />
            <corners
                android:radius="7dp" />
            <padding
                android:left="10dp"
                android:top="10dp"
                android:right="10dp"
                android:bottom="10dp" />
        </shape>
    </item>
</selector>
— Faakhir
ソース
2
ありがとうございます。スタイルを使用すると、アプリケーションのサイズを小さくできます。ドローアブルを使用しないことをお勧めします
— Rahul Mandaliya 2014
一方、xmlベクターベースのドローアブルは通常、特に古いデバイスでは、画像よりもパフォーマンスが劣ります。時期尚早に最適化しないでください。ただし、それも念頭に置いてください。
— Przemyslaw Jablonski
10

これを試して

    final Button button = (Button) findViewById(R.id.button_id);
    button.setOnTouchListener(new View.OnTouchListener() {

        @Override
        public boolean onTouch(View view, MotionEvent event) {
            if(event.getAction() == MotionEvent.ACTION_UP) {
                button.setBackgroundColor(Color.RED);
            } else if(event.getAction() == MotionEvent.ACTION_DOWN) {
                button.setBackgroundColor(Color.BLUE);
            }
            return false;
        }

    });
— ワックスレン
ソース
9

これを参照してください、

boolean check = false;
Button backward_img;
Button backward_img1;
backward_img = (Button) findViewById(R.id.bars_footer_backward);
backward_img1 = (Button) findViewById(R.id.bars_footer_backward1);
backward_img.setOnClickListener(new OnClickListener() {

    @Override
    public void onClick(View arg0) {
        check = true;
        backward_img.setBackgroundColor(Color.BLUE);
    }
});

if (check == true) {
    backward_img1.setBackgroundColor(Color.RED);
    backward_img.setBackgroundColor(Color.BLUE);
}
— シャンカルガネーシュPMP
ソース
2
これにより、BGが永続的に設定されます。つまり、ユーザーが[戻る]ボタンをクリックすると、背景が赤になります。
— methode 2010年
@methode：わかりました、古い回答を修正した新しい回答を参照してください
— Sankar Ganesh PMP
8 
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- default -->
    <item
        android:state_pressed="false"
        android:state_focused="false">
        <shape
            android:innerRadiusRatio="1"
            android:shape="rectangle" >
            <solid android:color="#00a3e2" />

            <padding
                android:bottom="10dp"
                android:left="10dp"
                android:right="10dp"
                android:top="10dp" />

        </shape>
    </item>

    <!-- button focused -->
    <item
        android:state_pressed="false"
        android:state_focused="true">
        <shape
            android:innerRadiusRatio="1"
            android:shape="rectangle" >
            <solid android:color="#5a97f5" />

            <padding
                android:bottom="5dp"
                android:left="10dp"
                android:right="10dp"
                android:top="5dp" />
        </shape></item>

    <!-- button pressed -->
    <item
        android:state_pressed="true"
        android:state_focused="false">
        <shape
            android:innerRadiusRatio="1"
            android:shape="rectangle" >
            <solid android:color="#478df9"/>
            <padding
                android:bottom="10dp"
                android:left="10dp"
                android:right="10dp"
                android:top="10dp" />
        </shape></item>
</selector>
— سیدرسولمیرعظیمی
ソース
6

ボタンが押されたときの背景画像またはボタンの色を変更する場合は、このコードをコピーして、プロジェクトの以下に説明する正確な場所に貼り付けてください。

      <!-- Create new xml file like mybtn_layout.xml file in drawable -->
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" android:drawable="@drawable/pressed" /> <!--pressed --> 
<item android:drawable="@drawable/normal" /> <!-- Normal -->
</selector>
  <!-- Now this file should be in a drawable folder and use this 
  single line code in    button code to get all the properties of this xml file -->

    <Button
      android:id="@+id/street_btn"
      android:layout_width="wrap_content"
      android:background="@drawable/layout_a" > <!-- your required code -->
    </Button>
— ピルファヒムシャー
ソース
4

これを試して......

まず、button_pressed.xmlという名前のxmlファイルを作成します。これらはその内容です。

<?xml version="1.0" encoding="utf-8"?>
<selector
  xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_focused="true" 
          android:state_pressed="false" 
          android:drawable="@drawable/icon_1" />
    <item android:state_focused="true" 
          android:state_pressed="true"
          android:drawable="@drawable/icon_1_press" />
    <item android:state_focused="false" 
          android:state_pressed="true"
            android:drawable="@drawable/icon_1_press" />
    <item android:drawable="@drawable/icon_1" />
</selector>

いいえ、ボタンでこれを試してください。

int imgID = getResources().getIdentifier("button_pressed", "drawable", getApplication().getPackageName());
button.setImageResource(imgID);

button_pressed.xmlはdrawableフォルダーにある必要があります。icon_1_pressとicon_1は、ボタンを押して通常フォーカスするための2つの画像です。

— ジェームズ
ソース
2

1-ボタンの形状を1つ作成し、ドローアブルと新しいドローアブルリソースファイルを右クリックします。ルート要素を形状に変更し、形状を作成します。

ここに画像の説明を入力してください

2-形状から1つのコピーを作成し、名前を変更して単色を変更します。 ここに画像の説明を入力してください

3-ドローアブルおよび新しいドローアブルリソースファイルを右クリックして、ルート要素をセレクターに設定します。

ファイルに移動して「state_pressed」を設定します

<selector xmlns:android="http://schemas.android.com/apk/res/android">

<item android:state_pressed="true"android:drawable="@drawable/YourShape1"/>
<item android:state_pressed="false" android:drawable="@drawable/YourShape2"/>

</selector>

4-最後にxmlレイアウトに移動し、ボタンの背景を「セレクター」に設定します

（私の英語が弱いのでごめんなさい）

— Mj.talebi
ソース
1

私はこのコードを使用しています（波及効果あり）：

<ripple xmlns:android="http://schemas.android.com/apk/res/android" android:color="@color/color_gray">
<item android:id="@android:id/mask">
    <color android:color="@color/color_gray" />
</item></ripple>
— user3524157
ソース
1

このコードを試して問題を解決できます

<?xml version="1.0" encoding="utf-8"?> 
<selector xmlns:android="http://schemas.android.com/apk/res/android">
  <item android:state_pressed="true"
   android:drawable="@drawable/login_selected" /> <!-- pressed -->
  <item android:state_focused="true"
   android:drawable="@drawable/login_mouse_over" /> <!-- focused -->
  <item android:drawable="@drawable/login" /> <!-- default -->
</selector>

ドローアブルにこのコードを記述して新しいリソースを作成し、必要な名前を付けてから、Androidのimage srcを参照するのと同じように、ボタンにこのdrwableの名前を記述します。

— ムダサールカーン
ソース
1
こんにちは@lmo私は質問でいくつかの説明をしました。
— ムダサールカーン2018
1 
public void onPressed(Button button, int drawable) {
            if (!isPressed) {
                button.setBackgroundResource(R.drawable.bg_circle);
                isPressed = true;
            } else {
                button.setBackgroundResource(drawable);
                isPressed = false;
            }
        }


    @Override
    public void onClick(View v) {

        switch (v.getId()) {
            case R.id.circle1:
                onPressed(circle1, R.drawable.bg_circle_gradient);
                break;
            case R.id.circle2:
                onPressed(circle2, R.drawable.bg_circle2_gradient);
                break;
            case R.id.circle3:
                onPressed(circle3, R.drawable.bg_circle_gradient3);
                break;
            case R.id.circle4:
                onPressed(circle4, R.drawable.bg_circle4_gradient);
                break;
            case R.id.circle5:
                onPressed(circle5, R.drawable.bg_circle5_gradient);
                break;
            case R.id.circle6:
                onPressed(circle6, R.drawable.bg_circle_gradient);
                break;
            case R.id.circle7:
                onPressed(circle7, R.drawable.bg_circle4_gradient);
                break;

        }

これを試してみてください。このコードでは、ボタンをクリックしてボタンの背景を変更しようとすると、問題なく動作します。

— Abhishek Rana
ソース
0

ボタンを他の色のままにしておきたい期間を適切に処理するには、このバージョンをお勧めします。

button.setOnTouchListener(new View.OnTouchListener() {
            @Override
            public boolean onTouch(View v, MotionEvent event) {
                switch(event.getAction()) {
                    case MotionEvent.ACTION_DOWN:
                        button.setBackground(getResources().getDrawable(R.drawable.on_click_drawable));
                        break;
                    case MotionEvent.ACTION_UP:
                        new java.util.Timer().schedule(
                                new java.util.TimerTask() {
                                    @Override
                                    public void run() {
                                        ((Activity) (getContext())).runOnUiThread(new Runnable() {
                                            @Override
                                            public void run() {
                                                button.setBackground(getResources().getDrawable(R.drawable.not_clicked_drawable));
                                            }
                                        });
                                    }
                                }, BUTTON_CLICK_TIME_AFTER_RELEASE_ANIMATION);
                        break;
                    default:
                }
                return false;
            }
        });

BUTTON_CLICK_TIME_AFTER_RELEASE_ANIMATIONは、[ms]時間後にボタンが前の状態にリセットされることを示します（ただし、達成したいことによっては、ブール値を使用して、ボタンが間に使用されなかったことを確認することもできます...） 。

— ニコラス・ツィンマーマン
ソース
0

上記のコメントのいくつかを使用しても、これは必要なはずの解決に時間がかかりました。うまくいけば、この例は他の誰かを助けるでしょう。

ドローアブルディレクトリにradio_button.xmlを作成します。

    <?xml version="1.0" encoding="utf-8"?>

<!-- An element which allows two drawable items to be listed.-->
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="true" android:drawable="@drawable/radio_button_checked" /> <!--pressed -->
    <item android:drawable="@drawable/radio_button_unchecked" /> <!-- Normal -->
</selector>

次に、フラグメントのxmlは次のようになります。

<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools">

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">
<RadioGroup
android:layout_width="match_parent"
android:layout_height="match_parent">

<RadioButton

    android:id="@+id/radioButton1"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginLeft="10dp"
    android:layout_weight="1"
    android:button="@drawable/radio_button"
    android:paddingLeft="10dp" />        
<RadioButton
    android:id="@+id/radioButton2"
    android:layout_marginLeft="10dp"
    android:paddingLeft="10dp"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_weight="1"
    android:button="@drawable/radio_button" />

</RadioGroup>
    </LinearLayout>
</layout>
— iCyber​​Paul
ソース
-1

hai最も簡単な方法はこれです：

このコードをmainactivity.javaに追加します

public void start(View view) {

  stop.setBackgroundResource(R.color.red);
 start.setBackgroundResource(R.color.yellow);
}

public void stop(View view) {
stop.setBackgroundResource(R.color.yellow);
start.setBackgroundResource(R.color.red);
}

そしてあなたの活動のメインで

    <button android:id="@+id/start" android:layout_height="wrap_content" android:layout_width="wrap_content" android:onclick="start" android:text="Click">

</button><button android:id="@+id/stop" android:layout_height="wrap_content" android:layout_width="wrap_content" android:onclick="stop" android:text="Click">

またはこのチュートリアルに従ってください

— ドンドンドン
ソース
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.