web-dev-qa-db-fra.com

Android: onglets au bas

J'ai vu des discussions à ce sujet, mais rien de précis. Est-il possible de placer les onglets dans un onglet au bas de l'écran? Si oui, comment?

J'ai essayé ce qui suit, mais cela n'a pas fonctionné: 

a) placer la tabwidget en dessous du framelayout
b) régler la gravité du tabwidget sur "en bas"

Merci! Llappall

androidtabwidget
148
llappall

Voici la solution la plus simple, la plus robuste et la plus évolutive pour obtenir des onglets au bas de l'écran. 

  1. Dans votre LinearLayout vertical, placez le FrameLayout au-dessus du TabWidget.
  2. Définissez layout_height sur wrap_content à la fois sur FrameLayout et sur TabWidget 
  3. Définir le Android:layout_weight="1" de FrameLayout
  4. Définissez le Android:layout_weight="0" de TabWidget (0 par défaut, mais pour des raisons d'emphase, de lisibilité, etc.)
  5. Définissez le Android:layout_marginBottom="-4dp" de TabWidget (pour supprimer le séparateur inférieur)

Code complet:

<?xml version="1.0" encoding="utf-8"?>
<TabHost xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:id="@Android:id/tabhost"
    Android:layout_width="fill_parent"
    Android:layout_height="fill_parent">

    <LinearLayout
        Android:orientation="vertical"
        Android:layout_width="fill_parent"
        Android:layout_height="fill_parent"
        Android:padding="5dp">

        <FrameLayout
            Android:id="@Android:id/tabcontent"
            Android:layout_width="fill_parent"
            Android:layout_height="wrap_content"
            Android:padding="5dp"
            Android:layout_weight="1"/>

        <TabWidget
            Android:id="@Android:id/tabs"
            Android:layout_width="fill_parent"
            Android:layout_height="wrap_content"
            Android:layout_weight="0"
            Android:layout_marginBottom="-4dp"/>

    </LinearLayout>

</TabHost>
271
stormin986

Essayez-le;) Il suffit de regarder le contenu de FrameLayout (@ id/tabcontent), car je ne sais pas comment il va gérer le défilement ... Dans mon cas, cela fonctionne parce que j'ai utilisé ListView comme contenu. de mes onglets. :)J'espère que ça aide.

<?xml version="1.0" encoding="utf-8"?>
<TabHost xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:id="@Android:id/tabhost"
    Android:layout_width="fill_parent"
    Android:layout_height="fill_parent">
    <RelativeLayout 
        Android:layout_width="fill_parent" 
        Android:layout_height="fill_parent">
        <FrameLayout Android:id="@Android:id/tabcontent"
             Android:layout_width="fill_parent" 
             Android:layout_height="fill_parent"
             Android:layout_alignParentTop="true" 
             Android:layout_above="@Android:id/tabs" />
    <TabWidget Android:id="@Android:id/tabs"
             Android:layout_width="fill_parent" 
             Android:layout_height="wrap_content"
             Android:layout_alignParentBottom="true" />
    </RelativeLayout>
</TabHost>
38
Leaudro

Il existe un moyen de supprimer la ligne.

1) Suivez ce tutoriel: Android-tabs-with-fragments

2) Appliquez ensuite la modification RelativeLayout proposée par Leaudro ci-dessus (appliquez les accessoires de présentation à toutes les FrameLayouts).

Vous pouvez également ajouter un ImageView au fichier tab.xml dans l'élément n ° 1 et obtenir un look très similaire à celui de l'iPhone dans les onglets.

Voici une capture d'écran de ce sur quoi je travaille en ce moment. Il me reste encore du travail à faire, notamment créer un sélecteur d'icônes et assurer une distribution horizontale égale, mais vous avez l'idée… .. Dans mon cas, j'utilise des fragments, mais les mêmes principes doivent s'appliquer à un onglet standard. vue.

enter image description here

