android - studio - Cómo cambio el tinte de un ImageButton en el foco/presione
imagebutton android cambiar imagen (9)
Tengo un ImageButton
en mi aplicación y necesito cambiar el tinte de la imagen cuando se pressed/focused
el botón. Tengo el ImageButton
configurado para obtener su src
de un archivo XML que es el siguiente:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!-- pressed -->
<item
android:state_pressed="true"
android:tint="@color/black"
android:drawable="@drawable/search"
/>
<!-- focused -->
<item
android:state_focused="true"
android:tint="@color/black"
android:drawable="@drawable/search"
/>
<!-- default -->
<item
android:tint="@null"
android:drawable="@drawable/search"
/>
</selector>
Sin embargo, el tinte no se aplica cuando se presiona o se enfoca el ImageButton
, la imagen solo se visualiza de forma normal. El color negro se define como #000000
como siempre. ¿Algunas ideas?
Aquí es cómo hacerlo usando solo xml. En su carpeta dibujable, crea un selector. Por ejemplo: touch_selector.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!-- State when a row is being pressed, but hasn''t yet been activated (finger down) -->
<item android:state_pressed="true" android:color="@color/semi_slate" />
<!-- When the view is "activated". In SINGLE_CHOICE_MODE, it flags the active row
of a ListView -->
<item android:state_activated="true" android:color="@color/semi_slate" />
<!-- Default, "just hangin'' out" state. -->
<item android:color="@android:color/transparent" />
</selector>
En mi vista de Imagen en xml, establecí el atributo android: tint en el dibujo creado anteriormente.
android:tint = "@drawable/touch_selector"
Todo el código se veía así:
<?xml version="1.0" encoding="utf-8"?>
<ImageView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/poster"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:adjustViewBounds="true"
android:scaleType="centerCrop"
android:tint="@drawable/touch_selector" />
Esta es una solución todo xml, para poner tinta en un ImageView en prensa o en activo. Similar se puede hacer para ImageButton
Tenga en cuenta que esto solo funciona para el nivel API> = 21.
Como definió el selector para ser el src de ImageButton Android, AFAIK simplemente tomará el dibujo porque eso es lo que coincide con el tipo de src. Entonces el tinte no se usará.
Sin embargo, tuve un problema similar: también traté de usar un selector como el suyo, pero para el android: valor de tinte del ImageButton en lugar de android: src. Por supuesto, omití los valores de tinte que tienes en tu selector. Esto también resolvería su problema, porque desea usar el mismo dibujo para todos los estados. Curiosamente, obtengo una NumberFormatException cada vez que declaro que el sistema no pudo analizar ''res / color / tint_selector.xml'' (que de hecho es mi selector) como un entero. Para ser específico mi código se ve así:
Este es mi selector, guardado en /res/color/tint_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="#D3D3D3"/> <!-- pressed -->
<item android:color="#ff000000"/> <!-- default -->
</selector>
Y este es el ImageButton correspondiente:
<ImageButton android:id="@+id/program_help"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:src="@drawable/symbol"
android:tint="@color/tint_selector">
</ImageButton>
Tal vez esto te ayude un poco, aunque actualmente no funciona.
Encontré una manera de hacer esto en xml (en api 21 y arriba al menos).
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" >
<bitmap
android:src="@drawable/search"
android:tint="@color/black"
/>
</item>
<item android:drawable="@drawable/search"/>
</selector>
Al configurar el tinte en el mapa de bits, es posible reutilizar el mismo dibujo en xml sin tener que interceptar los toques o la subclase ImageView o ImageButton.
Una vez que se ha creado el selector, simplemente aplique eso como el src de ImageView o ImageButton.
Finalmente, he encontrado una solución para API <21:
Button more = (Button) findViewById(R.id.more);
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
more.getBackground().setColorFilter(color, PorterDuff.Mode.SRC_IN);
} else {
Drawable wrapDrawable = DrawableCompat.wrap(more.getBackground());
DrawableCompat.setTint(wrapDrawable, color));
more.setBackgroundDrawable(DrawableCompat.unwrap(wrapDrawable));
}
¡Esto puede ayudar a alguien a no perder 2 horas!
Lo que estoy haciendo es agregar un botón personalizado que tenga la función setColorFilter.
De esta manera puedo usar el nuevo botón en el xml.
public class CustomButton extends Button {
public CustomButton(Context context) {
super(context);
}
public CustomButton(Context context, AttributeSet attributes) {
super(context, attributes);
};
@Override
public boolean onTouchEvent(MotionEvent event) {
int maskedAction = event.getActionMasked();
if (maskedAction == MotionEvent.ACTION_DOWN)
getBackground().setColorFilter(Color.argb(150, 155, 155, 155), PorterDuff.Mode.DST_IN);
else if (maskedAction == MotionEvent.ACTION_UP)
getBackground().setColorFilter(null);
return super.onTouchEvent(event);
}}
y para ImageButton
public class CustomImageButton extends ImageButton {
public CustomImageButton(Context context) {
super(context);
}
public CustomImageButton(Context context, AttributeSet attrs) {
super(context, attrs);
}
@Override
public boolean onTouchEvent(MotionEvent event) {
int maskedAction = event.getActionMasked();
if (maskedAction == MotionEvent.ACTION_DOWN)
setColorFilter(Color.argb(150, 155, 155, 155), PorterDuff.Mode.DST_IN);
else if (maskedAction == MotionEvent.ACTION_UP)
setColorFilter(null);
return super.onTouchEvent(event);
}}
Noté que hay algunas solicitudes aquí para personas que quieren saber cómo hacer esto en XML. En realidad es bastante simple. Esto se puede lograr usando una layer-list
El botón que se puede dibujar (drawable / some_button.xml):
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" android:drawable="@drawable/some_button_highlighted" />
<item android:drawable="@drawable/some_button_image" />
</selector>
Y este es el dibujable resaltado (dibujable / some_button_highlighted.xml)
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/some_button_image"/>
<item>
<shape>
<solid android:color="@color/highlighted_button_color" />
</shape>
</item>
</layer-list>
Ahora puedes usar esto en cualquier otro xml:
...
android:drawable="@drawable/some_button"
...
Espero que esto ayude a alguien en el futuro.
Puede cambiar el tono, bastante fácilmente en el código a través de:
ImageButton button = (ImageButton) this.findViewById(R.id.button_i_want_to_modify);
button.setColorFilter(Color.argb(255, 255, 255, 255)); // White Tint
Espero eso ayude.
JS
Puede establecer el color (tinte) desde xml.
Establecer transparent
( android:background="@null"
) para el background
luego usar tint
:
<ImageButton
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:tint="@color/Amber_200"
android:background="@null"
android:src="@drawable/back_selector" />
bt.setOnTouchListener(new View.OnTouchListener() {
@Override
public boolean onTouch(View v, MotionEvent event) {
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
bt.setColorFilter(Color.argb(255, 255, 255, 255)); // White Tint
return true; // if you want to handle the touch event
case MotionEvent.ACTION_UP:
bt.clearColorFilter(); // White Tint
return true; // if you want to handle the touch event
}
return false;
}
});