Festlegen der Anfangshöhe von CollapsingToolbarLayout

Question

Ich möchte in der CollapsingToolbarLayout auf dem ImageView scrollen können. Also, wie wäre das möglich, und wie man eine Starthöhe dieser Bildansicht einstellt?

Meine ImageView-Höhe ist 280p, zu Beginn der Aktivität möchte ich 200p anzeigen und dann kann ich nach unten scrollen, um den Rest des Bildes zu sehen. Ich habe etwas Ähnliches in der WhatsApp-Anwendung gesehen. Hier

ist ein Link, um zu sehen, was ich will:

Mein Code:

<?xml version="1.0" encoding="utf-8"?> 
<android.support.design.widget.CoordinatorLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:fitsSystemWindows="true" 
    tools:context="com.example.yasser.version6.Profile"> 

<android.support.design.widget.AppBarLayout 
    android:id="@+id/app_bar" 
    android:fitsSystemWindows="true" 
    android:layout_height="@dimen/app_bar_height" 
    android:layout_width="match_parent" 
    android:theme="@style/MyMaterialTheme.AppBarOverlay"> 

    <android.support.design.widget.CollapsingToolbarLayout 
     android:id="@+id/toolbar_layout" 
     android:fitsSystemWindows="true" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent"   
     app:layout_scrollFlags="scroll|exitUntilCollapsed" 
     app:contentScrim="?attr/colorPrimary"> 

     <ImageView 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:scaleType="centerCrop" 
      android:src="@drawable/tof" /> 

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

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

<include 
    android:id="@+id/content" 
    layout="@layout/content_profile" /> 


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

Inhalt Profil Code:

<?xml version="1.0" encoding="utf-8"?> 
<android.support.v4.widget.NestedScrollView 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:tools="http://schemas.android.com/tools" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    app:layout_behavior="@string/appbar_scrolling_view_behavior" 
    xmlns:card_view="http://schemas.android.com/apk/res-auto" 
    tools:showIn="@layout/activity_profile" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    tools:context="com.example.yasser.version6.Profile"> 

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

Answer 1

cheesesquare implementieren Ihre Anfrage

dies ein Layout in cheesesquare ist

<?xml version="1.0" encoding="utf-8"?> 
<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:fitsSystemWindows="true"> 

    <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|exitUntilCollapsed" 
      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> 

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

     <LinearLayout 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:orientation="vertical" 
      android:paddingTop="24dp"> 

      <android.support.v7.widget.CardView 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
       android:layout_margin="@dimen/card_margin"> 

       <LinearLayout 
        style="@style/Widget.CardContent" 
        android:layout_width="match_parent" 
        android:layout_height="wrap_content"> 

        <TextView 
         android:layout_width="match_parent" 
         android:layout_height="wrap_content" 
         android:text="Info" 
         android:textAppearance="@style/TextAppearance.AppCompat.Title" /> 

        <TextView 
         android:layout_width="match_parent" 
         android:layout_height="wrap_content" 
         android:text="@string/cheese_ipsum" /> 

       </LinearLayout> 

      </android.support.v7.widget.CardView> 

      <android.support.v7.widget.CardView 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
       android:layout_marginBottom="@dimen/card_margin" 
       android:layout_marginLeft="@dimen/card_margin" 
       android:layout_marginRight="@dimen/card_margin"> 

       <LinearLayout 
        style="@style/Widget.CardContent" 
        android:layout_width="match_parent" 
        android:layout_height="wrap_content"> 

        <TextView 
         android:layout_width="match_parent" 
         android:layout_height="wrap_content" 
         android:text="Friends" 
         android:textAppearance="@style/TextAppearance.AppCompat.Title" /> 

        <TextView 
         android:layout_width="match_parent" 
         android:layout_height="wrap_content" 
         android:text="@string/cheese_ipsum" /> 

       </LinearLayout> 

      </android.support.v7.widget.CardView> 

      <android.support.v7.widget.CardView 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
       android:layout_marginBottom="@dimen/card_margin" 
       android:layout_marginLeft="@dimen/card_margin" 
       android:layout_marginRight="@dimen/card_margin"> 

       <LinearLayout 
        style="@style/Widget.CardContent" 
        android:layout_width="match_parent" 
        android:layout_height="wrap_content"> 

        <TextView 
         android:layout_width="match_parent" 
         android:layout_height="wrap_content" 
         android:text="Related" 
         android:textAppearance="@style/TextAppearance.AppCompat.Title" /> 

        <TextView 
         android:layout_width="match_parent" 
         android:layout_height="wrap_content" 
         android:text="@string/cheese_ipsum" /> 

       </LinearLayout> 

      </android.support.v7.widget.CardView> 

     </LinearLayout> 

    </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_discuss" 
     android:layout_margin="@dimen/fab_margin" 
     android:clickable="true"/> 

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

