How to set a background status indicator as a gradient color or display it in android

Question

I want to set the status background as a gradient theme, as well as in the status bar, and the color of the action bar should have the same gradient as in the documentation, we can set the color in the status bar in the API level 21 and higher using

<item name="android:statusBarColor">@color/colorPrimary</item> 

But I'm looking for something like

 <item name="android:statusBarDrawable">@drawable/myDrawable</item> 

I saw an example that uses

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

but in this case the status bar and action bar overlap (use fitSystemWindow = true, but haven't decided yet) also try https://github.com/jgilfelt/SystemBarTint this library but still no luck

Thanks in advance!

Answer 1

For someone who wants to set the gradient color to a state background, you can use the following method in your activity before setContentView ()

  @TargetApi(Build.VERSION_CODES.LOLLIPOP) public static void setStatusBarGradiant(Activity activity) { if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) { Window window = activity.getWindow(); Drawable background = activity.getResources().getDrawable(R.drawable.gradient_theme); window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS); window.setStatusBarColor(activity.getResources().getColor(android.R.color.transparent)); window.setNavigationBarColor(activity.getResources().getColor(android.R.color.transparent)); window.setBackgroundDrawable(background); } } 

Thank you all for your help.

EDIT

If the above code does not work, try adding it to your styles.xml :

 <style name="AppTheme.NoActionBar"> <!-- Customize your theme here. --> <item name="windowActionBar">false</item> <item name="windowNoTitle">true</item> </style> 

Answer 2

@sushant gosavi's answer is right, but it does not work on DrawerLayout unless you do the following in DrawerLayout .

 <android.support.v4.widget.DrawerLayout 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/drawer_layout" android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="false" tools:openDrawer="start"> <include layout="@layout/app_bar_navigation" android:fitsSystemWindows="true" android:layout_width="match_parent" android:layout_height="match_parent" /> <android.support.design.widget.NavigationView android:id="@+id/nav_view" android:layout_width="wrap_content" android:layout_height="match_parent" android:layout_gravity="start" android:fitsSystemWindows="true" app:headerLayout="@layout/nav_header_navigation" app:menu="@menu/activity_navigation_drawer" /> 

You should change to false android:fitsSystemWindows="false" in DrawerLayout and set it to true in childs

Answer 3

Please look at this:

Enter link description here

Use a special utility class to solve this problem.

Answer 4

extension for sushant answer, as getColor is deprecated in kotlin too.

 @RequiresApi(Build.VERSION_CODES.LOLLIPOP) fun backGroundColor() { window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS) window.statusBarColor = ContextCompat.getColor(this, android.R.color.transparent) window.navigationBarColor = ContextCompat.getColor(this, android.R.color.transparent) window.setBackgroundDrawableResource(R.drawable.ic_drawable_vertical_background) } 

The idea is to make the status bar transparent and set the background for the entire window, which will also overlap the status bar against the same background.

Answer 5

Step1: Create a state class as shown below

 public class StatusBarView extends View { private int mStatusBarHeight; public StatusBarView(Context context) { this(context, null); } public StatusBarView(Context context, AttributeSet attrs) { super(context, attrs); if( Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP){ setSystemUiVisibility(SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN); } } @Override public WindowInsets onApplyWindowInsets(WindowInsets insets) { if(Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP){ mStatusBarHeight = insets.getSystemWindowInsetTop(); return insets.consumeSystemWindowInsets(); } return insets; } @Override protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { setMeasuredDimension(MeasureSpec.getSize(widthMeasureSpec),mStatusBarHeight); } } 

Step 2: create a graphic gradient as shown below

 <?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android"> <gradient android:type="linear" android:angle="135" android:endColor="#F34D80" android:startColor="#FF5858"/><!--android:centerColor="#C12389"--> </shape> 

Step 3: create the layout as shown below

 <?xml version="1.0" encoding="utf-8"?> <LinearLayout 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="wrap_content" android:orientation="vertical"> <YOURPACKAGENAME.StatusBarView android:id="@+id/status_bar" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@drawable/toolbar_bg_gradient"/> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignParentTop="true" android:background="@drawable/toolbar_bg_gradient" android:elevation="0dp" android:minHeight="?attr/actionBarSize" app:contentInsetStartWithNavigation="0dp" app:popupTheme="@style/AppTheme.PopupOverlay" app:subtitleTextColor="@android:color/white" app:theme="@style/AppTheme.AppBarOverlay" app:titleTextColor="@android:color/white" /> </LinearLayout> 

