web-dev-qa-db-ger.com

Tab mit neuer Symbolleiste verwenden (AppCompat v7-21)

Ich habe SupportActionBar mit Registerkarten und einem benutzerdefinierten ActionBar-Design (erstellt mit http://jgilfelt.github.io/Android-actionbarstylegenerator/ ) verwendet, das die Registerkarten nur anzeigt, wenn der Benutzer die Suchansicht erweitert.

public boolean onMenuItemActionExpand(MenuItem item) {
        actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
        return true;
    }
}

Ich bin von ActionBar auf Toolbar umgestiegen. Meine App muss API 9 wirklich unterstützen.

Gibt es eine Möglichkeit, diesen Code zu verwenden, um die Registerkarten wieder hinzuzufügen ?:

Toolbar toolbar = (Toolbar) findViewById(R.id.new_actionbar);
setSupportActionBar(toolbar);
getSupportActionBar().setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);

Wie kann ich nach Möglichkeit mein benutzerdefiniertes Design verwenden oder die Symbolleiste formatieren?

In der Dokumentation wird darauf hingewiesen, dass dies veraltet ist, und es wird empfohlen, eine andere Art der Navigation zu verwenden. Aber ich kenne keine anderen Komponenten in Android, die die gleiche Funktionalität haben.

Etwas Hilfe?

70

Mit der API 21 ist die Methode setNavigationMode(ActionBar.NAVIGATION_MODE_TABS)veraltet .

UPDATE 01/08/2019 (Android Material Components)

Mit der stabilen Version von Android Material Components im November 2018) hat Google die Materialkomponenten vom Namespace Android.support.design Auf com.google.Android.material Verschoben.
Material Component Library ist ein Ersatz für die Design Support Library von Android.

Fügen Sie die Abhängigkeit zu Ihrem build.gradle Hinzu:

dependencies { implementation ‘com.google.Android.material:material:1.0.0’ }

Dann können Sie das neue TabLayout verwenden.

<androidx.constraintlayout.widget.ConstraintLayout>

     <com.google.Android.material.appbar.AppBarLayout   ...>

        <androidx.appcompat.widget.Toolbar  .../>


        <com.google.Android.material.tabs.TabLayout
         ...
         />

     </com.google.Android.material.appbar.AppBarLayout>

     <androidx.viewpager.widget.ViewPager 
        Android:id="@+id/viewpager"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />

</androidx.constraintlayout.widget.ConstraintLayout>

Der Code ist einfach:

TabLayout tabs = (TabLayout) findViewById(R.id.tabs);
tabs.setupWithViewPager(pager);

UPDATE 29/05/2015 (Support Library)

Mit der neuen Design Support Library können Sie jetzt das neue TabLayout verwenden.

Fügen Sie diese Abhängigkeit einfach zu Ihrem build.gradle

compile 'com.Android.support:design:22.2.0'

Der Code ist sehr einfach:

TabLayout tabLayout = (TabLayout) findViewById(R.id.tabs);
        tabLayout.setupWithViewPager(viewPager);

Um viele der Funktionen von Materialentwürfen zu implementieren, sollten Sie sie in einem CoordinatorLayout und einem AppBarLayout verwenden.

Etwas wie das:

 <Android.support.design.widget.CoordinatorLayout
         xmlns:Android="http://schemas.Android.com/apk/res/Android"
         xmlns:app="http://schemas.Android.com/apk/res-auto"
         Android:layout_width="match_parent"
         Android:layout_height="match_parent">


     <Android.support.design.widget.AppBarLayout
             Android:layout_height="wrap_content"
             Android:layout_width="match_parent">

         <Android.support.v7.widget.Toolbar
                 ...
                 app:layout_scrollFlags="scroll|enterAlways"/>

         <Android.support.design.widget.TabLayout
                 ...
                 app:layout_scrollFlags="scroll|enterAlways"/>

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

     <Android.support.v4.view.ViewPager
        Android:id="@+id/viewpager"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />

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

[~ # ~] alt [~ # ~]

Sie können ein anderes Muster verwenden. Zum Beispiel können Sie dasselbe Beispiel verwenden, das Sie in googleio14 sehen können.

Es wird ein SlidingTabLayout verwendet, das mit einem ViewPager zusammenarbeitet.

Hier finden Sie das Beispiel (es ist in Ihrem SDK-Beispiel)

Hier finden Sie das Google io14 Beispiel:

157

Obwohl es wahrscheinlich etwas spät ist, diese Frage jetzt zu beantworten, wurde mir klar, dass ich eine Antwort auf eine ähnliche Frage schrieb, das sowohl die Verwendung der Design Support Library als auch vor Google I/O abdeckt.

Ich habe die wesentlichen Teile unten aufgenommen:


Die Verwendung eines TabLayout mit dem Toolbar ist seit der Ankündigung der Android Design Support Library viel einfacher geworden, sodass wir keine benutzerdefinierten Ansichtsklassen mehr herunterladen müssen.

Aus dem Blogspot-Beitrag der Android-Entwickler in der Android Design Support Library :

Tabs :

Das Wechseln zwischen verschiedenen Ansichten in Ihrer App über Registerkarten ist kein neues Konzept für das Materialdesign. Sie sind auch als Navigationsmuster der obersten Ebene oder zum Organisieren verschiedener Inhaltsgruppierungen zu Hause innerhalb Ihrer App (sagen wir, verschiedene Musikrichtungen).

Das TabLayout ​​der Entwurfsbibliothek implementiert sowohl feste Registerkarten, bei denen die Breite der Ansicht gleichmäßig auf alle Registerkarten aufgeteilt ist, als auch scrollbare Registerkarten, bei denen die Registerkarten keine einheitliche Größe haben und horizontal gescrollt werden können. Tabulatoren können programmgesteuert hinzugefügt werden:

TabLayout tabLayout = ...;
tabLayout.addTab(tabLayout.newTab().setText("Tab 1"));

Wenn Sie jedoch ViewPager für horizontales Blättern zwischen Registerkarten verwenden, können Sie Registerkarten direkt aus PagerAdapter s getPageTitle () und anschließend erstellen Verbinden Sie die beiden mit setupWithViewPager(). Dadurch wird sichergestellt, dass Registerauswahlereignisse den ViewPager aktualisieren und Seitenänderungen das ausgewählte Register aktualisieren.


Wenn Sie die Design Support-Bibliothek nicht verwenden, müssen Sie stattdessen die folgenden Schritte ausführen:

1. Laden Sie die Dateien SlidingTabLayout.Java und SlidingTabStrip.Java herunter von Googles I/O Conference App auf GitHub. Dies wären die Ansichten, die im Registerkartenlayout verwendet werden würden. Daher habe ich mit meinen anderen Java) - Aktivitäten namens 'view' einen Ordner erstellt und dort abgelegt.

