2015-07-23 10 views
13

Ich habe ein CollapsingToolbarLayout-Setup und ich platziere ein Hintergrundbild dort. Ich möchte verhindern können, dass es vollständig kollabiert.Stoppen Sie Scroll auf CollapsingToolbarLayout, damit es nicht vollständig zusammenbricht

Ich habe minheight und viele andere Dinge versucht, kann es aber nicht herausfinden.

Wie kann ich es auf den zweiten Screenshot kollabieren zu stoppen?

Ansicht, wenn die Aktivität geladen

Loaded View

gewünschten Haltepunkt

Desired Stopping point

Aktuelle Haltepunkt

Current Stopping Point

+7

Nur das schöne Layout verdient eine upvote! – Mahm00d

Antwort

8

CollapsingToolbarLayout Arbeiten wirklich eng mit Toolbar und als solche der kollabierten Höhe hängt von der Werkzeugleiste.

Ich war in der Lage, Ihr Problem mit diesem Layout (Hinweis es geht in den normalen CoordinatorLayout/AppBarLayout Setup Mit Fab und ein NestedScrollView oder RecyclerView) zu lösen:

<android.support.design.widget.CollapsingToolbarLayout 
    android:id="@+id/collapsing_toolbar" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:fitsSystemWindows="true" 
    app:layout_scrollFlags="scroll|exitUntilCollapsed" 
    app:statusBarScrim="?attr/colorPrimaryDark" 
    app:contentScrim="@android:color/transparent" 
    app:titleEnabled="false" 
    > 
    <!-- There isnt a contentSCrim attribute so the toolbar is transparent after being 
     collapsed 
     Disabled the title also as you wont be needing it --> 

    <ImageView 
     android:id="@+id/image_v" 
     android:layout_width="match_parent" 
     android:layout_height="360dp" 
     android:layout_gravity="center" 
     android:scaleType="centerCrop" 
     android:src="@drawable/md2" 
     android:fitsSystemWindows="true" 
     app:layout_collapseMode="parallax" 
     tools:ignore="ContentDescription" 
     /> 
     <!-- Normal Imageview. Nothing interesting --> 

    <android.support.v7.widget.Toolbar 
     android:id="@+id/toolbar" 
     android:layout_width="match_parent" 
     android:layout_height="168dp" 
     app:layout_collapseMode="pin" 
     app:popupTheme="@style/ThemeOverlay.AppCompat.Light" 
     /> 
     <!-- The toolbar is styled normally. However we disable the title also in code. 
     Toolbar height is the main component that determines the collapsed height --> 

    <TextView 
     android:text="@string/app_name" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_gravity="bottom" 
     android:background="?attr/colorPrimaryDark" 
     android:paddingLeft="72dp" 
     android:paddingRight="0dp" 
     android:paddingBottom="24dp" 
     android:paddingTop="24dp" 
     android:textColor="@android:color/white" 
     android:textAppearance="@style/TextAppearance.AppCompat.Headline" 
     /> 
     <!-- The title textView --> 

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

Die damit zusammenhängenden Aktivitäten wie folgt aussehen :

... 
    setSupportActionBar((Toolbar) findViewById(R.id.toolbar)); 
    getSupportActionBar().setDisplayHomeAsUpEnabled(true); 

    // Disable toolbar title 
    getSupportActionBar().setDisplayShowTitleEnabled(false); 
    ... 

Hier ist ein Video von der Interaktion

enter image description here

1

Fügen Sie einfach die gewünschte Stopphöhe zu Ihrer Symbolleiste hinzu und setzen Sie app:contentScrim="#00000000" für Ihr CollapsingToolbarLayout.

<android.support.design.widget.CollapsingToolbarLayout 
     android:id="@+id/collapsing_toolbar" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     app:contentScrim="#00000000" 
     app:layout_scrollFlags="scroll|exitUntilCollapsed"> 
     <ImageView 
      android:id="@+id/ImageView" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:src="@drawable/image" 
      app:layout_collapseMode="parallax"/> 

     <android.support.v7.widget.Toolbar 
      android:layout_width="match_parent" 
      android:layout_height="100dp" 
     /> <!-- set desired stop-height as height --> 

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

Das Problem, mit dem ich konfrontiert wurde, ist, dass, sobald die Symbolleistenhöhe geändert wird, die Ausrichtung des von der Toolbar bereitgestellten Titeltextes völlig durcheinander gerät. Ich musste eine benutzerdefinierte Ansicht hinzufügen, die eine Textansicht mit allen Arten von hartcodierten Rändern enthielt, um es richtig zu machen. – JHH

6

Ich habe mit dem gleichen Problem konfrontiert.

Zuerst habe ich nur die Höhe der Toolbar wie in früheren Antworten beschrieben und es funktioniert.

Aber das führte zu einem anderen Problem. Toolbar-Ansicht essen touch-Ereignisse, so dass meine reduzierende Ansicht (die MapView ist) keine Touch-Ereignisse in ihrem Teil von der Symbolleiste überlappen.

Schließlich ist meine Lösung, Toolbar von CollapsingToolbarLayout zu entfernen. In meinem Fall ist es in Ordnung, weil ich es nur verwendet habe, um das Zusammenfallen zu beschränken. und die minimale Höhe kollabiert in onCreateView wie folgt festgelegt:

CollapsingToolbarLayout layoutCollapsing = (CollapsingToolbarLayout) rootView.findViewById(R.id.layoutCollapsing); 
layoutCollapsing.setMinimumHeight(120); 
+1

Schöne Idee!Sie können die Mindesthöhe in der Layoutdatei anstelle des Codes festlegen. –

Verwandte Themen