Step 4: create a style for action

 <style name="AppTheme.NoActionBarMain" parent="Base.Theme.AppCompat.Light"> <item name="windowActionBar">false</item> <item name="android:windowDisablePreview">true</item> <item name="windowNoTitle">true</item> <item name="colorPrimary">@color/colorPrimary</item> <item name="android:windowContentOverlay">@null</item> <item name="android:windowEnableSplitTouch">false</item> <item name="android:splitMotionEvents">false</item> <item name="android:windowDrawsSystemBarBackgrounds" tools:targetApi="lollipop">true</item> <item name="android:statusBarColor" tools:targetApi="lollipop">@android:color/transparent</item> <item name="android:colorForeground">@color/foreground_material_light</item> <item name="windowActionModeOverlay">true</item> <item name="actionModeStyle">@style/LywActionMode</item> </style> <style name="LywActionMode" parent="Base.Widget.AppCompat.ActionMode"> <item name="background">@color/colorPrimary</item> <item name="backgroundSplit">@color/colorPrimary</item> </style> 

Answer 6

I used the answer to this link here. and if you want to show the action bar, I added the following code, making it a transparent background

 final ActionBar ab = getSupportActionBar(); if (ab != null) { Drawable gradientBG = getResources().getDrawable( R.drawable.bg_transperant); ab.setBackgroundDrawable(gradientBG); } 

and then in bg_gradient.xml

 <?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <solid android:color="@android:color/transparent" /> </shape> 

Answer 7

Adding the following two lines helped me:

 window.addFlags(WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS); window.addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION); 

Answer 8

This is how you do it without any Java code,

Gradient file for drawable/bg_toolbar.xml

 <?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android"> <gradient android:type="linear" android:angle="0" android:startColor="#11998e" android:endColor="#38ef7d" /> </shape> 

add this to your values/style.xml

 <item name="android:windowBackground">@drawable/bg_toolbar</item> <item name="toolbarStyle">@style/Widget.Toolbar</item> <item name="android:statusBarColor">#00000000</item> 

create a new file for your toolbar Gradient values/toolbar.xml

 <?xml version="1.0" encoding="utf-8"?> <resources> <style name="Widget.Toolbar" parent="@style/Widget.AppCompat.Toolbar"> <item name="contentInsetStart">0dp</item> <item name="android:background">@drawable/bg_toolbar</item> </style> </resources> 

Edit: Add background android:background="#ffffff" in your activity layout file.

Answer 9

I decided it like this

 <style name="AppTheme.Base" parent="Theme.AppCompat.Light.NoActionBar"> <item name="android:windowNoTitle">true</item> <item name="android:windowBackground">@drawable/backfull</item> <item name="android:windowActionBar">false</item> <item name="android:windowActionModeOverlay">true</item> <item name="windowActionModeOverlay">true</item> </style> <style name="AppTheme2" parent="AppTheme.Base"> <item name="colorPrimary">@drawable/backfull</item> <item name="colorPrimaryDark">@android:color/white</item>> <item name="colorAccent">@android:color/black</item> <item name="colorButtonNormal">@android:color/white</item> </style> <style name="ToolbarTheme" parent="Widget.AppCompat.Toolbar"> <item name="android:background">@drawable/backfull</item> <item name="background">@android:color/black</item> <item name="titleTextAppearance">@style/ToolbarTitleTheme</item> <item name="popupTheme">@style/ThemeOverlay.AppCompat.Dark.ActionBar</item> <item name="theme">@style/ThemeOverlay.AppCompat.Dark.ActionBar</item> </style> <style name="ToolbarTitleTheme"> <item name="android:textColor">@android:color/holo_red_dark</item> <item name="android:textStyle">bold</item> </style> 

Answer 10

the answer provided by sushant goswami actually works fine, after losing one day, finally realized that the status bar color and the initial gradient color were the same in my case, after changing the gradient color to a different color than the default status bar color he worked well