I want to make my image fill upto the status bar and make it transparent as in the picture below. I have followed different similar questions but unable to get the required effect.
I have used the following style.
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="android:statusBarColor">#android:color/transparent</item>
<item name="android:windowNoTitle">true</item>
<item name="android:windowTranslucentStatus">true</item>
</style>
I have also tried adding this code.
getWindow().addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
getWindow().clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
getWindow().setStatusBarColor(Color.TRANSPARENT);
What do I need to get the desired effect?
The behavior you're looking for is only available on certain Android API versions. Starting with API 19, your app can have a translucent status bar and draw behind it. Starting with API 21, your app can have a transparent status bar and draw behind it. In order to successfully get the best possible outcome on all API levels, you're going to have to do a little bit of work. You need to create the AppTheme style in values/, values-v19/, and values-v21/, and you'll need to have all of the basics in all three places.
In your base values/ style, put this:
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
In your values-v19/ style, put this:
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="android:windowTranslucentStatus">true</item>
</style>
In your values-v21/ style, put this:
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="android:statusBarColor">#android:color/transparent</item>
</style>
Then, to support the transparent status bar in Lollipop+, add this to your activity's onCreate():
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
getWindow().getDecorView().setSystemUiVisibility(
View.SYSTEM_UI_FLAG_LAYOUT_STABLE | View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN);
}
Add these to your theme style:
<item name="android:windowTranslucentNavigation">true</item>
<item name="android:windowTranslucentStatus">true</item>
and in whichever activity you want the status bar to be transparent add this to the parent layout:
android:fitsSystemWindows="true"
also for lollipop+ add these flags to window:
getWindow().setFlags(WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS, WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS)
getWindow().getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_LAYOUT_STABLE | View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN);
put this code in oncreate method of your activity
if (GeneralFunctions.isAboveLollipopDevice()) {
Window window = getWindow();
window.setStatusBarColor(ContextCompat.getColor(this, R.color.colorTransparent));
window.getDecorView().setSystemUiVisibility(
View.SYSTEM_UI_FLAG_LAYOUT_STABLE
| View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN);
}
this must be your style file
<style name="BaseAppTheme" 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 name="AppTheme" parent="BaseAppTheme" />
and add this to your values-v21->style.xml as
<resources>
<style name="AppTheme" parent="BaseAppTheme">
<item name="android:windowDrawsSystemBarBackgrounds">true</item>
<item name="android:statusBarColor">#color/colorTransparent</item>
</style>
</resources>
Related
Look the bellow image.
If I mark any text then the top white toolbar come here. But I want to set the top white toolbar on my custom toolbar (red toolbar).
How I can do that?
Thanks for your answer.
Try adding actionModeBackground in your theme
<item name="actionModeBackground">#color/yourcolor</item>
For example,
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="android:windowBackground" >#android:color/white</item>
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="actionModeBackground">#color/yourcolor</item>
</style>
Change your theme like this
<item name="windowNoTitle">true</item>
<item name="windowActionBar">true</item>
In your activitys onCreate method add thissetSupportActionBar(myToolbar)`
I want to make 100% translucent status bar in android so that it should show the image below it clearly. Image Attached.
I have set the following theme to my activity :
<resources>
<style name="AppThemeT" parent="Theme.AppCompat.Light">
<item name="android:windowDrawsSystemBarBackgrounds">true</item>
<item name="android:statusBarColor">#color/transparent</item>
<item name="android:windowTranslucentStatus">true</item>
</style>
</resources>
But it is giving a weird gray colored shadow on the top. check attached image. I want to remove that shadow.
apply this theme to your layout root
<style name="AppTheme.Transparent">
<item name="android:windowTranslucentStatus">true</item>
<item name="android:windowTranslucentNavigation">true</item>
</style>
And this back in your java activity file:
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
window.setFlags(WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS, WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS);
}
Use Immersive view to remove that.
You can learn form here
In your styles.xml, you add below lines.
<!-- Base application theme. -->
<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 name="AppTheme.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="android:windowDisablePreview">true</item>
<item name="colorPrimary">#android:color/transparent</item>
<item name="colorPrimaryDark">#android:color/transparent</item>
</style>
<style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar" />
<style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light" />
create styles.xml for v21 and it should look like below:
<style name="AppTheme.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="android:windowDisablePreview">true</item>
<item name="android:windowDrawsSystemBarBackgrounds">true</item>
<item name="android:statusBarColor">#android:color/transparent</item>
<item name="colorPrimary">#android:color/transparent</item>
<item name="colorPrimaryDark">#android:color/transparent</item>
</style>
and in your manifest file you need to define your application theme:
<application
android:theme="#style/AppTheme"
also you need to define activity theme in your manifest file
<activity
android:theme="#style/AppTheme.NoActionBar"
Add this code in your onCreate();
getWindow().getDecorView().setSystemUiVisibility(
View.SYSTEM_UI_FLAG_LAYOUT_STABLE
| View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN);
When I use this theme everything is OK.
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
</style>
But I wanted to use custom toolbar so I changed app theme to Theme.AppCompat.NoActionBar.
<style name="AppTheme.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
The problem is that background of app now has the same color as a toolbar.
Before this change it was white.
When I change android:windowBackground it's only apply to Navigation Drawer.
How to make background color (marked by red arrow) white again ?
You need to change background color from xml file
and try this style for no actionbar
<style name="AppTheme.NoActionBar">
<item name="windowActionBar">false</item>
<item name="android:typeface">monospace</item>
<item name="windowNoTitle">true</item>
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="windowActionModeOverlay">true</item>
<item name="android:actionModeBackground">#color/colorPrimary</item>
<item name="android:textSize">#dimen/common_text_size</item>
</style>
Solved the issue by changing only colorPrimary.
<style name="AppTheme.NoActionBar">
<item name="colorPrimary">#color/colorWhite</item>
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
I'm applying this this to my base activity in manifest file.
<style name="AppTheme.NoActionBar" parent="Theme.AppCompat.Light.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="android:windowDrawsSystemBarBackgrounds" tools:targetApi="lollipop">true</item>
<item name="android:statusBarColor" tools:targetApi="lollipop">#color/darkRed</item>
</style>
But my status bar in base activity appears to be in blue colour. What am I suppose to do.
This is because in style.xml file you have not use colorPrimaryDark to change status bar color.
So if you are using material design to create your application then please refer this guidelines as shown below:
https://material.google.com/
https://developer.android.com/training/material/index.html
http://www.androidhive.info/2015/04/android-getting-started-with-material-design/
<style name="AppTheme.NoActionBar" parent="Theme.AppCompat.Light.NoActionBar">
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="android:windowDrawsSystemBarBackgrounds" tools:targetApi="lollipop">true</item>
<item name="android:statusBarColor" tools:targetApi="lollipop">#color/darkRed</item>
</style>
Try this.
<style name="AppTheme.NoActionBar" parent="Theme.AppCompat.Light.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="colorPrimary">#color/colorPrimary</item>
<!-- colorPrimaryDark is used for the status bar -->
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<!-- colorAccent is used as the default value for colorControlActivated
which is used to tint widgets -->
<item name="colorAccent">#color/colorAccent</item>
</style>
This case is related to the following problem.
In the case I believe it may be a problem with the style I'm trying to use the toolbar. I need you to stay in the Toolbar overlay, it has a drawer menu, and the lollipop operate normally, lower some versions.
style.xml v21
<style name="AppTheme" parent="AppTheme.Base">
<item name="android:colorPrimary">#color/primary</item>
<item name="android:colorPrimaryDark">#color/primary_dark</item>
<item name="android:colorAccent">#color/accent</item>
<item name="android:windowActionBarOverlay">true</item>
<item name="android:windowActionModeOverlay">true</item>
<item name="android:windowDrawsSystemBarBackgrounds">true</item>
<item name="android:statusBarColor">#android:color/transparent</item>
<!-- enable window content transitions -->
<item name="android:windowContentTransitions">true</item>
</style>
style.xml
<!-- Base application theme. -->
<style name="AppTheme.Base" parent="Theme.AppCompat.Light.NoActionBar">
<item name="colorPrimary">#color/primary</item>
<item name="colorPrimaryDark">#color/primary_dark</item>
<item name="colorAccent">#color/accent</item>
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="android:windowActionBarOverlay">true</item>
<item name="android:windowActionModeOverlay">true</item>
<item name="android:windowContentTransitions">true</item>
</style>
<style name="AppTheme" parent="AppTheme.Base">
</style>
If you are ok, someone could help me in this case the toolbar and the drawer disappear?
I found the solution to my problem. It was a possible conflict in style but rather a problem of organizing the objects on the screen.
With this following code could play the elements that disappeared in front of the camera.
getActivity().findViewById(R.id.DrawerLayout).bringToFront();
getActivity().findViewById(R.id.DrawerLayout).invalidate();
getActivity().findViewById(R.id.DrawerLayout).requestLayout();
In this case I have to get the reference of DrawerLayout and not the Toolbar. Thus the issue is resolved.