Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Android: How to remove line between Toolbar and Statusbar

I am interested in having a uniform coloured toolbar and status bar. If I provide colorPrimary and colorPrimaryDark as the same colour this should be possible. I am getting the desired result using ActionBar but not with Toolbar. I will also be creating a navigation view so i need the status bar as transparent.

Using Toolbar Using ActionBar

Code : Styles-v21

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

Code : Styles

<resources>

    <!-- 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/colorPrimary</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>

    <style name="AppTheme.NoActionBar">
        <item name="windowActionBar">false</item>
        <item name="windowNoTitle">true</item>
    </style>

    <style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar"/>

    <style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light"/>

</resources>

Steps to reproduce :

  1. Create a new project in android studio with Navigation Drawer Activity
  2. Set primary and primaryDark as same colours
  3. Run on device or emulator
like image 586
CuriousCat Avatar asked Nov 21 '15 19:11

CuriousCat


People also ask

How do you modify the status bar?

To customize it, first pull down the slider bar from the top of the screen. Next, tap on the three vertical dots in the top right corner. Now click on Status bar. You're in.

What is Android status bar?

On Android, the status bar contains notification icons and system icons.


1 Answers

The only solution I could come up with was to remove android:fitsSystemWindows="True" from Coordinator Layout

edit : Another solution is to wrap coordinator layout in another coordinator layout.

<?xml version="1.0" encoding="utf-8"?>
<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:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">

    <android.support.design.widget.CoordinatorLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <android.support.design.widget.AppBarLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:theme="@style/AppTheme.AppBarOverlay"
            app:layout_scrollFlags="scroll|enterAlways">

            <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:background="?attr/colorPrimary"
                app:popupTheme="@style/AppTheme.PopupOverlay"/>

        </android.support.design.widget.AppBarLayout>


        <include
            layout="@layout/content_main"
            app:layout_behavior="@string/appbar_scrolling_view_behavior"/>

    </android.support.design.widget.CoordinatorLayout>
</android.support.design.widget.CoordinatorLayout>

Before enter image description here

After enter image description here

like image 146
CuriousCat Avatar answered Sep 30 '22 14:09

CuriousCat