wake-up-neo.com

So implementieren Sie DrawerArrowToggle aus der Android appcompat v7 21 Bibliothek

Nach der Veröffentlichung von Android 5.0) habe ich mich gefragt, wie die animierten Actionbar-Symbole implementiert werden sollen.

Diese Bibliothek hier implementiert es gut für mich, aber da die appcompat v7 Bibliothek es hat, wie kann es implementiert werden?

Die Bibliothek verweist darauf in themes.xml

 <item name="drawerArrowStyle">@style/Widget.AppCompat.DrawerArrowToggle</item>

Unter diesem Stil

 <style name="Base.V7.Theme.AppCompat" parent="Platform.AppCompat">

AKTUALISIEREN

Ich habe dies mit dem DrawerToggle v7 implementiert. Ich kann es jedoch nicht stylen. Bitte helfen Sie

Das Styling dafür habe ich in der v7 styles_base.xml gefunden

<style name="Base.Widget.AppCompat.DrawerArrowToggle" parent="">
    <item name="color">?android:attr/textColorSecondary</item>
    <item name="thickness">2dp</item>
    <item name="barSize">18dp</item>
    <item name="gapBetweenBars">3dp</item>
    <item name="topBottomBarArrowSize">11.31dp</item>
    <item name="middleBarArrowSize">16dp</item>
    <item name="drawableSize">24dp</item>
    <item name="spinBars">true</item>
</style>

Ich habe dies zu meinen Styles hinzugefügt und es hat nicht funktioniert. Auch zu meiner attr.xml hinzugefügt

<declare-styleable name="DrawerArrowToggle">
    <!-- The drawing color for the bars -->
    <attr name="color" format="color"/>
    <!-- Whether bars should rotate or not during transition -->
    <attr name="spinBars" format="boolean"/>
    <!-- The total size of the drawable -->
    <attr name="drawableSize" format="dimension"/>
    <!-- The max gap between the bars when they are parallel to each other -->
    <attr name="gapBetweenBars" format="dimension"/>
    <!-- The size of the top and bottom bars when they merge to the middle bar to form an arrow -->
    <attr name="topBottomBarArrowSize" format="dimension"/>
    <!-- The size of the middle bar when top and bottom bars merge into middle bar to form an arrow -->
    <attr name="middleBarArrowSize" format="dimension"/>
    <!-- The size of the bars when they are parallel to each other -->
    <attr name="barSize" format="dimension"/>
    <!-- The thickness (stroke size) for the bar Paint -->
    <attr name="thickness" format="dimension"/>
</declare-styleable>

Aber stürzt ab und sagt Farbtypfehler, wenn Sie dies tun. Was vermisse ich?

96
Bignadad

Zunächst sollten Sie jetzt wissen, dass Android.support.v4.app.ActionBarDrawerToggle Veraltet ist.

Sie müssen dies durch Android.support.v7.app.ActionBarDrawerToggle Ersetzen.

Hier ist mein Beispiel und ich verwende das neue Toolbar, um das ActionBar zu ersetzen.

MainActivity.Java

public class MainActivity extends ActionBarActivity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    Toolbar mToolbar = (Toolbar) findViewById(R.id.toolbar);
    setSupportActionBar(mToolbar);
    DrawerLayout mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
    ActionBarDrawerToggle mDrawerToggle = new ActionBarDrawerToggle(
        this,  mDrawerLayout, mToolbar,
        R.string.navigation_drawer_open, R.string.navigation_drawer_close
    );
    mDrawerLayout.setDrawerListener(mDrawerToggle);
    getSupportActionBar().setDisplayHomeAsUpEnabled(true);
    getSupportActionBar().setHomeButtonEnabled(true);
    mDrawerToggle.syncState();
}

styles.xml

<style name="AppTheme" parent="Theme.AppCompat.Light">
    <item name="drawerArrowStyle">@style/DrawerArrowStyle</item>
</style>

<style name="DrawerArrowStyle" parent="Widget.AppCompat.DrawerArrowToggle">
    <item name="spinBars">true</item>
    <item name="color">@Android:color/white</item>
</style>

Sie können die Dokumente auf AndroidDocument # DrawerArrowToggle_spinBars lesen

Dieses Attribut ist der Schlüssel zum Implementieren der Animation von Menü zu Pfeil.

public static int DrawerArrowToggle_spinBars

Gibt an, ob sich die Balken während des Übergangs drehen sollen oder nicht
Muss ein boolescher Wert sein, entweder "true" oder "false".

Also setzen Sie dies: <item name="spinBars">true</item>.

Dann kann die Animation präsentiert werden.

Hoffe das kann dir helfen.

242
Yong

Wenn Sie die mitgelieferte Support-Bibliothek verwenden DrawerLayout wie in Erstellen einer Schulung für Navigationsschubladen empfohlen, können Sie die neu hinzugefügte Android.support. v7 . app.ActionBarDrawerToggle (Hinweis: unterscheidet sich von der jetzt veralteten Android.support. v4 . app.ActionBarDrawerToggle ):

zeigt ein Hamburger-Symbol an, wenn die Schublade geschlossen ist, und einen Pfeil, wenn die Schublade geöffnet ist. Beim Öffnen der Schublade wird zwischen diesen beiden Zuständen gewechselt.

