Why does a transparent ActionBar have gaps to the left and right?

Question

I want a gallery-like activity with a transparent ActionBar. If i give it a transparent color, it will show gaps to the left and right. If i give it a solid color, it does not. Why is that? And what do i need to remove them?

I found a few similar posts, but all given solutions did not work or couldn't give me the exact answer for the cause of this

activity_fullscreen_view.xml:

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout
    android:id="@+id/drawer_layout_fullscreen_image"
    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"
    tools:openDrawer="start">

    <include
        layout="@layout/app_bar_image_fullscreen"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

</android.support.v4.widget.DrawerLayout>

app_bar_image_fullscreen.xml:

<?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:id="@+id/coordinator_lay"
    tools:context="com.myself.myapp.ImageFullScreenActivity">

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/appbar"
        android:theme="@style/AppTheme.AppBarOverlay">

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


        </android.support.v7.widget.Toolbar>

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

    <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" />

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

v21\styles.xml (causing the gaps):

<resources>>

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

<style name="AppTheme.ActionBar.Transparent" parent="AppTheme.NoActionBar">
    <item name="colorPrimary">@android:color/transparent</item>
</style>

v21\styles.xml (not causing the gaps):

<resources>>

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

<style name="AppTheme.ActionBar.Transparent" parent="AppTheme.NoActionBar">
    <item name="colorPrimary">@color/myRed</item>
</style>

Hi lbrahim, yes i have. I just added it to the post. Thank you! — treesoft, Nov 06 '17 at 23:44
Look like issue not there, anyway the issue not in the toolbar nor theme it's something else, check your margins carefully. — , Nov 06 '17 at 23:51
I can't see it there either. I did not set any margins. I think it is another phenomena, becomming visible by setting transparent color... — treesoft, Nov 06 '17 at 23:59

score 0 · Accepted Answer · answered Nov 07 '17 at 14:24

I solved it by the help of this post:

when set app:elevation=“0dp” then hamburgermenu not showing to toolbar

So i added:

 app:elevation="0dp"

to AppBarLayout and:

findViewById(R.id.appBar).bringToFront();

to my activity in onCreate. But still not knowing what was covered by what for having this effect in my case....

Why does a transparent ActionBar have gaps to the left and right?

1 Answers1