CODEWITHSUNDEEP
androidandroid-fragmentsandroid-coordinatorlayoutandroid-statusbar
何福毅
何福毅

Reputation: 323

How to make status bar transparent when using CoordinatorLayout in fragment

I hava a problem, when i using CoordinatorLayout which contain an imageview in fragment,i can't make the status bar transparent and draw the imageview under the status bar(in activity it's ok).

To illustration the problem,i take cheesesquare for an example.

There's a CheeseDetailActivity in cheesesquare shows some content like this(which effect it's i want):

in activity As we know,it easy to make this effect in activity,i pick up the key code:

< /resources>

Now,for some reason ,i want to show the same content in fragment but not in activity.I try to modify the code in cheesesquare .I just add a fragment and the style.xml and layout.xml is almost the same.Then the problem exist:

enter image description here

the status bar look look different! I confirm the style and layout is the same.So my question is what makes different?How can i make the status bar transparent?

EDIT:

activity_main.xml(modified)

<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/drawer_layout"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:fitsSystemWindows="true">

<!--<include layout="@layout/include_list_viewpager"/>-->

<FrameLayout
    android:id="@+id/fragment_container"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <fragment
        class="com.support.android.designlibdemo.MainFragment"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

</FrameLayout>

<android.support.design.widget.NavigationView
    android:id="@+id/nav_view"
    android:layout_height="match_parent"
    android:layout_width="wrap_content"
    android:layout_gravity="start"
    android:fitsSystemWindows="true"
    app:menu="@menu/drawer_view"/>

fragment_main.xml(added)

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
         xmlns:tools="http://schemas.android.com/tools"
         android:layout_width="match_parent"
         android:layout_height="match_parent"
         tools:context="com.support.android.designlibdemo.MainFragment">

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

include_list_viewpager.xml(no modify)

style.xml(no modify)

activity_cheese_detail.xml(deleted)

fragment_cheese_detail.xml(added,just copy the source activity_cheese_detail.xml)

<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:id="@+id/main_content"
                                             android:layout_width="match_parent"
                                             android:layout_height="match_parent"
                                             android:fitsSystemWindows="true"
                                             tools:context=".MainActivity">

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

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

Upvotes: 0

Views: 7844

Answers (3)

GPack
GPack

Reputation: 2504

Remove or change to a CoordinatorLayout type (with fitSystemWindows) the FrameLayout parent of a CoordinatorLayout child.

Upvotes: 1

Jayanth
Jayanth

Reputation: 6277

You can this in Java code 

protected void makeTransperantStatusBar(boolean isTransperant) {
    if (isTransperant) {
        getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
    } else {
        getWindow().clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
    }
}

if you want complete transperent you should do following

add these lines in your theme

<item name="android:windowTranslucentStatus">true</item>
<item name="android:windowTranslucentNavigation">true</item>

set this flag in your co-ordinator layout

android:fitsSystemWindows="true"

at last add these lines in onCreate method of Activity

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
        Window w = getWindow(); // in Activity's onCreate() for instance
        w.setFlags(WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS, WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS);
    }

reference solution taken from here

Upvotes: 7

SaraK
SaraK

Reputation: 11

You have to use kitkat+ android to have this option.

Add this code to your theme:

<item name="android:windowTranslucentStatus">true</item>
<item name="android:windowTranslucentNavigation">true</item>

Upvotes: 0

Related Questions