Obwohl die Schulung nicht aktualisiert wurde, um die veraltete/neue Klasse zu berücksichtigen, sollten Sie in der Lage sein, fast genau denselben Code zu verwenden - der einzige Unterschied bei der Implementierung ist der Konstruktor.

24
ianhanniballake

Ich habe eine kleine Anwendung mit ähnlichen Funktionen erstellt

Hauptaktivität

public class MyActivity extends ActionBarActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_my);

        DrawerLayout drawerLayout = (DrawerLayout) findViewById(R.id.drawer);
        Android.support.v7.widget.Toolbar toolbar = (Android.support.v7.widget.Toolbar) findViewById(R.id.toolbar);
        ActionBarDrawerToggle actionBarDrawerToggle = new ActionBarDrawerToggle(
                this,
                drawerLayout,
                toolbar,
                R.string.open,
                R.string.close
        )

        {
            public void onDrawerClosed(View view)
            {
                super.onDrawerClosed(view);
                invalidateOptionsMenu();
                syncState();
            }

            public void onDrawerOpened(View drawerView)
            {
                super.onDrawerOpened(drawerView);
                invalidateOptionsMenu();
                syncState();
            }
        };
        drawerLayout.setDrawerListener(actionBarDrawerToggle);

        //Set the custom toolbar
        if (toolbar != null){
            setSupportActionBar(toolbar);
        }

        getSupportActionBar().setDisplayHomeAsUpEnabled(true);

        actionBarDrawerToggle.syncState();
    }
}

Mein XML dieser Aktivität

<Android.support.v4.widget.DrawerLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
    xmlns:tools="http://schemas.Android.com/tools"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    tools:context=".MyActivity"
    Android:id="@+id/drawer"
    >

    <!-- The main content view -->
    <FrameLayout
        Android:id="@+id/content_frame"
        Android:layout_width="match_parent"
        Android:layout_height="match_parent" >
        <include layout="@layout/toolbar_custom"/>
    </FrameLayout>
    <!-- The navigation drawer -->
    <ListView
        Android:layout_marginTop="?attr/actionBarSize"
        Android:id="@+id/left_drawer"
        Android:layout_width="240dp"
        Android:layout_height="match_parent"
        Android:layout_gravity="start"
        Android:choiceMode="singleChoice"
        Android:divider="@Android:color/transparent"
        Android:dividerHeight="0dp"
        Android:background="#457C50"/>


</Android.support.v4.widget.DrawerLayout>

Meine benutzerdefinierte Symbolleiste XML

<?xml version="1.0" encoding="utf-8"?>

<Android.support.v7.widget.Toolbar
    xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    Android:id="@+id/toolbar"
    Android:background="?attr/colorPrimaryDark">
    <TextView Android:text="U titel"
        Android:textAppearance="@Android:style/TextAppearance.Theme"
        Android:textColor="@Android:color/white"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        />
</Android.support.v7.widget.Toolbar>

Mein Themenstil

<resources>
    <style name="AppTheme" parent="Base.Theme.AppCompat"/>

    <style name="AppTheme.Base" parent="Theme.AppCompat">
        <item name="colorPrimary">@color/primary</item>
        <item name="colorPrimaryDark">@color/primaryDarker</item>
        <item name="Android:windowNoTitle">true</item>
        <item name="windowActionBar">false</item>
        <item name="drawerArrowStyle">@style/DrawerArrowStyle</item>
    </style>

    <style name="DrawerArrowStyle" parent="Widget.AppCompat.DrawerArrowToggle">
        <item name="spinBars">true</item>
        <item name="color">@Android:color/white</item>
    </style>

    <color name="primary">#457C50</color>
    <color name="primaryDarker">#580C0C</color>
</resources>

Meine Styles in values-v21

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="AppTheme" parent="AppTheme.Base">
        <item name="Android:windowContentTransitions">true</item>
        <item name="Android:windowAllowEnterTransitionOverlap">true</item>
        <item name="Android:windowAllowReturnTransitionOverlap">true</item>
        <item name="Android:windowSharedElementEnterTransition">@Android:transition/move</item>
        <item name="Android:windowSharedElementExitTransition">@Android:transition/move</item>
    </style>
</resources>
17
tim

Ich möchte den obigen Code ein wenig korrigieren

    public class MainActivity extends ActionBarActivity {
        @Override
        protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        Toolbar mToolbar = (Toolbar) findViewById(R.id.toolbar);
        DrawerLayout mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
        ActionBarDrawerToggle mDrawerToggle = new ActionBarDrawerToggle(
            this,  mDrawerLayout, mToolbar,
            R.string.navigation_drawer_open, R.string.navigation_drawer_close
        );
        mDrawerLayout.setDrawerListener(mDrawerToggle);

        getSupportActionBar().setDisplayHomeAsUpEnabled(true);
        getSupportActionBar().setHomeButtonEnabled(true);
    }

und alle anderen Dinge bleiben gleich ...

Für diejenigen, die Probleme mit der Drawerlayout überlagernden Symbolleiste haben

hinzufügen Android:layout_marginTop="?attr/actionBarSize" zum Hauptlayout des Schubladeninhalts

2
Nitin Misra