Develop Reference

Prevent statusbar to be shown over NavigationView in devices with Notch

I have an issue with my NavigationView, when it's expanded the statusBar is shown in semitransparent color over it and i would hide it completely by still keeping notch support.
It looks like this now:
I've tried to add
android:fitsSystemWindows="false" in my Activity but nothing chanded.
My styles.xml looks like this:
<style name="AppTheme" parent="Theme.MaterialComponents.Light.NoActionBar.Bridge">
<item name="android:windowNoTitle">true</item>
<item name="android:windowActionBar">false</item>
<item name="android:windowFullscreen">true</item>
<item name="android:windowContentOverlay">#null</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorAccent</item>
<item name="primaryTextColor">#F4F4F6</item>
<item name="colorControlNormal">#color/colorAccent</item>
<item name="secondaryTextColor">#96000000</item>
<item name="recyclerViewTitleColor">#96000000</item>
<item name="navColor">#2948ff</item>
<item name="colorTurni">#color/blueLight</item>
<item name="varianti">#color/green</item>
<item name="blueDark">#color/blueDark</item>
<item name="backgroundCardColor">#FFFF</item>
<item name="bottomSheetDialogTheme">#style/ThemeOverlay.App.BottomSheetDialog</item>
<item name="android:windowLayoutInDisplayCutoutMode">
shortEdges
</item>
<item name="android:windowTranslucentStatus">true</item>
</style>
</resources>
What i would reach is this:
Activity.xml
<androidx.drawerlayout.widget.DrawerLayout android:id="#+id/drawer_layout"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#FAFAFA"
android:orientation="vertical"
tools:context="it.gabtamagnini.visualposmobile.PtermActivity">
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
...
</androidx.coordinatorlayout.widget.CoordinatorLayout>
<com.google.android.material.navigation.NavigationView
android:id="#+id/nav_menu"
android:layout_width="185dp"
android:layout_height="match_parent"
android:fitsSystemWindows="false"
android:background="#color/white"
android:layout_gravity="start"
app:headerLayout="#layout/layout_header">
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recyclerViewMenu"
android:layout_width="match_parent"
android:layout_marginTop="120dp"
android:layout_height="match_parent"
tools:listitem="#layout/layout_menu"
android:clipToPadding="false"
android:paddingBottom="15dp"
android:paddingEnd="5dp"
android:paddingStart="5dp" />
</com.google.android.material.navigation.NavigationView>
</androidx.drawerlayout.widget.DrawerLayout>

Cause:
This shadow is related to the drawable used for the inset foreground which is customized to R.styleable.ScrimInsetsFrameLayout_insetForeground style by default on the NavigationView; this answer explains more about the ScrimInsetsFrameLayout class.
Solution:
Getting rid of this drawable from the NavigationView either programmatically or in layout:
Programmatically: setting setScrimInsetForeground to null.
navView.setScrimInsetForeground(null)
In layout: using app:insetForeground="#null":
<com.google.android.material.navigation.NavigationView
android:id="#+id/nav_menu"
....
app:insetForeground="#null"/>

Use this in your NavigationView not in activity
android:fitsSystemWindows="false"
it will solve your issue

How to center title in default toolbar without custom layout?

I have this Theme and want to center the title in the default toolbar. This means that I have no Toolbar in my XML file. This is what I have tried:
<style name="Theme.MyApp" parent="Theme.MaterialComponents.DayNight.DarkActionBar">
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorPrimary">#color/colorPrimary</item>
<item name="android:textColor">#color/colorWhite</item>
<item name="actionBarTheme">#style/AppBaseTheme.Toolbar</item>
</style>
<style name="AppBaseTheme.Toolbar" parent="Widget.AppCompat.ActionBar.Solid">
<item name="android:textColorPrimary">#color/colorPrimary</item>
<item name="titleCentered">true</item>
</style>
Where <item name="titleCentered">true</item> doesn't center the title. How to solve this?

