Wie wird die Symbolleiste beim Verwenden der Google Design-Bibliothek in die Ansicht oder in den Bildausschnitt gerissen?

Question

Ich versuche, einen Effekt zu erzielen, wie WhatsApp hat, wo die Symbolleiste (wenn gescrollt wird) in magnethaft, oder außerhalb der Ansicht magnetähnlich einrasten wird.

Was ich habe meine MainActivity XML IM:

• DrawerLayout - Basis-Layout
• CoordinatorLayout - Layout für die AppBar und Toolbar und Tabs
• AppBarLayout - Für Toolbar und Tabs
• Toolbar halten - hat DIESES Flag: app:layout_scrollFlags="scroll|enterAlways"
• SlidingTabLayout - Zeigt die Registerkarten an
• ViewPager - Für Tabs
• RecyclerView - Für coordinatorlayout

jetzt nicht bekommen, mich falsch, es funktioniert, wenn ich die Symbolleiste nach unten scrollen, wird aus dem Blickfeld schob aber sagen, dass ich auf halbem Wege stehen Scrollen, dann nur die Werkzeugleiste sitzt halb versteckt aus der Sicht und die andere Hälfte in Sicht.

Wie kann ich angehen, dieses Problem zu lösen, wie ich will, dass es entweder aus der Sicht oder in Sicht rastet.

Answer 1

Diese Funktion wurde in 23.1.0 Version der Android-Support-Bibliothek hinzugefügt. Von Release Notes:

am Rande von zur AppBarLayout Klasse Hinzufügen des SCROLL_FLAG_SNAP konstant Schnappen Unterstützung. Wenn beim Scrollen die Ansicht nur teilweise sichtbar ist, wird die Ansicht gefangen und scrollt zu ihrer nächsten Kante.

<android.support.design.widget.CoordinatorLayout 
     android:layout_width="match_parent" 
     android:layout_height="match_parent"> 

     <android.support.design.widget.AppBarLayout 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"> 

      <android.support.v7.widget.Toolbar 
        android:id="@+id/toolbar" 
        android:layout_width="match_parent" 
        android:layout_height="wrap_content" 
        app:layout_scrollFlags="scroll|enterAlways|snap" /> 
      ----- 
      ----- 

Für weitere Informationen: http://android-developers.blogspot.in/2015/10/android-support-library-231.html

EDIT: Hinzugefügt End-Zitat zu layout_scrollFlags diese syntaktisch korrekte

in Haupttätigkeit

Answer 2

EDIT: ab der Unterstützung 23.1.0 wird dies nicht mehr benötigt. Siehe this answer stattdessen.

Eine Möglichkeit, dies zu lösen, ist die Anpassung der Behavior an Ihre AppBarLayout.

<android.support.design.widget.AppBarLayout 
    app:layout_behavior="com.myapp.AppBarLayoutSnapBehavior" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content"> 
    ... 

Ihre AppBarLayoutSnapBehavior würde das Standardverhalten von AppBarLayout.Behavior ändern, durch Hinzufügen der Snap-Logik, wenn die Scroll-stoppt. Hoffentlich ist der folgende Code selbsterklärend.

package com.myapp; 

public class AppBarLayoutSnapBehavior extends AppBarLayout.Behavior { 

    private ValueAnimator mAnimator; 
    private boolean mNestedScrollStarted = false; 

    public AppBarLayoutSnapBehavior(Context context, AttributeSet attrs) { 
     super(context, attrs); 
    } 

    @Override 
    public boolean onStartNestedScroll(CoordinatorLayout coordinatorLayout, AppBarLayout child, 
             View directTargetChild, View target, int nestedScrollAxes) { 
     mNestedScrollStarted = super.onStartNestedScroll(coordinatorLayout, child, directTargetChild, target, nestedScrollAxes); 
     if (mNestedScrollStarted && mAnimator != null) { 
      mAnimator.cancel(); 
     } 
     return mNestedScrollStarted; 
    } 

    @Override 
    public void onStopNestedScroll(CoordinatorLayout coordinatorLayout, AppBarLayout child, View target) { 
     super.onStopNestedScroll(coordinatorLayout, child, target); 

     if (!mNestedScrollStarted) { 
      return; 
     } 

     mNestedScrollStarted = false; 

     int scrollRange = child.getTotalScrollRange(); 
     int topOffset = getTopAndBottomOffset(); 

     if (topOffset <= -scrollRange || topOffset >= 0) { 
      // Already fully visible or fully invisible 
      return; 
     } 

     if (topOffset < -(scrollRange/2f)) { 
      // Snap up (to fully invisible) 
      animateOffsetTo(-scrollRange); 
     } else { 
      // Snap down (to fully visible) 
      animateOffsetTo(0); 
     } 
    } 

    private void animateOffsetTo(int offset) { 
     if (mAnimator == null) { 
      mAnimator = new ValueAnimator(); 
      mAnimator.setInterpolator(new DecelerateInterpolator()); 
      mAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() { 
       @Override 
       public void onAnimationUpdate(ValueAnimator animation) { 
        setTopAndBottomOffset((int) animation.getAnimatedValue()); 
       } 
      }); 
     } else { 
      mAnimator.cancel(); 
     } 

     mAnimator.setIntValues(getTopAndBottomOffset(), offset); 
     mAnimator.start(); 
    } 
} 

Die einzige Sache ist, die Scroll-Ansicht (in meinem Fall ein RecyclerView) schnappt mit den Toolbar entlang. Ich mag es eigentlich so, aber ich bin mir nicht sicher, ob du das willst.

Answer 3

ich nur ausgeblendete Aktionsleiste Layout zu machen und setzen Spanne für CollapsingToolbarLayout. es funktioniert für mich.

in Haupttätigkeit

setSupportActionBar(mToolbar); 
    getSupportActionBar().setDisplayHomeAsUpEnabled(true);  
    getSupportActionBar().hide(); 

    CollapsingToolbarLayout collapsingToolbar = 
      (CollapsingToolbarLayout) findViewById(R.id.collapsing_toolbar); 
    collapsingToolbar.setTitle("Name"); 
    loadBackdrop(); 

und

<android.support.design.widget.AppBarLayout 
    android:id="@+id/appbar" 
    android:layout_width="match_parent" 
    android:layout_height="@dimen/detail_backdrop_height" 
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" 
    android:fitsSystemWindows="true"> 

    <android.support.design.widget.CollapsingToolbarLayout 
     android:id="@+id/collapsing_toolbar" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     app:layout_scrollFlags="scroll|snap" 
     android:fitsSystemWindows="true" 
     app:contentScrim="?attr/colorPrimary" 
     app:expandedTitleMarginStart="48dp" 
     app:expandedTitleMarginEnd="64dp"> 

     <ImageView 
      android:id="@+id/backdrop" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:scaleType="centerCrop" 
      android:fitsSystemWindows="true" 
      app:layout_collapseMode="parallax" /> 

     <android.support.v7.widget.Toolbar 
      android:id="@+id/toolbar" 
      android:layout_width="match_parent" 
      android:layout_height="?attr/actionBarSize" 
      app:popupTheme="@style/ThemeOverlay.AppCompat.Light" 
      app:layout_collapseMode="pin" /> 

    </android.support.design.widget.CollapsingToolbarLayout> 

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