Utilisation d'un comportement personnalisé pour créer plusieurs "points d'ancrage" / positions pour CollapsingToolbar

Question

Je suis en train d'avoir un effondrement de la barre d'outils qui est similaire à l'application Google Maps dans la recherche de la page de destination. C'est, il y a trois "points d'ancrage" ou des postes. En lieu et place de la carte, je vais avoir une image.

• Barre d'outils s'est effondré (le contenu est le mode plein écran)

• Position intermédiaire

• Barre d'outils étendue avec seulement un peu de contenu montrant (persistantes en bas de la feuille)

De préférence, l'application doit composant logiciel enfichable entre ces positions.

À compter de maintenant, j'ai de la mise en page basique.

Deux questions principales sont:

• Jetant à l'intérieur de la NestedScrollView ne fonctionne pas correctement. Il s'arrête/côtelettes, même si c'est à l'aide de app:layout_behavior="android.support.design.widget.AppBarLayout$ScrollingViewBehavior". Je crois que c'est un bug AppBarLayout
• Les points d'ancrage décrit ci-dessus ne sont pas mises en œuvre.

C'est ma mise en page:

Notez que app:layout_behavior="@string/appbar_anchor_behavior"> est juste un non modifié sous-classe de la AppBarLayout.Behavior

<android.support.design.widget.CoordinatorLayout 
 xmlns:android="http://schemas.android.com/apk/res/android"
 xmlns:app="http://schemas.android.com/apk/res-auto"
 android:id="@+id/main_content"                                                         
 android:layout_width="match_parent"                                               
 android:layout_height="match_parent"                                                           
 android:background="@color/actions_bar_dark"                                                 
 android:fitsSystemWindows="true">


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

    <android.support.design.widget.CollapsingToolbarLayout
            android:id="@+id/collapsing_toolbar"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:layout_scrollFlags="scroll"
            android:fitsSystemWindows="true">

        <ImageView
                android:id="@+id/item_preview_thumb"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:scaleType="centerCrop"
                android:layout_centerInParent="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>

<android.support.v4.widget.NestedScrollView
        android:id="@+id/contentRecyclerView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">


    <include layout="@layout/item_detail_content"/>


</android.support.v4.widget.NestedScrollView>

<android.support.design.widget.FloatingActionButton
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        app:layout_anchor="@id/appbar"
        app:layout_anchorGravity="bottom|right|end"
        android:src="@drawable/ic_download"
        android:layout_margin="16dp"
        android:clickable="true"/>

Comment puis-je réaliser cela en utilisant une mesure de comportement?

Answer 1

Basé sur ce que vous voulez atteindre, vous pourriez vouloir essayer le SlidingUpPanelLayout (qui peut être trouvé sur Github). Il a tout ce dont vous semblez avoir besoin de:

• Point d'ancrage: afin d'atteindre les ancres vous decribe vous aurez à mettre la umanoAnchorPoint d'attribut (qui est un pourcentage fondé), ou - si vous avez besoin de plus complexe d'ancrage de calcul, par exemple, en fonction de l'ImageView hauteur - utilisation de l' setAnchorPoint méthode.
• Persistant: contrairement à la BottomSheets mentionné ci-dessus, ce modèle est fait pour être persistant. La hauteur du panneau lorsque s'est effondré peut être personnalisé avec l' umanoPanelHeight d'attribut ou avec l' setPanelHeight méthode.
• Parallaxe: pas exactement si la mise en œuvre s'adapte à vos besoins et si vous avez besoin d'elle, mais elle ne avoir des connaissances de base de la parallaxe de soutien.

Vous pouvez trouver plus d'info dans le fichier Readme sur Github qui est lié ci-dessus.

Answer 2

Ce que vous avez mentionné dans la question n'est pas réellement un CollapsingToolbar mais un extensible BottomSheet. Malheureusement, il n'y a rien offert par le sdk android pour que nous puissions les utiliser (bien que l'utilisation de Google dans ses propres applications déjà).

BottomSheet est un Android composant qui présente une vue insignifiants à partir du bas de l'écran. BottomSheet, il peut être utile de remplacement pour les boîtes de dialogue et les menus, mais peut contenir n'importe quelle vue, donc les cas d'utilisation sont sans fin. Ce référentiel comprend les BottomSheet composant lui-même, mais comprend également un ensemble commun de voir les composants présentés dans un bas la feuille. Ces derniers sont situés dans les communes de module.

Sur les autres mains, quelques belles guyz ont eu la gentillesse de développer assez proche des bibliothèques et de les partager sur GitHub pour nous. Ils sont près de la BottomSheet composant que Google utilise.

La correspondance la plus proche de ce que vous voulez est-ce un Flipbard/BottomSheet - Vérifier les images sous "éléments Communs" sur cette page. ( Un point en plus de ce qui a été utilisé dans la production à Flipboard pour un certain temps maintenant, donc il est soigneusement testé.)

C'est un autre minime BottomSheet bibliothèque - soarcn/BottomSheet, mais il permet juste des icônes cliquables. Vous pourriez probablement obtenir le code source et de le personnaliser en fonction de vos besoins. Mais, la première de Flipboard est beaucoup plus étroite correspondance, car il peut contenir n'importe quel type de vue et est plus personnalisable.

Suivez chacune des deux ci-dessus GitHub liens pour voir les échantillons, les instructions d'installation et le code source.

Answer 3

Je ne suis pas un expert, mais jetez un œil à cette implémentation sur Github. Utiliser Android modifié SlidingUpPanel. implémenter Foursquare comme map animation.it pourrait vous aider.