2. Bearbeiten Sie Ihr Layout mit dem SlidingTabLayout:

<LinearLayout
    Android:orientation="vertical"
    ... >

    <!-- This is the Toolbar with the tabs underneath -->
    <LinearLayout
        Android:orientation="vertical"
        ... >

        <include Android:id="@+id/my_toolbar" layout="@layout/toolbar" />

        <com.mycompany.myapp.SlidingTabLayout
            Android:id="@+id/sliding_tabs"
            Android:background="?attr/colorPrimary"
            Android:layout_width="match_parent"
            Android:layout_height="wrap_content" />
    </LinearLayout>

    <!-- This is the ViewPager (which you already should have if you have
        used tabs before) -->
    <Android.support.v4.view.ViewPager
        Android:id="@+id/view_pager"
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content" />

    ...

</LinearLayout>

Die Zeile, die auf den Toolbar (<include Android:id="@+id/detail_toolbar" layout="@layout/toolbar" />) Verweist, verweist auf eine andere XML-Datei, die ich zum Erstellen des Toolbar. verwendet habe

3. Ändern Sie die Paketnamen in SlidingTabLayout.Java Und SlidingTabStrip.Java Entsprechend der Position, an der sie platziert wurden. In meinem Fall habe ich für beide Dateien Folgendes verwendet: package com.mycompany.myapp.view;. Organisieren Sie die Importe und fügen Sie die erforderlichen hinzu, wie in der von Ihnen verwendeten IDE) angegeben.

4. Richten Sie in Ihrem Activity (das AppCompatActivity erweitert hat) das Toolbar im ein onCreate Methode:

Toolbar toolbar = (Toolbar) findViewById(R.id.detail_toolbar);
setSupportActionBar(toolbar);

5. Richten Sie die Teile ViewPager und SlidingTabLayout ein:

mViewPager = (ViewPager) findViewById(R.id.view_pager);
mViewPager.setAdapter(new ViewPagerAdapter(getSupportFragmentManager()));
mSlidingTabLayout = (SlidingTabLayout) findViewById(R.id.sliding_tabs);
mSlidingTabLayout.setSelectedIndicatorColors(getResources().getColor(R.color.tab_line));   
mSlidingTabLayout.setDistributeEvenly(true);
mSlidingTabLayout.setViewPager(mViewPager);

Die Farbe 'tab_line' War eine Farbe, die ich in color.xml Deklariert hatte und die die Farbe der Tabulatorzeile sein würde. Beachten Sie auch, dass die obigen Variablen global waren, die ich zuvor in dieser Aktivität definiert habe:

SlidingTabLayout mSlidingTabLayout;
ViewPager mViewPager;

6. Zum Schluss richten Sie das ViewPagerAdapter ein, das ich zuvor aufgerufen hatte. Dies ist verantwortlich für das Ändern der Seite in Abhängigkeit davon, welche Registerkarte ausgewählt wurde. Ich habe folgenden Code verwendet:

public class ViewPagerAdapter extends FragmentPagerAdapter {

    public ViewPagerAdapter(FragmentManager fm) {
        super(fm);
    }

    @Override
    public int getCount() {
        // Returns the number of tabs
        return 3;
    }

    @Override
    public Fragment getItem(int position) {
        // Returns a new instance of the fragment
        switch (position) {
            case 0:
                return new FragmentOne();
            case 1:
                return new FragmentTwo();
            case 2:
                return new FragmentThree();
        }
        return null;
    }

    @Override
    public CharSequence getPageTitle(int position) {
        Locale l = Locale.getDefault();
        switch (position) {
            case 0:
                return getString(R.string.title_section1).toUpperCase(l);
            case 1:
                return getString(R.string.title_section2).toUpperCase(l);
            case 2:
                return getString(R.string.title_section3).toUpperCase(l);
        }
        return null;
    }
}

Wie oben erwähnt, finden Sie weitere Details zu diesen Lösungen unter eine weitere Frage, die ich zur Verwendung von Schiebereglern mit der Symbolleiste beantwortet habe .

14