Cómo cambiar las pestañas Imágenes en el TabHost

Question

Estoy usando el TabHost en mi aplicación, estoy usando cuatro pestañas en mi aplicación y quiero usar las diferentes imágenes en el TabHost cuando la pestaña particular ha sido seleccionada y no seleccionada . Necesito usar diferentes imágenes para cada pestaña en particular.

Cuando selecciono cualquier pestaña, la imagen es poco brillante y cuando cambio a otra pestaña, la imagen brillante se sombreará en gris.

Implementé el TabHost pero no sé cómo cambiar las imágenes en el TabHost.

¿Alguien puede ayudarme en esto.

Gracias, David

Answer 1

Si desea utilizar diferentes imágenes de los estados seleccionados y no seleccionados, a continuación, crear archivos XML 'selector' en su carpeta dibujables para cada ficha, por ejemplo, tab1_selector.xml, tab2_selector.xml que debe contener lo siguiente, reemplazando las referencias dibujables a sus imágenes para estados seleccionados y no seleccionados. es decir,

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

Luego, utilizando el método .setIndicator como bharath escribió mencionado anteriormente, deberá hacer referencia a su nuevo recurso dibujable XML.

Answer 2

Para establecer el texto & icono que tenemos que utilizar la propiedad setIndicator.

tabSpec.setIndicator(Char,Drawable); 
firstTabSpec.setIndicator("First Tab Name", getResources().getDrawable(R.drawable.logo)); 
secondTabSpec.setIndicator("Second Tab Name",getResources().getDrawable(R.drawable.logo)); 

Se utiliza para fijar la imagen separada para cada pestaña

Answer 3

En this Tutorial de TabLayout, se utilizan diferentes imágenes cuando se selecciona y no se selecciona una pestaña.

Básicamente tienes que crear un Statelist dibujable. Aquí está el código para el mismo desde el sitio de desarrolladores

<?xml version="1.0" encoding="utf-8"?> 
<selector xmlns:android="http://schemas.android.com/apk/res/android"> 
    <!-- When selected, use grey --> 
    <item android:drawable="@drawable/ic_tab_artists_grey" 
      android:state_selected="true" /> 
    <!-- When not selected, use white--> 
    <item android:drawable="@drawable/ic_tab_artists_white" /> 
</selector> 

también setIndicator (CharSequence, Disponibles) se llama para establecer el texto y el icono de la pestaña.

Answer 4

Antes que nada debe tener las dos imágenes, porque quiere cambiar de una a otra, por lo que necesita las dos imágenes, y debe colocarla en las tres carpetas dibujables.

En mi ejemplo he de imágenes, uno llamado icon1.png y icon2.png.

Después de eso, cree un archivo xml dentro de las carpetas dibujables (el mismo archivo para todas las carpetas dibujables). Este es el archivo:

<?xml version="1.0" encoding="utf-8"?> 
<selector xmlns:android="http://schemas.android.com/apk/res/android"> 
<!-- When selected, use icon1 --> 
<item android:drawable="@drawable/icon1" 
     android:state_selected="true" /> 
<!-- When not selected, use icon2--> 
<item android:drawable="@drawable/icon2" /> 
</selector> 

Puede elegir qué imagen es la que aparece cuando se selecciona la pestaña. En este caso, aparecerá el icono , porque lo declaramos en la etiqueta donde state_selected = true.

Ahora tiene las dos imágenes y el archivo xml dentro de las tres carpetas dibujables. ¡De acuerdo!

Ahora, en la clase que declara las pestañas, agregue esta línea para cada pestaña que desee agregar.

tabHost.addTab(tabHost 
.newTabSpec("one") 
.setIndicator("The Tab", 
    res.getDrawable(R.drawable.yourxmlfile)) 
.setContent(new Intent(this, YourClass.class))); 

Recuerde que R.drawable.yourxmlfile correponds al archivo XML que ha creado en las carpetas dibujable.

Eso es todo! Espero que esto te ayude.

Answer 5

Usted puede utilizar ImageButton es mejor debido a que un imageView puede ser seleccionado y no seleccionado y el ImageButton no puede ser seleccionado y se presiona y otros ....

Answer 6

este los códigos mostrará cómo configurar un icono en la pestaña host y también establecer la intención

TabHost tabHost = getTabHost(); 

     // Tab for Photos 
     TabSpec photospec = tabHost.newTabSpec("Photos"); 
     // setting Title and Icon for the Tab 
     photospec.setIndicator("", getApplicationContext().getResources().getDrawable(R.drawable.icon_photos_tab)); 
     Intent photosIntent = new Intent(this, PhotosActivity.class); 
     photospec.setContent(photosIntent); 

     // Tab for Songs 
     TabSpec songspec = tabHost.newTabSpec("Songs"); 
     songspec.setIndicator("", getApplicationContext().getResources().getDrawable(R.drawable.icon_songs_tab)); 
     Intent songsIntent = new Intent(this, SongsActivity.class); 
     songspec.setContent(songsIntent); 


     // Tab for Videos 
     TabSpec videospec = tabHost.newTabSpec("Videos"); 
     videospec.setIndicator("", getApplicationContext().getResources().getDrawable(R.drawable.icon_videos_tab)); 
     Intent videosIntent = new Intent(this, VideosActivity.class); 
     videospec.setContent(videosIntent); 

     // Adding all TabSpec to TabHost 
     tabHost.addTab(photospec); // Adding photos tab 
     tabHost.addTab(songspec); // Adding songs tab 
     tabHost.addTab(videospec); // Adding videos tab 

Answer 7

@Suchismita mejor que utilice TextView en lugar de TabActivity. me enfrentaba a estos problemas siguientes en tabactivity

• no podía comenzar otra actividad dentro de la misma pestaña, esto es importante problema que tuvimos

• siguiente es la personalización de vista de ficha, que no podía cambiar dibujable divisor.

• Y TabActivity está en desuso en ICS

Siguiente usando TextView he encontrado que es muy fácil de manejar eventos y flujo de actividad, aquí se tiene un control total sobre el comportamiento de la aplicación y también se puede personalizar la apariencia de la pestaña como quieras

¿Está interesado en cómo implementar?

Answer 8

Crear un archivo de selector de tabicon.xml xml y poner este código

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

Ahora ve a tu TabActivity y poner este código

TabSpec MyTab = tabhost.newTabSpec("MyTab"); 
MyTab.setIndicator("", getResources().getDrawable(R.drawable.tabicon)); 
//note:if you give some text in setIndicator sometimes the icon will not be showed. 
Intent tabIntent = new Intent(this, TabOne.class); 
TWTTab.setContent(tabIntent); 

Answer 9

Si desea cambiar la imagen de la pestaña de programación a continuación:

ImageView yourImage= (ImageView)mTabHost.getTabWidget().getChildTabViewAt(youtTabPosition).findViewById(android.R.id.icon); 
yourImage.setImageResource(R.drawable.ic_more_vert_white_24dp);