2008-08-31 17 views
36

que tienen una actividad que tiene un TabHost que contiene un conjunto de TabSpecs cada uno con una vista de lista que contiene los elementos a mostrar por la lengüeta. Cuando se crea cada TabSpec, configuro un ícono para mostrar en el encabezado de la pestaña.Actualización de Android Tab iconos

Los TabSpecs se crean de esta manera dentro de un método setupTabs() el que los bucles para crear el número apropiado de fichas:

TabSpec ts = mTabs.newTabSpec("tab"); 
ts.setIndicator("TabTitle", iconResource); 

ts.setContent(new TabHost.TabContentFactory(
{ 
    public View createTabContent(String tag) 
    { 
     ... 
    }    
}); 
mTabs.addTab(ts); 

Hay un par de casos en los que quiero ser capaz de cambiar el icono que se muestra en cada pestaña durante la ejecución de mi programa. Actualmente estoy borrando todas las pestañas y llamando de nuevo al código anterior para volver a crearlas.

mTabs.getTabWidget().removeAllViews(); 
mTabs.clearAllTabs(true); 
setupTabs(); 

¿Hay alguna manera de reemplazar el icono que se muestra sin borrar y volver a crear todas las pestañas?

Respuesta

31

La respuesta corta es que no se está perdiendo nada. Android SDK no proporciona un método directo para cambiar el indicador de TabHost después de haber sido creado. El TabSpec solo se utiliza para crear la pestaña, por lo que cambiar el TabSpec después del hecho no tendrá ningún efecto.

Creo que hay una solución, sin embargo. Llame al mTabs.getTabWidget() para obtener un objeto TabWidget. Esto es sólo una subclase de ViewGroup, por lo que se puede llamar getChildCount() y getChildAt() acceder a las pestañas individuales dentro del TabWidget. Cada una de estas pestañas también es una Vista, y en el caso de una pestaña con un indicador gráfico y una etiqueta de texto, es casi seguro que alguna otra ViewGroup (quizás una LinearLayout, pero no importa) que contiene un ImageView y un TextView . Así que con un poco de manipulación del depurador o Log.i, debería poder encontrar una receta para obtener el ImageView y cambiarlo directamente.

La desventaja es que si usted no tiene cuidado, la disposición exacta de los controles dentro de una pestaña podría cambiar y que su aplicación podría romper. Su solución inicial es tal vez más sólida, pero de nuevo puede llevar a otros efectos secundarios no deseados, como parpadeos o problemas de enfoque.

30

sólo para confirmar dominicos respuesta, aquí está su solución en el código (que realmente funciona):

tabHost.setOnTabChangedListener(new OnTabChangeListener() { 
    public void onTabChanged(String tabId) { 
     if (TAB_MAP.equals(tabId)) { 
      ImageView iv = (ImageView) tabHost.getTabWidget().getChildAt(0).findViewById(android.R.id.icon); 
      iv.setImageDrawable(getResources().getDrawable(R.drawable.tab_map_black)); 
      iv = (ImageView) tabHost.getTabWidget().getChildAt(1).findViewById(android.R.id.icon); 
      iv.setImageDrawable(getResources().getDrawable(R.drawable.tab_list_white)); 
     } else if (TAB_LIST.equals(tabId)) { 
      ImageView iv = (ImageView) tabHost.getTabWidget().getChildAt(0).findViewById(android.R.id.icon); 
      iv.setImageDrawable(getResources().getDrawable(R.drawable.tab_map_white)); 
      iv = (ImageView) tabHost.getTabWidget().getChildAt(1).findViewById(android.R.id.icon); 
      iv.setImageDrawable(getResources().getDrawable(R.drawable.tab_list_black)); 
     } 
    } 
}); 

Por supuesto que no es pulido en absoluto y el uso de esos índices directos en getChildAt() no es en absoluto agradable. ..

+0

Menor mejora - utilización: TabWidget.getChildTabViewAt (..) en lugar de getChildAt (...) – tonys

6

Ver mi post con el ejemplo de código con respecto Customized Android Tabs.

Gracias SPCT

+0

¡Genial! Exactamente lo que estaba buscando. ¡Gracias! – Fedor

10

Puede ser que sea un poco tarde, pero es posible que quieras echar un vistazo a este Google Group thread

+0

¡Dulce! Es un poco tarde, pero es bueno saber de todos modos. – lnediger

4

Esto es lo que hice y funciona para mí. He creado esta función en la actividad que se extiende desde TabBarActivity

public void updateTab(int stringID) { 
    ViewGroup identifyView = (ViewGroup)getTabWidget().getChildAt(0); 
    TextView v = (TextView)identifyView.getChildAt(identifyView.getChildCount() - 1); 
    v.setText(stringID); 
} 

Puede modificar esta función para cambiar la imagen en lugar de texto o puede cambiar tanto, también puede modificar esto para conseguir cualquier niño pestaña. Estaba particularmente interesado en modificar el texto de la primera pestaña en tiempo de ejecución.

me llamaron a esta función a partir de la actividad correspondiente utilizando esta llamada

getParent().updateTab(R.string.tab_bar_analyze); 
4

intenta esto:

tabHost.setOnTabChangedListener(new OnTabChangeListener() { 
    public void onTabChanged(String tabId) { 
     if (TAB_MAP.equals(tabId)) { 
      ImageView iv = (ImageView) tabHost.getTabWidget().getChildAt(0).findViewById(android.R.id.icon); 
      iv.setImageDrawable(getResources().getDrawable(R.drawable.tab_map_black)); 
      iv = (ImageView) tabHost.getTabWidget().getChildAt(1).findViewById(android.R.id.icon); 
      iv.setImageDrawable(getResources().getDrawable(R.drawable.tab_list_white)); 
     } else if (TAB_LIST.equals(tabId)) { 
      ImageView iv = (ImageView) tabHost.getTabWidget().getChildAt(0).findViewById(android.R.id.icon); 
      iv.setImageDrawable(getResources().getDrawable(R.drawable.tab_map_white)); 
      iv = (ImageView) tabHost.getTabWidget().getChildAt(1).findViewById(android.R.id.icon); 
      iv.setImageDrawable(getResources().getDrawable(R.drawable.tab_list_black)); 
     } 
    } 
}); 
0

Para 3 pestañas, utilice esto:

<?xml version=“1.0” encoding=“UTF-8”?> 

<RelativeLayout xmlns:android=“http://schemas.android.com/apk/res/android&#8221; 

android:orientation=“vertical” 

android:layout_width=“fill_parent” 

android:layout_height=“fill_parent” 

android:paddingRight=“4px” 

android:paddingLeft=“4px” > 

<!– –> 

<TextView android:id=“@+id/tab1” 

android:layout_width=“70px” 

android:layout_height=“40px” 

android:layout_alignParentLeft=“true” 

android:layout_marginTop=“1px” 

android:layout_marginLeft=“10px” 

android:background=“@drawable/white” /> 


<TextView android:id=“@+id/text_tab1” 

android:layout_width=“wrap_content” 

android:layout_height=“wrap_content” 

android:layout_alignParentLeft=“true” 

android:layout_marginTop=“10px” 

android:layout_marginLeft=“20px” 

android:textStyle=“bold” 

android:textSize=“17px” 

android:textColor=“@color/orange” 

android:text=“Tab1” /> 


<TextView android:id=“@+id/tab2” 

android:layout_width=“70px” 

android:layout_height=“40px” 

android:layout_alignParentLeft=“true” 

android:layout_marginTop=“1px” 

android:layout_marginLeft=“83px” 

android:background=“@drawable/white” /> 


<TextView android:id=“@+id/text_tab2” 

android:layout_width=“wrap_content” 

android:layout_height=“wrap_content” 

android:layout_alignParentLeft=“true” 

android:layout_marginTop=“10px” 

android:layout_marginLeft=“100px” 

android:textStyle=“bold” 

android:textSize=“17px” 

android:textColor=“@color/blue” 

android:text=“Tab2” /> 


<TextView android:id=“@+id/tab3” 

android:layout_width=“70px” 

android:layout_height=“40px” 

android:layout_alignParentLeft=“true” 

android:layout_marginTop=“1px” 

android:layout_marginLeft=“156px” 

android:background=“@drawable/white” /> 


<TextView android:id=“@+id/text_tab3” 

android:layout_width=“wrap_content” 

android:layout_height=“wrap_content” 

android:layout_marginTop=“10px” 

android:layout_marginLeft=“170px” 

android:textStyle=“bold” 

android:textSize=“17px” 

android:textColor=“@color/green” 

android:text=“Tab3” /> 


<LinearLayout xmlns:android=“http://schemas.android.com/apk/res/android&#8221; 

android:id=“@+id/box_1” 

android:layout_width=“fill_parent” 

android:layout_height=“wrap_content” 

android:layout_below=“@+id/tab1” > 


</LinearLayout> 


</RelativeLayout> 
Cuestiones relacionadas