How to bring ImageView under the transparent Status Bar

Question

In the images below,I am trying to bring the ImageView under the StatusBar. But its not happening.

I went on Android transparent status bar and actionbar (this question) and tried to implement the same but its not working.

The xml layout of the activity is

<?xml version="1.0" encoding="utf-8"?>
 <FrameLayout
android:layout_height="match_parent"
android:layout_width="match_parent"
android:fitsSystemWindows="true"
xmlns:android="http://schemas.android.com/apk/res/android">
<LinearLayout
android:id="@+id/category_layout_top"
android:fitsSystemWindows="true"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">

<FrameLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">
<ImageView
    android:fitsSystemWindows="true"
    android:layout_width="390dp"
    android:layout_height="390dp"
    android:id="@+id/category_Image_View"/>


    <android.support.v7.widget.Toolbar
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/def_toolbar"
        android:layout_height="wrap_content"
        android:layout_width="match_parent"
        android:minHeight="?attr/actionBarSize"
        android:background="#00FFFFFF"
        android:layout_alignParentTop="true" />




</FrameLayout>
<LinearLayout
 android:layout_width="match_parent"
 android:layout_height="50dp"
 android:id="@+id/category_linearlayout">
<TextView android:layout_width="match_parent"
android:layout_height="match_parent"
android:singleLine="true"
android:id="@+id/category_textView"
/>
</LinearLayout>

</LinearLayout>

</FrameLayout>

I tried the below code in the onCreate() method also

 setStatusBarTranslucent(true);



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

style.xml

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <!-- Customize your theme here. -->
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>

</style>

style-v21.xml

<style name="AppTheme.NoActionBar">
    <item name="windowActionBar">false</item>
    <item name="windowNoTitle">true</item>
    <item name="android:windowDrawsSystemBarBackgrounds">true</item>
    <item name="android:statusBarColor">@android:color/transparent</item>
</style>

AppTheme is the style used in the activity.

EDIT 1

I used a color in the background of FrameLayout to check whether it was under the status bar or not. And it is not.

So the problem is not with Layout, I guess.

EDIT 2 this is the desired result

score 2 · Answer 1 · answered Mar 12 '16 at 18:09

2

In style-v21 you are overriding the style AppTheme.NoActionBar, but you said the style you use in your activity is the AppTheme style.

You need to override the AppTheme layout in style-v21 or define AppTheme.NoActionBar in you activity.

answered Mar 12 '16 at 18:09

jonathanrz

4,206
6
35
58

Yeah, Thanks :) I noticed it now. I will do that. But it won't have effect on the problem for pre lollipop versions.. – Abhishek Kulshrestha Mar 12 '16 at 18:12
I believe that the problem is with scaling. Try to add scaleType="centerCrop" or "fitXY" to your imageView – jonathanrz Mar 12 '16 at 18:14
Nope,its the same. Please check the Edit too. – Abhishek Kulshrestha Mar 12 '16 at 18:29
The problem is not with action bar, is with the imageView. set the width/height to match parent and apply the scaleTypes that I said and it will work. – jonathanrz Mar 12 '16 at 18:31
android:layout_width="match_parent" android:layout_height="match_parent" android:scaleType="centerCrop" – Abhishek Kulshrestha Mar 12 '16 at 18:34
There are any changes from the print screen you posted? – jonathanrz Mar 12 '16 at 19:06
Naah. No changes in it . – Abhishek Kulshrestha Mar 13 '16 at 02:39
@AbhishekKulshrestha can you post your original image? Can you create in photoshop your desired result? – jonathanrz Mar 13 '16 at 13:00
Added the image of the desired result. – Abhishek Kulshrestha Mar 13 '16 at 13:12
@AbhishekKulshrestha an ImageView with height and width as match_parent and the scaleType as fitXY should do the work. If not, can you post your project in github? – jonathanrz Mar 13 '16 at 13:20
It did not work. I can create a similar problem in another project and then post that on GitHub if you want. – Abhishek Kulshrestha Mar 13 '16 at 13:27
There is not much to do, just use the same style and this layout. You will have the same problem. – Abhishek Kulshrestha Mar 13 '16 at 13:29
You want me to post project with same problem on github? – Abhishek Kulshrestha Mar 13 '16 at 14:16
@AbhishekKulshrestha I want you to post any code that I could reproduce the problem. – jonathanrz Mar 13 '16 at 14:26
I uploaded the proect on this link. Please check https://drive.google.com/file/d/0B2Y9-jpvsfOBMFJicTl1alBycHc/view?usp=sharing – Abhishek Kulshrestha Mar 13 '16 at 15:02

How to bring ImageView under the transparent Status Bar

1 Answers1