web-dev-qa-db-fra.com

Comment changer les images des onglets dans le TabHost

J'utilise TabHost dans mon application, j'utilise quatre onglets dans mon application et je veux utiliser les différentes images dans TabHost lorsque l'onglet particulier est sélectionné et non sélectionné. Je dois utiliser différentes images pour un onglet particulier chacune.

Lorsque je sélectionne un onglet, l'image est peu lumineuse et lorsque je passe à un autre onglet, cette image lumineuse devient grisée.

J'ai implémenté le TabHost mais je ne sais pas comment changer les images dans le TabHost.

Quelqu'un peut-il m'aider à ce sujet.

Merci, David

androidandroid-tabhostandroid-image
27
David Brown

Si vous souhaitez utiliser différentes images pour les états sélectionnés et non sélectionnés, créez des fichiers XML `` sélecteur '' dans votre dossier drawables pour chaque onglet, par ex. tab1_selector.xml, tab2_selector.xml qui devrait contenir les éléments suivants, remplaçant les références dessinables à vos images pour les états sélectionnés et non sélectionnés. c'est à dire.

    <?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>

Ensuite, en utilisant la méthode .setIndicator comme bharath l'a écrit ci-dessus, vous devez référencer votre nouvelle ressource drawable xml.

43
David Brown

Tout d'abord, vous devez avoir les deux images, car vous voulez passer de l'une à l'autre, vous avez donc besoin des deux images et vous devez la placer sur les trois dossiers dessinables.

Dans mon exemple, je dois des images, une appelée icon1.png et icon2.png.

Après cela, créez un fichier xml dans les dossiers dessinables (le même fichier pour tous les dossiers dessinables). Voici le fichier:

<?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>

Vous pouvez choisir quelle image est celle qui apparaîtra lorsque l'onglet sera sélectionné. Dans ce cas, le icon1 apparaîtra, car nous l'avons déclaré sur la balise où state_selected = true.

Alors maintenant, vous avez les deux images et le fichier xml à l'intérieur des trois dossiers dessinables. D'accord!

Maintenant, dans la classe dans laquelle vous déclarez les onglets, ajoutez cette ligne pour chaque onglet que vous souhaitez ajouter.

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

N'oubliez pas que R.drawable.yourxmlfile correspond au fichier xml que vous avez créé dans les dossiers dessinables.

C'est tout! J'espère que cela vous aidera.

16
rogcg

Pour définir le texte et l'icône, nous devons utiliser la propriété 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));

utilisez ceci pour définir une image séparée pour chaque onglet

10
bharath

Créez un fichier xml de sélecteur tabicon.xml et mettez ce code

<?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>

allez maintenant dans votre TabActivity et mettez ce code

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);
6
Aby Mathew

Dans le tutoriel this TabLayout, différentes images sont utilisées lorsqu'un onglet est sélectionné et non sélectionné.

Fondamentalement, vous devez créer un Statelist drawable. Voici le code pour la même chose sur le site du développeur

<?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>

SetIndicator (CharSequence, Drawable) est également appelé pour définir le texte et l'icône de l'onglet.

2
Primal Pappachan

ces codes montrent comment définir une icône dans l'onglet Hôte et également définir l'intention

  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
2
Gangnaminmo Ako

Vous pouvez utiliser ImageButton c'est mieux car une imageView peut être sélectionnée et non sélectionnée et l'ImageButton peut être sélectionné non sélectionné et pressé et d'autres ....

1
ademar111190

Si vous souhaitez modifier l'image de l'onglet par programme, alors:

ImageView yourImage= (ImageView)mTabHost.getTabWidget().getChildTabViewAt(youtTabPosition).findViewById(Android.R.id.icon);   
yourImage.setImageResource(R.drawable.ic_more_vert_white_24dp);
0
Irfan Shah

@Suchismita, il vaut mieux utiliser TextView au lieu de TabActivity. J'ai rencontré ces problèmes suivants dans la tabulation

  • Je n'ai pas pu démarrer une autre activité dans le même onglet, c'est le problème majeur auquel j'ai été confronté

  • ensuite est la personnalisation de la vue de l'onglet, je ne pouvais pas changer le séparateur dessinable.

  • Et TabActivity est déconseillé dans ICS

Ensuite, en utilisant TextView, j'ai trouvé qu'il est très facile de gérer les événements et le flux d'activité, ici Vous avez un contrôle total sur le comportement de l'application et vous pouvez également personnaliser l'apparence de l'onglet comme vous le souhaitez.

êtes-vous intéressé par la façon de mettre en œuvre?

0
Charan Pai