web-dev-qa-db-fra.com

Supprimer la ligne de sélection sous l'onglet en cours pour un TabLayout

J'utilise un TabLayout avec 3 onglets. J'ai personnalisé l'affichage de mes onglets et, par conséquent, je dois supprimer la ligne suivante sous mes onglets (la capture d'écran ne provient pas de mon application):

 enter image description here

Je suis NOT en utilisant un TabHost ou un TabWidget et, par conséquent, je ne peux pas utiliser setStripEnabled(false). La définition de l'arrière-plan sur transparent ne change rien non plus.

Voici mon xml:

<Android.support.design.widget.AppBarLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
    xmlns:app="http://schemas.Android.com/apk/res-auto"
    Android:orientation="vertical" Android:padding="4dip"
    Android:layout_above="@+id/bottomcontent3"
    Android:gravity="center_horizontal"
    Android:background="@Android:color/white"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent">

    <Android.support.design.widget.TabLayout
        Android:id="@+id/comtabs"
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content"
        Android:layout_margin="5dp"
        app:tabPaddingStart="0dp"
        app:tabPaddingEnd="0dp"
        app:tabMode="fixed"
        app:tabGravity="fill"
        Android:background="@Android:color/white" />

    <Android.support.v4.view.ViewPager xmlns:Android="http://schemas.Android.com/apk/res/Android"
        Android:id="@+id/compager"
        Android:layout_width="match_parent"
        Android:layout_height="match_parent">
    </Android.support.v4.view.ViewPager>

</Android.support.design.widget.AppBarLayout>

Toutes les réponses que j'ai trouvées utilisaient TabHost, TabWidget. Dans mon cas, j'utilise une TabLayout et trois Tab. Comment puis-je supprimer cette ligne dans ce cas? Merci beaucoup.

EDIT Certaines méthodes de TabLayout ne peuvent pas être résolues dans mon code pour certaines raisons. Il y a le code Java que j'utilise:

TabLayout tabLayout = (TabLayout) view.findViewById(R.id.comtabs);
        tabLayout.setTabMode(TabLayout.MODE_FIXED);


        // add tabs
        tabLayout.addTab(tabLayout.newTab());
        tabLayout.addTab(tabLayout.newTab());
        tabLayout.addTab(tabLayout.newTab());

        RelativeLayout layout1 = (RelativeLayout) inflater.inflate(R.layout.communitytablayoutleft, container, false);
        RelativeLayout layout2 = (RelativeLayout) inflater.inflate(R.layout.communitytablayout, container, false);
        RelativeLayout layout3 = (RelativeLayout) inflater.inflate(R.layout.communitytablayoutright, container, false);
        tabLayout.setTabGravity(TabLayout.GRAVITY_FILL);



        ViewPager pager = (ViewPager) view.findViewById(R.id.compager);
        CommunityPagerFragment adapter = new CommunityPagerFragment(getChildFragmentManager());

        pager.setAdapter(adapter);
        tabLayout.setupWithViewPager(pager);
        tabLayout.setOnTabSelectedListener(this);


        ((TextView)layout1.findViewById(R.id.tabtext)).setText(tabs[0]);
        ((TextView)layout2.findViewById(R.id.tabtext)).setText(tabs[1]);
        ((TextView)layout3.findViewById(R.id.tabtext)).setText(tabs[2]);



        tabLayout.getTabAt(0).setCustomView(layout1);
        tabLayout.getTabAt(1).setCustomView(layout2);
        tabLayout.getTabAt(2).setCustomView(layout3);
        //tabLayout.set

        return view;

et son importation:

import Android.support.design.widget.TabLayout;
13
Virthuss

Comme suggéré par les deux réponses, la clé était l'attribut tabIndicatorHeight.

Cependant, la méthode de l'API était, pour certaines raisons, impossible à résoudre. Dans ce cas, vous devez résoudre ce problème directement à partir du XML, de cette façon:

        app:tabIndicatorHeight="0dp"

Dans votre mise en page <Android.support.design.widget.TabLayout>.

Par exemple:

<Android.support.design.widget.TabLayout
    Android:id="@+id/comtabs"
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    Android:layout_margin="5dp"
    app:tabIndicatorHeight="0dp"
    app:tabPaddingStart="0dp"
    app:tabPaddingEnd="0dp"
    app:tabMode="fixed"
    app:tabGravity="fill"
    Android:background="@Android:color/white" />
28
Virthuss

Même moi, j'ai fait face au même problème récemment. Je suis tombé sur l'attribut height xml et le changer en 0dp a été efficace.

app:tabIndicatorHeight="0dp"

OU

De même, j'estime que le fait de modifier l'attribut de couleur de l'indicateur pour qu'il soit identique à l'arrière-plan des onglets devrait également le faire. Je n'ai pas testé cette solution mais je pense que cela devrait également fonctionner.

app:tabIndicatorColor="#9cc8df"

La première option est meilleure et cela a fonctionné pour moi.

Aucune de ces solutions ne permet de désactiver l'indicateur, mais de résoudre le problème malgré tout.

6
mysticfyst

Pour TabLayout vous devez utiliser ceci - " tabLayout.setSelectedTabIndicatorColor (Color.TRANSPARENT); "

TabLayout tabLayout = (TabLayout) fragmentView.findViewById(R.id.tabs);
tabLayout.setSelectedTabIndicatorColor(Color.TRANSPARENT);
4
Sachin

Vous pouvez définir la hauteur de l'indicateur de tabulation sur 0 pour la "supprimer", par exemple, utilisez: tabLayout.setSelectedTabIndicatorHeight(0);

3
jomartigcal

Je pense que la meilleure solution consiste à définir l'indicateur de tabulation sur null.

app: tabIndicator = "@ null"

0
rohit