In your Activity, in your onCreate()
methodgetSupportActionBar().setDisplayOptions(ActionBar.DISPLAY_SHOW_CUSTOM;
getSupportActionBar().setCustomView(R.layout.main_layout);
main_layout.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:orientation="vertical">
<android.support.v7.widget.AppCompatTextView
android:id="#+id/tvTitle"
style="#style/TextAppearance.AppCompat.Widget.ActionBar.Title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:textColor="#FFFFFF" />

BottomNavigationView Text Resize Animation Issue based on theme used

I am using BottomNavigationView but observing a strange issue.
When used with the theme "Theme.AppCompat.Light.DarkActionBar", Text and Icon Resize animation works fine on each item when clicked.
But When used with theme "Theme.MaterialComponents.Light.DarkActionBar",
it's not working, No Resize animation happening.
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bottomNav"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:background="#212121"
app:itemIconTint="#color/nav_item_color_state"
app:itemTextColor="#color/nav_item_color_state"
app:menu="#menu/bottom_menu_main"/>
nav_item_color_state.xml
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="#+id/action_nav_feed"
android:icon="#android:drawable/ic_input_add"
android:checked="true"
android:title="List"/>
<item
android:id="#+id/action_nav_info"
android:icon="#android:drawable/ic_notification_overlay"
android:title="Info"/>
<item
android:id="#+id/action_nav_profile"
android:icon="#android:drawable/ic_delete"
android:title="Profile"/>
</menu>
style.xml
<style name="AppTheme" parent="Theme.MaterialComponents.Light.DarkActionBar">
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
</style>
<!-- Theme.AppCompat.Light.DarkActionBar -->

Try using the properties app:itemTextAppearanceActive and app:itemTextAppearanceInactive
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bottomNav"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:background="#212121"
app:itemIconTint="#color/nav_item_color_state"
app:itemTextAppearanceActive="#style/BottomNavigationView.Active"
app:itemTextAppearanceInactive="#style/BottomNavigationView"
app:itemTextColor="#color/nav_item_color_state"
app:menu="#menu/bottom_menu_main"/>
In styles.xml
<style name="BottomNavigationView"
parent="#style/TextAppearance.AppCompat.Caption">
<item name="android:textSize">10sp</item>
</style>
<style name="BottomNavigationView.Active"
parent="#style/TextAppearance.AppCompat.Caption">
<item name="android:textSize">15sp</item>
</style>
There's no need to set theme for this View, these styles will do the thing.

Toolbar going underneath status bar both in Activity and Fragment android

I want to achieve a transparent status bar in pre lollipop and above lollipop as well. My minimumSdkLevel is 19. I have tried the following method to achieve transparent statusbar. But the toolbar is going underneath statusbar.
Here is the screenshot (This is a Full screen Fragment with Toolbar on it):
Layout of the above screenshot:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView 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="match_parent"
android:clickable="true"
app:cardCornerRadius="3dp"
android:fitsSystemWindows="true"
app:cardElevation="3dp">
<RelativeLayout
android:id="#+id/gamesLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.design.widget.AppBarLayout
android:id="#+id/toolbarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/gameToolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/toolbarLayout">
<ImageView
android:layout_width="200dp"
android:layout_height="200dp"
android:adjustViewBounds="true"
android:alpha="0.3"
android:scaleType="fitXY"
android:src="#drawable/background_img" />
<ImageView
android:layout_width="200dp"
android:layout_height="200dp"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:adjustViewBounds="true"
android:alpha="0.3"
android:rotation="180"
android:scaleType="fitXY"
android:src="#drawable/background_img" />
<android.support.v7.widget.RecyclerView
android:id="#+id/gameList"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="10dp" />
</RelativeLayout>
</RelativeLayout>
</android.support.v7.widget.CardView>
Here is my styles.xml:
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="android:colorBackgroundCacheHint">#null</item>
<item name="android:windowTranslucentStatus">true</item>
<item name="android:windowTranslucentNavigation">true</item>
<item name="android:windowAnimationStyle">#android:style/Animation</item>
</style>
Here is my v21/styles.xml :
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="android:colorPrimary">#color/colorPrimary</item>
<item name="android:colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="android:colorAccent">#color/colorAccent</item>
<item name="android:windowContentTransitions">true</item>
<item name="android:windowTranslucentStatus">true</item>
<item name="android:windowDrawsSystemBarBackgrounds">true</item>
<item name="android:windowTranslucentNavigation">true</item>
</style>
I have even added android:fitsSystemWindows="true" to the root layout of the Activities and Fragments.
I have added this below code as well in the Activities and Fragments:
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
Window window = getWindow();
window.setFlags(WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS, WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS);
}
Why I am not getting transparent Statusbar and why Toolbar is going underneath Statusbar?

in default style.xml
<!-- Base application theme. -->
<style name="BGTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
</style>
<style name="BGTheme.ActionBar.Transparent" parent="BGTheme">
<item name="android:windowContentOverlay">#null</item>
<item name="windowActionBarOverlay">true</item>
<item name="windowActionBar">false</item>
<item name="colorPrimary">#android:color/transparent</item>
<item name="android:textColorSecondary">#color/white</item>
</style>
<style name="BGTheme.ActionBar.Transparent.AppBarOverlay"
parent="ThemeOverlay.AppCompat.Dark.ActionBar" />
<style name="BGTheme.ActionBar.Transparent.PopupOverlay"
parent="ThemeOverlay.AppCompat.Light" />
and in your v-21 style.xml
<style name="BGTheme.ActionBar.Transparent" parent="BGTheme">
<item name="colorPrimary">#android:color/transparent</item>
</style>
Note: Add this in your root layout android:fitsSystemWindows="true"

