Android 5.0+CollapsingToolbarLayout 사용 설명

Collapsing Toolbar Layout 역할 은 접 을 수 있 는 Toolbar 를 제공 합 니 다.FrameLayout 에 계승 하여 layot 를 설정 합 니 다.scrollFlags,Collapsing Toolbar Layout 에 포 함 된 컨트롤(예:ImageView,Toolbar)이 layot 에 응답 하 는 것 을 제어 할 수 있 습 니 다.behavior 이벤트 에 해당 하 는 scrollFlags 스크롤 이벤트(화면 을 제거 하거나 화면 맨 위 에 고정)를 만 듭 니 다.
CollapsingToolbarLayout 사용 하기:

<android.support.design.widget.AppBarLayout
  android:layout_width="match_parent"
  android:layout_height="256dp"
  android:fitsSystemWindows="true">
  <android.support.design.widget.CollapsingToolbarLayout
   android:id="@+id/collapsing_toolbar_layout"
   android:layout_width="match_parent"
   android:layout_height="match_parent"
   app:contentScrim="#30469b"
   app:expandedTitleMarginStart="48dp"
   app:layout_scrollFlags="scroll|exitUntilCollapsed">
   <ImageView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:scaleType="centerCrop"
    android:src="@mipmap/bg"
    app:layout_collapseMode="parallax"
    app:layout_collapseParallaxMultiplier="0.7" />
   <android.support.v7.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    app:layout_collapseMode="pin" />
  </android.support.design.widget.CollapsingToolbarLayout>
 </android.support.design.widget.AppBarLayout>

우 리 는 Collapsing Toolbar Layout 에 ImageView 와 Toolbar 를 설정 했다.그리고 이 Collapsing ToolbarLayout 를 AppBarLayout 에 넣 어 전체 로 합 니 다.
1.Collapsing ToolbarLayout 에서:
우 리 는 layot 를 설 치 했 습 니 다.scrollFlags:그 값 에 대해 서 다시 한 번 말씀 드 리 겠 습 니 다.
스크롤-스크롤 하려 면 이 걸 설정 해 야 합 니 다.
enterAlways-quick return 효 과 를 실현 하고 아래로 이동 할 때 바로 View(예 를 들 어 Toolbar)를 표시 합 니 다.
exit Until Collapsed-위로 스크롤 할 때 View 를 수축 시 키 지만 Toolbar 를 계속 위 에 고정 시 킬 수 있 습 니 다.
enterAlways Collapsed-View 가 minHeight 속성 을 설정 하고 이 플래그 를 사용 할 때 View 는 최소 높이 로 만 들 어 갈 수 있 습 니 다.스크롤 보기 가 상단 에 도 착 했 을 때 만 전체 높이 로 확 대 됩 니 다.
그 중에서 일부 속성 도 설정 되 었 습 니 다.간략하게 설명 하 겠 습 니 다.
contentScrim-완전 CollapsingToolbarLayout 접 기(수축)후의 배경 색 을 설정 합 니 다.
expanded Title Margin Start-확장 할 때(수축 되 지 않 았 을 때)title 이 왼쪽으로 채 워 지 는 거 리 를 설정 합 니 다.
확장 되 지 않 았 을 때 그림:

2.ImageView 컨트롤 에서:
우 리 는 설정 했다:
layout_collapse Mode(접 기 모드)-두 개의 값 이 있 습 니 다.
pin -  이 모드 로 설정 되 었 을 때 Collapsing Toolbar Layout 가 완전히 수축 되면 Toolbar 는 화면 에 보관 할 수 있 습 니 다.
parallax-이 모드 로 설정 되 었 을 때 내용 이 굴 러 갈 때 Collapsing ToolbarLayout 의 View(예 를 들 어 ImageView)도 동시에 굴 러 시차 스크롤 효 과 를 실현 할 수 있 습 니 다.보통 layotcollapseParallax Multiplier(시차 인자 설정)를 조합 하여 사용 합 니 다.
layout_collapseParallax Multiplier(시차 인자)-시차 스크롤 인 자 를 설정 합 니 다.값 은 0~1 입 니 다.
3.Toolbar 컨트롤 에서:
우 리 는 layot 를 설 치 했 습 니 다.collapse Mode(접 기 모드):pin 입 니 다.
종합 분석:layot 설정 시behavior 컨트롤 이 CollapsingToolbarLayout 의 layot 에 응답 합 니 다.scrollFlags 이벤트 때 ImageView 는 시차 효과 가 있 는 위로 스크롤 하여 화면 을 제거 합 니 다.접 기 시작 할 때 Collapsing Toolbar Layout 의 배경 색(즉 Toolbar 의 배경 색)은 우리 가 설정 한 배경 색 으로 변 하고 Toolbar 도 항상 맨 위 에 고정 되 어 있 습 니 다.
효과 그림:

【주】:Collapsing Toolbar Layout 를 사용 할 때 title 을 Collapsing Toolbar Layout 에 설정 해 야 합 니 다.Toolbar 에 설정 하면 표시 되 지 않 습 니 다.즉:
mCollapsingToolbarLayout.setTitle(" ");
이 title 글꼴 색상:
확장 할 때의 title 색상:mCollapsingToolbarLayout.setExpanded TitleColor();
수축 후 Toolbar 에 표 시 될 title 색상:mCollapsing Toolbar Layout.set Collapsed TitleTextColor();
이 색상 의 과도 한 변 화 는 사실 Collapsing ToolbarLayout 가 우 리 를 도와 주 었 습 니 다.이것 은 자동 으로 과도 합 니 다.예 를 들 어 우 리 는 축 소 된 title 색상 을 녹색 으로 설정 합 니 다.효 과 는 그림 과 같 습 니 다.

녹음 을 잘 못 했 는데,어쨌든 효과 가 나 왔 다.
다음은 코드 가 어떻게 실현 되 는 지 봅 시다.
레이아웃 파일:

<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"
 tools:context=".MainActivity">
 <android.support.design.widget.AppBarLayout
  android:layout_width="match_parent"
  android:layout_height="256dp"
  android:fitsSystemWindows="true">
  <android.support.design.widget.CollapsingToolbarLayout
   android:id="@+id/collapsing_toolbar_layout"
   android:layout_width="match_parent"
   android:layout_height="match_parent"
   app:contentScrim="#30469b"
   app:expandedTitleMarginStart="48dp"
   app:layout_scrollFlags="scroll|exitUntilCollapsed">
   <ImageView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:scaleType="centerCrop"
    android:src="@mipmap/bg"
    app:layout_collapseMode="parallax"
    app:layout_collapseParallaxMultiplier="0.7" />
   <android.support.v7.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    app:layout_collapseMode="pin" />
  </android.support.design.widget.CollapsingToolbarLayout>
 </android.support.design.widget.AppBarLayout>
 <LinearLayout
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:orientation="vertical"
  app:layout_behavior="@string/appbar_scrolling_view_behavior">
  <android.support.v7.widget.RecyclerView
   android:id="@+id/recyclerView"
   android:layout_width="match_parent"
   android:layout_height="match_parent"
   android:scrollbars="none" />
 </LinearLayout>
</android.support.design.widget.CoordinatorLayout>

코드 파일:

 Toolbar mToolbar = (Toolbar) findViewById(R.id.toolbar);
  setSupportActionBar(mToolbar);
  getSupportActionBar().setDisplayHomeAsUpEnabled(true);
  mToolbar.setNavigationOnClickListener(new View.OnClickListener() {
   @Override
   public void onClick(View v) {
    onBackPressed();
   }
  });
  //  CollapsingToolbarLayout   title   CollapsingToolbarLayout ，   Toolbar      
  CollapsingToolbarLayout mCollapsingToolbarLayout = (CollapsingToolbarLayout) findViewById(R.id.collapsing_toolbar_layout);
  mCollapsingToolbarLayout.setTitle("CollapsingToolbarLayout");
  //  CollapsingToolbarLayout      
  mCollapsingToolbarLayout.setExpandedTitleColor(Color.WHITE);//              
  mCollapsingToolbarLayout.setCollapsedTitleTextColor(Color.GREEN);//     Toolbar      

이상 이 바로 본 고의 모든 내용 입 니 다.여러분 의 학습 에 도움 이 되 고 저 희 를 많이 응원 해 주 셨 으 면 좋 겠 습 니 다.