Answer 2

Eigentlich hat AppBarLayout spezielle Methode wenden Sie einen solchen Offset an:

final int setAppBarTopBottomOffset(CoordinatorLayout coordinatorLayout, AppBarLayout appBarLayout, int newOffset, int minOffset, int maxOffset) 

Leider hat es Paket-private Zugriffsebene, aber wir können es durch eine solche Zwischenkette aufrufen:

private void setAppBarOffset(int offsetPx){ 
    CoordinatorLayout.LayoutParams params = (CoordinatorLayout.LayoutParams) mAppBarLayout.getLayoutParams(); 
    AppBarLayout.Behavior behavior = (AppBarLayout.Behavior) params.getBehavior(); 
    behavior.onNestedPreScroll(mCoordinatorLayour, mAppBarLayout, null, 0, offsetPx, new int[]{0, 0}); 
} 

Eine Sache, erwähnt zu werden - diese Methode aufgerufen werden sollte, nachdem mAppBarLayout bereits vorbereitet und gemessen . Der richtige Weg ist also, sie über die post-Methode von View aufzurufen.

mCoordinatorLayour = (CoordinatorLayout) findViewById(R.id.root_coordinator); 
mAppBarLayout = (AppBarLayout) findViewById(R.id.app_bar_layout); 

mAppBarLayout.post(new Runnable() { 
    @Override 
    public void run() { 
     int heightPx = findViewById(R.id.iv_header).getHeight(); 
     setAppBarOffset(heightPx/2); 
    } 
}); 

Answer 3

Fügen Sie einfach:

android:fitsSystemWindows="true" 
app:layout_collapseMode="parallax" 

zum Image im CollapsingToolbarLayout.

Sie können mehr here finden.

