Khám phá fitsSystemWindows và thanh trạng thái trong suốt trong android

Question

Vui lòng giả định mọi thứ chỉ dành cho mục tiêu và minSDK vesion chỉ là kẹo que.

Những gì tôi muốn

Tôi cố gắng để thực hiện một hoạt động tương tự như màn hình sau đây từ cửa hàng chơi.

Tôi đang tập trung vào hình ảnh Anh hùng tại đây. Như bạn thấy, 1. hình ảnh anh hùng được vẽ phía sau thanh trạng thái. (Hoàn toàn minh bạch. Không bảo vệ) 2. Phần còn lại của nội dung được vẽ bên dưới thanh trạng thái. (Ví dụ: Thanh công cụ/ActionBar) 3. Trong khi cuộn thanh trạng thái được tô màu.

Những gì tôi đã làm

Tôi đã sử dụng ScrimInsetsFrameLayout từ ứng dụng GoogleIO. Bọc hình ảnh anh hùng của tôi xung quanh bố cục này. Thêm phong cách thích hợp trong chủ đề của tôi. Đây là những gì tôi nhận được

Giúp tôi cần

1. tôi vẫn còn nhầm lẫn về thẻ fitsSystemWindows. Khi tôi đặt điều này thành "true" trên bố cục hình ảnh anh hùng, không có gì xảy ra. Đó là thanh trạng thái trong suốt nhưng hình ảnh được vẽ bên dưới thanh trạng thái. Nếu được đặt thành "false", tôi sẽ nhận được kết quả ở trên. Có một bài viết rõ ràng giải thích cách sử dụng và đằng sau hậu trường của thẻ này không.

2. Tôi đặt "insetForeground" trên ScrimInsetFrameLayout thành trong suốt. Cũng trong chủ đề tôi đặt màu thanh trạng thái là minh bạch. Nhưng vẫn có một sự bảo vệ trên hình ảnh. Cách làm cho thanh trạng thái hoàn toàn trong suốt.

Vui lòng giúp tôi với một dự án con trỏ hoặc demo. Ngoài ra hãy cho tôi biết nếu tôi không rõ ràng hoặc cần thêm thông tin.

Answer 1

Điều này phù hợp với tôi.

Layout.xml

<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" 
     xmlns:app="http://schemas.android.com/apk/res-auto" 
     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:fitsSystemWindows="true" 
      android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"> 

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

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

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

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

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

     <FrameLayout 
      android:id="@+id/fragmentContainer" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      app:layout_behavior="@string/appbar_scrolling_view_behavior" /> 

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

và thiết lập thuộc tính statusBarColor với màu sắc trong suốt tại styles.xml v-21

Answer 2

Thêm dòng sau vào xem mà bạn không muốn thanh công cụ để chồng lên nhau:

app:layout_behavior="@string/appbar_scrolling_view_behavior"