how to set status bar background as gradient color or a drawable in android

杀马特。学长 韩版系。学妹 提交于 2019-11-27 07:54:10
sushant gosavi

For some one who want to set gradient color to status bar background you can use 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);
        }
    } 

Thanks every one for your help

EDIT

If the above code don't work, try to add this in your styles.xml:

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

the answer of @sushant gosavi 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 must change to false android:fitsSystemWindows="false" in DrawerLayout and set it to true in the childs

Faisal Russel

Please take a look of this :

Enter link description here

Use a custom util class to solve this issue

an extension to the sushant's answer since getColor is deprecated and in kotlin language.

@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 transparent status bar and setting a background to the whole window which will also cover the status bar in the same background.

Step1: Create a status bar class like 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);
    }
}

Step2: create a drawable gradient like 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>

Step3: create a layout like 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>

Step4: create a style for activity

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

I used the answer on this link here. and if you want to show action bar I added next code make it 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>
Максим Сыроватка

Adding the following two lines helped me:

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

Here how you do it without any Java code,

Gradient drawable file 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 in 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>

make 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.

I solved 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>

the answer provided by sushant goswami is actually working fine, after wasting one day finally realized that the status bar color and the gradient start color both were same in my case,after changing gradient color to some color other than default status bar color it was working well

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!