Answer 4

 <android.support.design.widget.AppBarLayout 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:fitsSystemWindows="true"> 

      <android.support.design.widget.CollapsingToolbarLayout 
       android:id="@+id/collapse_toolbar" 
       android:layout_width="match_parent" 
       android:layout_height="@dimen/_240sdp" 
       android:fitsSystemWindows="true" 
       app:contentScrim="?attr/colorPrimary" 
       app:layout_scrollFlags="scroll|exitUntilCollapsed"> 


       <RelativeLayout 
        android:layout_width="match_parent" 
        android:layout_height="wrap_content" 
        android:fitsSystemWindows="true" 
        android:orientation="vertical" 
        android:scaleType="centerCrop" 
        app:layout_collapseMode="parallax"> 

        <ImageView 
         android:id="@+id/ASD_banner_image" 
         android:layout_width="match_parent" 
         android:layout_height="@dimen/_150sdp" 
         android:scaleType="fitXY" 
         android:src="@drawable/banner1" /> 

        <TextView 
         android:id="@+id/ASD_restaurant_status" 
         android:layout_width="wrap_content" 
         android:layout_height="wrap_content" 
         android:layout_alignParentEnd="true" 
         android:paddingTop="@dimen/_2sdp" 
         android:paddingBottom="@dimen/_2sdp" 
         android:layout_alignParentRight="true" 
         android:layout_marginEnd="@dimen/_20sdp" 
         android:layout_marginRight="@dimen/_20sdp" 
         android:layout_marginTop="@dimen/_5sdp" 
         android:background="@drawable/btn_green_bg" 
         android:gravity="center" 
         android:paddingLeft="@dimen/_5sdp" 
         android:paddingRight="@dimen/_5sdp" 
         android:text="open" 
         android:textColor="@color/clr_white" 
         android:textSize="@dimen/_10sdp" /> 

        <RelativeLayout 
         android:id="@+id/ASD_cardlayout" 
         android:layout_width="match_parent" 
         android:layout_height="@dimen/_100sdp" 
         android:layout_marginLeft="@dimen/_20sdp" 
         android:layout_marginRight="@dimen/_20sdp" 
         android:layout_marginTop="@dimen/_100sdp" 
         android:background="@drawable/btn_bg_white_withour_radius" 
         android:elevation="@dimen/_5sdp" 
         android:orientation="vertical"> 

         <ImageView 
          android:id="@+id/ASD_iconimage" 
          android:layout_width="@dimen/_80sdp" 
          android:layout_height="@dimen/_80sdp" 
          android:layout_marginBottom="@dimen/_10sdp" 
          android:layout_marginLeft="@dimen/_15sdp" 
          android:layout_marginTop="@dimen/_10sdp" 
          android:scaleType="fitXY" 
          android:src="@drawable/ic_splash" /> 

         <TextView 
          android:id="@+id/ASD_shopname" 
          android:layout_width="wrap_content" 
          android:layout_height="wrap_content" 
          android:layout_marginLeft="@dimen/_20sdp" 
          android:layout_marginTop="@dimen/_10sdp" 
          android:layout_toEndOf="@+id/ASD_iconimage" 
          android:layout_toRightOf="@+id/ASD_iconimage" 
          android:text="Shop name" 
          android:textAllCaps="true" 
          android:textColor="@color/clr_block" 
          android:textSize="@dimen/TextSize_14" /> 


         <TextView 
          android:id="@+id/ASD_category" 
          android:layout_width="wrap_content" 
          android:layout_height="wrap_content" 
          android:layout_below="@+id/ASD_shopname" 
          android:layout_marginLeft="@dimen/_20sdp" 
          android:layout_toEndOf="@+id/ASD_iconimage" 
          android:layout_toRightOf="@id/ASD_iconimage" 
          android:text="category" 
          android:textColor="@color/clr_gray" 
          android:textSize="@dimen/TextSize_12" /> 

         <TextView 
          android:id="@+id/ASD_minorder" 
          android:layout_width="wrap_content" 
          android:layout_height="wrap_content" 
          android:layout_below="@+id/ASD_category" 
          android:layout_marginLeft="@dimen/_20sdp" 
          android:layout_toEndOf="@+id/ASD_iconimage" 
          android:layout_toRightOf="@id/ASD_iconimage" 
          android:text="Mins.Order" 
          android:textColor="@color/clr_gray" 
          android:textSize="@dimen/TextSize_12" /> 

         <LinearLayout 
          android:layout_width="match_parent" 
          android:layout_height="match_parent" 
          android:layout_below="@+id/ASD_minorder" 
          android:layout_marginBottom="@dimen/_10sdp" 
          android:layout_marginLeft="@dimen/_20sdp" 
          android:layout_toRightOf="@+id/ASD_iconimage" 
          android:orientation="horizontal"> 

          <ImageView 
           android:layout_width="@dimen/_20sdp" 
           android:layout_height="@dimen/_20sdp" 
           android:layout_marginEnd="@dimen/_5sdp" 
           android:layout_marginRight="@dimen/_5sdp" 
           android:scaleType="fitXY" 
           android:src="@drawable/ic_kd_money" /> 

          <ImageView 
           android:layout_width="@dimen/_20sdp" 
           android:layout_height="@dimen/_20sdp" 
           android:layout_marginEnd="@dimen/_5sdp" 
           android:layout_marginRight="@dimen/_5sdp" 
           android:src="@drawable/ic_knet" /> 

          <ImageView 
           android:layout_width="@dimen/_20sdp" 
           android:layout_height="@dimen/_20sdp" 
           android:layout_marginEnd="@dimen/_5sdp" 
           android:layout_marginRight="@dimen/_5sdp" 
           android:src="@drawable/ic_visa" /> 

          <ImageView 
           android:layout_width="@dimen/_20sdp" 
           android:layout_height="@dimen/_20sdp" 
           android:layout_marginEnd="@dimen/_5sdp" 
           android:layout_marginRight="@dimen/_5sdp" 
           android:src="@drawable/ic_mastercard" /> 
         </LinearLayout> 


        </RelativeLayout> 


        <RatingBar 
         android:id="@+id/AVL_rating" 
         style="?android:attr/ratingBarStyleSmall" 
         android:layout_width="wrap_content" 
         android:layout_height="wrap_content" 
         android:layout_below="@+id/ASD_cardlayout" 
         android:layout_centerHorizontal="true" 
         android:layout_marginTop="@dimen/_10sdp" 
         android:isIndicator="true" 
         android:numStars="5" 
         android:rating="5.0" 
         android:secondaryProgressTint="@color/clr_red" 
         android:stepSize="1.0" /> 

        <TextView 
         android:id="@+id/ASD_rating_count" 
         android:layout_width="wrap_content" 
         android:layout_height="wrap_content" 
         android:layout_alignTop="@+id/AVL_rating" 
         android:layout_marginLeft="@dimen/_10sdp" 
         android:layout_marginStart="@dimen/_10sdp" 
         android:layout_toEndOf="@+id/AVL_rating" 
         android:layout_toRightOf="@+id/AVL_rating" 
         android:text="4000 KD" 
         android:textColor="@color/clr_block" 
         android:textSize="@dimen/TextSize_12" /> 

       </RelativeLayout> 

       <android.support.v7.widget.Toolbar 
        android:id="@+id/toolbar" 
        android:layout_width="match_parent" 
        android:layout_height="1dp" 
        android:background="@android:color/transparent" 
        android:gravity="top" 
        android:minHeight="?attr/actionBarSize" 
        app:layout_collapseMode="pin" /> 


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

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