Android imageview change tint to simulate button click

Question

У меня есть изображение, на котором я установил растровое изображение, извлеченное из URL-адреса. В представлении изображения я установил onClickListener, который открывает диалог.

Я хочу как-то изменить оттенок (сделайте его темнее), когда изображение будет нажато, чтобы обеспечить своего рода щелчок на кнопке, как будто чувствуете.

Что вы предлагаете?

Answer 1

Мне нужно будет проверить это, но вы должны установить xml с этим поведением в качестве ImageView drawable, а затем установить растровое изображение в качестве фона ImageView.

Answer 2

Один из способов - использовать комбинацию ColorFilter и ColorStateList, которая будет содержать цвет оттенка при нажатии кнопки. XML для ColorStateList в каталоге Рез/цвета будет выглядеть следующим образом:

button_pressed.xml

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

    <item android:state_pressed="true" android:color="@color/pressed_color"/> 
    <item android:color="#00000000"/> 

</selector> 

где @color/pressed_color ваш оттенок цвета (который должен быть частично прозрачным). Затем в вашем подклассе ImageView вы применяете цвет, переопределяя drawableStateChanged().

@Override 
protected void drawableStateChanged() { 
    super.drawableStateChanged(); 

    ColorStateList list = getResources().getColorStateList(R.color.button_pressed); 
    int color = list.getColorForState(getDrawableState(), Color.TRANSPARENT); 
    setColorFilter(color); 
    invalidate(); 
} 

В любое время, когда состояние кнопки изменяется, этот код вызывается и автоматически устанавливает оттенок соответствующим образом.

Answer 3

Для меня простое решение работает, используя SetAlpha (180) в OnClick случае сделать изображение темнее, давая пользователю обратную связь, что была нажата или прикасался.

final ImageView myImage = (ImageView) findViewById(R.id.ivDocument); 
myImage.setImage...(... your image ...); // load your ImageView 
myImage.setClickable(true); 
myImage.setFocusable(true); 
myImage.setOnClickListener(new OnClickListener() { 
    @Override 
    public void onClick(View v) { 
     myImage.setAlpha(180); 
     doWhateverYouWantHere(v); 
    } 
}); 

Что касается вашего XML-макета, ничего особенного.

Answer 4

ответ happydude - самый элегантный способ справиться с этим, но, к сожалению, (как указано в комментариях) исходный код для ImageView принимает только целое (сплошной цвет). Issue 18220 была вокруг в течение нескольких лет, посвященных этому, я отправил обходной путь, что там я буду обобщать здесь:

Продлить ImageView и завернуть drawableStateChanged() с кодом, который устанавливает оттенок на основе нового государства:

TintableImageView.java

package com.example.widgets; 

import android.content.Context; 
import android.content.res.ColorStateList; 
import android.content.res.TypedArray; 
import android.util.AttributeSet; 
import android.support.v7.widget.AppCompatImageView; 

import com.example.R; 

public class TintableImageView extends AppCompatImageView { 

    private ColorStateList tint; 

    public TintableImageView(Context context) { 
     super(context); 
    } 

    public TintableImageView(Context context, AttributeSet attrs) { 
     super(context, attrs); 
     init(context, attrs, 0); 
    } 

    public TintableImageView(Context context, AttributeSet attrs, int defStyle) { 
     super(context, attrs, defStyle); 
     init(context, attrs, defStyle); 
    } 

    private void init(Context context, AttributeSet attrs, int defStyle) { 
     TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.TintableImageView, defStyle, 0); 
     tint = a.getColorStateList(R.styleable.TintableImageView_tintColorStateList); 
     a.recycle(); 
    } 

    @Override 
    protected void drawableStateChanged() { 
     super.drawableStateChanged(); 
     if (tint != null && tint.isStateful()) 
      updateTintColor(); 
    }  

    private void updateTintColor() { 
     int color = tint.getColorForState(getDrawableState(), 0); 
     setColorFilter(color); 
    } 

} 

Определение пользовательского атрибута:

attrs.xml

<?xml version="1.0" encoding="UTF-8"?> 
<resources> 

    <declare-styleable name="TintableImageView"> 
     <attr name="tintColorStateList" format="reference|color" /> 
    </declare-styleable> 

</resources> 

Используйте виджет и пользовательский атрибут с местным пространством имен вместо андроида:

example_layout.XML

<?xml version="1.0" encoding="UTF-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:orientation="horizontal"> 

    <com.example.widgets.TintableImageView 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:src="@drawable/example" 
     android:clickable="true" 
     app:tintColorStateList="@color/color_selector"/> 

</LinearLayout> 

Вы можете использовать селектор цвета, как happydude предложил:

color_selector.xml

<?xml version="1.0" encoding="utf-8"?> 
<selector xmlns:android="http://schemas.android.com/apk/res/android"> 
    <item android:state_pressed="true" android:color="@color/pressed_color"/> 
    <item android:color="#00000000"/> 
</selector> 

Answer 5

Этот фрагмент кода работает для меня:

porterDuffColorFilter = newPorterDuffColorFilter(getResources().getColor(R.color.cardview_dark_background),PorterDuff.Mode.MULTIPLY); 

imgView.getDrawable().setColorFilter(porterDuffColorFilter); 
imgView.setBackgroundColor(Color.TRANSPARENT);