12
Brill Pappin
<?xml version="1.0" encoding="utf-8"?>
<TabHost xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:id="@Android:id/tabhost"
    Android:layout_width="fill_parent"
    Android:layout_height="fill_parent" >

    <LinearLayout
        Android:layout_width="fill_parent"
        Android:layout_height="fill_parent"
        Android:orientation="vertical" >

        <FrameLayout
            Android:id="@Android:id/tabcontent"
            Android:layout_width="fill_parent"
            Android:layout_height="0dip"
            Android:layout_weight="1" />

        <TabWidget
            Android:id="@Android:id/tabs"
            Android:layout_width="fill_parent"
            Android:layout_height="wrap_content"
            Android:layout_weight="0"
            Android:background="#252a31"
            Android:tabStripEnabled="false" >
        </TabWidget>
    </LinearLayout>

</TabHost>
3
Sanjay Mangaroliya

Il existe deux manières d'afficher des onglets au bas d'une activité d'onglets.

  1. Utilisation de la disposition relative 
  2. Utilisation de l'attribut Layout_weight

Veuillez vérifier le lien pour plus de détails .

3
MduSenthil

Pour tous ceux d'entre vous qui tentent de supprimer la ligne de séparation du tabWidget, voici un exemple de projet (et de son tutoriel respectif), idéal pour personnaliser les onglets et ainsi supprimer les problèmes lorsque les onglets sont en bas . Projet Eclipse : Android-custom-tabs ; Explication originale: blog ; J'espère que cela a aidé.

3
Djumaka

Je ne sais pas si cela fonctionnera pour toutes les versions d'Android (en particulier celles avec des éléments d'interface utilisateur personnalisés), mais j'ai pu supprimer la barre grise en bas en ajoutant

 Android:layout_marginBottom="-3dp"

vers le XML TabWidget ...

3
Justin

Ce n'est peut-être pas exactement ce que vous recherchez (ce n'est pas une solution "facile" d'envoyer vos onglets au bas de l'écran), mais c'est néanmoins une solution alternative intéressante que je souhaiterais vous signaler: 

ScrollableTabHost est conçu pour se comporter comme TabHost, mais avec un scrollview supplémentaire pour contenir plus d'éléments ...

peut-être que vous plongerez dans ce projet open-source, vous trouverez une réponse à votre question. Si je vois quelque chose de plus facile, je reviendrai vers vous.

1
Hubert

Oui, voir: link , mais il a utilisé des dispositions xml et non des activités pour créer un nouvel onglet. Mettez donc son code xml (set paddingTop pour FrameLayout - 0px), puis écrivez le code:

public class SomeActivity extends ActivityGroup {

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
  setContentView(R.layout.main);

    TabHost tab_Host = (TabHost) findViewById(R.id.edit_item_tab_Host); 

    tab_Host.setup(this.getLocalActivityManager());

    TabSpec ts1 = tab_Host.newTabSpec("TAB_DATE"); 
    ts1.setIndicator("tab1"); 
    ts1.setContent(new Intent(this, Registration.class)); 
    tab_Host.addTab(ts1); 

    TabSpec ts2 = tab_Host.newTabSpec("TAB_GEO"); 
    ts2.setIndicator("tab2"); 
    ts2.setContent(new Intent(this, Login.class)); 
    tab_Host.addTab(ts2); 

    TabSpec ts3 = tab_Host.newTabSpec("TAB_TEXT"); 
    ts3.setIndicator("tab3"); 
    ts3.setContent(new Intent(this, Registration.class)); 
    tab_Host.addTab(ts3); 

    tab_Host.setCurrentTab(0);      


}

}

1
Pavel

J'avais le même problème avec les onglets Android lorsque j'essayais de les placer en bas de l'écran. Mon scénario était de ne pas utiliser de fichier de présentation et de créer les onglets dans le code. Je cherchais également à déclencher des activités de chaque onglet qui semblaient un peu trop complexes en utilisant d'autres approches. Voici l'exemple de code permettant de résoudre le problème:

ajouter des onglets dans Android et les placer

1
Zeeshan

Je recommande d'utiliser ce code pour un travail stable, optimisé pour les fragments imbriqués dans l'onglet (par exemple, MapFragment imbriqué) et testé sur "ne pas conserver les activités": https://stackoverflow.com/a/23150258/2765497

0
Flinbor