Strange custom toolbar on pre-installed devices
I'm having problems with the appcompat toolbar on <5.0. I expected this (working result on Xperia and Nexus devices with lollipop):
Unfortunately I am getting this on <5.0; black text and a weird looking status bar hovering over the toolbar:
This is my dashboard:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/ColorPrimary"
android:theme="@style/ThemeOverlay.AppCompat.Dark"
android:elevation="4dp">
</android.support.v7.widget.Toolbar>
And the design of MainActivity:
<android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/DrawerLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:clickable="true">
<include
android:id="@+id/tool_bar"
layout="@layout/tool_bar">
</include>
<android.support.v4.view.ViewPager xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v4.view.PagerTitleStrip android:id="@+id/pager_title_strip"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="top"
android:background="#33b5e5"
android:textColor="#fff"
android:paddingTop="4dp"
android:paddingBottom="4dp" />
</android.support.v4.view.ViewPager>
</LinearLayout>
<android.support.v7.widget.RecyclerView
android:id="@+id/RecyclerView"
android:layout_width="320dp"
android:layout_height="match_parent"
android:layout_gravity="left"
android:background="#ffffff"
android:scrollbars="vertical">
</android.support.v7.widget.RecyclerView>
</android.support.v4.widget.DrawerLayout>
My styles-v21.xml:
<resources>
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="colorPrimary">@color/ColorPrimary</item>
<item name="colorPrimaryDark">@color/ColorPrimaryDark</item>
<item name="android:windowDrawsSystemBarBackgrounds">true</item>
<item name="android:statusBarColor">@android:color/transparent</item>
</style>
</resources>
Definition of code inside MainActivity onCreate:
toolbar = (Toolbar) findViewById(R.id.tool_bar); setSupportActionBar(toolbar); mRecyclerView = (RecyclerView) findViewById(R.id.RecyclerView); mRecyclerView.setHasFixedSize(true); Drawer = (DrawerLayout) findViewById(R.id.DrawerLayout); Drawer.setStatusBarBackgroundColor(getResources().getColor(R.color.ColorPrimaryDark));
source to share
Ok, I finally managed to get rid of this strange problem. I changed the style.xml for v-19 to this:
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar" >
<item name="android:windowTranslucentStatus">true</item>
</style>
It just makes it transparent on kitkat devices. And nothing changed in style-v21.xml and in the original styles.xml file.
Then the toolbar changed to add app:theme
and app:popupTheme
, for which white text is set. And android:paddingTop
, to change the add-on that needs to be installed on kitkat devices.
<android.support.v7.widget.Toolbar 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:background="@color/ColorPrimary"
android:elevation="4dp"
app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
android:paddingTop="@dimen/tool_bar_top_padding">
</android.support.v7.widget.Toolbar>
In the default dimens.xml:
<dimen name="tool_bar_top_padding">0dp</dimen>
Dimens-v19.xml:
<dimen name="tool_bar_top_padding">20dp</dimen>
Dimens-v21.xml:
<dimen name="tool_bar_top_padding">0dp</dimen>
Last but not least, remove android:fitsSystemWindows="true"
from DrawerLayout in main_activity.xml project
source to share
I'm not sure about the reason for this error. But I think the job can be done if you set the background color of the Statusbar to Lollipop from the newly introduced API
API setStatusBarColor(int color)
, and you need to set some meaningful flags WindowManager
along with it:
Sample found from this descriptive answer :
Window window = activity.getWindow();
window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
window.setStatusBarColor(activity.getResources().getColor(R.color.ColorPrimary));
// to set ColorPrimary as status bar background color
This will remove the gray background displayed on Samsung lollipop devices
source to share