remove if statment
not work below 21
getWindow().setFlags(WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS,WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS);

add flowing lines in your 'style.xml'
<item name="android:windowContentOverlay">#null</item>
<item name="windowActionBarOverlay">true</item>
<item name="windowActionBar">false</item>
<item name="colorPrimary">#android:color/transparent</item>

EDIT:
try Using the following Line in your Base View.
android:fitsSystemWindows="true"
as it is mention also
android:fitsSystemWindows is an
internal attribute to adjust view layout based on system windows such
as the status bar. If true, adjusts the padding of this view to leave
space for the system windows. Will only take effect if this view is in
a non-embedded activity.
Must be a boolean value, either "true" or "false".
This may also be a reference to a resource (in the form
"#[package:]type:name") or theme attribute (in the form
"?[package:][type:]name") containing a value of this type.
This corresponds to the global attribute resource symbol
fitsSystemWindows.
You can also use it globally by using the below line in your theme
<item name="android:fitsSystemWindows">true</item>
I hope it helps. It works in my Project.

How to remove background of action menu item?

I have got the following action menu:
As you can see all of these action menu items are having a
background. i guess it is the same background like the parent.
How can i remove this background?
My style.xml is the following:
<resources xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools">
<style name="AppTheme" parent="AppTheme.Base"></style>
<style name="AppTheme.Base" parent="Theme.AppCompat.Light.NoActionBar">
<item name="colorPrimaryDark">#color/primaryColorDark</item>
<item name="colorPrimary">#color/primaryColor</item>
<item name="colorAccent">#color/accentColor</item>
<item name="android:textColorPrimary">#color/textcolorsecundary</item>
<item name="android:textColorSecondary">#color/textcolorsecundary</item>
<item name="android:actionModeBackground">#color/primaryColor</item>
<item name="android:windowActionModeOverlay">true</item>
<item name="android:activatedBackgroundIndicator">#drawable/custom_background_listview_item</item>
</style>
<style name="AppTheme.Toolbar" parent="ThemeOverlay.AppCompat.Dark.ActionBar">
<item name="android:textColorPrimary">#color/textcolorsecundary</item>
<item name="actionMenuTextColor">#color/textcolorsecundary</item>
<item name="android:textColorSecondary">#color/textcolorsecundary</item>
<item name="android:showDividers">beginning</item>
<item name="android:divider">#color/primaryColorDark</item>
<item name="android:background">#drawable/custom_background_blue</item>
</style>
<style name="AppTheme.Toolbar.PopupMenu" parent="ThemeOverlay.AppCompat.Dark">
<item name="android:popupBackground">#color/primaryColor</item>
</style>
</resources>
My Toolbar:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?android:attr/actionBarSize"
android:elevation="2dp"
android:focusable="false"
app:popupTheme="#style/AppTheme.Toolbar.PopupMenu"
app:theme="#style/AppTheme.Toolbar" >
<TextView
android:id="#+id/toolbar_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="start"
android:background="#null"
android:textColor="#color/white"
android:textSize="20sp"
android:textStyle="bold" />
</android.support.v7.widget.Toolbar>

The following line is the problem
<style name="AppTheme.Toolbar" parent="ThemeOverlay.AppCompat.Dark.ActionBar">
<item name="android:background">#drawable/custom_background_blue</item>
</style>
Since the above is applied not as style but as a theme (presumably via popupTheme attribute on your Toolbar element), all the widgets inside the toolbar inherit these settings. What you want is android:popupBackground instead of android:background.
Edit: OP stated the above is not sufficient. For styling toolbar's popup menu (not the toolbar itself) use the app:popupTheme attribute. The theme is going to be similar to this:
<style name="AppTheme.Toolbar.PopupMenu" parent="ThemeOverlay.AppCompat.Dark">
<item name="android:popupBackground">#drawable/custom_background_blue</item>
</style>

You're setting the action background color explicitly in your style.xml same as the primary color.
<item name="android:actionModeBackground">#color/primaryColor</item>
Try removing this from your XML or changing it to a color that seems appropriate for your UI and it should work. If you don't choose to manually specify a color for the android:actionModeBackground, it will simple derive it's default value from the parent theme (in your case, Theme.AppCompat.Light.NoActionBar).