We Keep Coding

set Label Alignment in navigation Fragments

I want the label(toolbar title) to be aligned centered.What should I do? I have reffered to some logics and didn't find them effective and they also didn't work. So kindly guide me through it.
This is the Navigation File:
<?xml version="1.0" encoding="utf-8"?>
<navigation 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/mobile_navigation"
app:startDestination="#id/current_weather_fragment">
<fragment
android:id="#+id/current_weather_fragment"
android:name="com.example.wheatherapp.UI.Weather.CurrentWeather.CurrentWeatherFragment"
android:label="current_weather_fragment"
tools:layout="#layout/current_weather_fragment" />
<fragment
android:id="#+id/future_weather_fragment"
android:name="com.example.wheatherapp.UI.Weather.FutureWeather.FutureWeatherListFrag.FutureWeatherFragment"
android:label="future_weather_fragment"
tools:layout="#layout/future_weather_fragment" />
<fragment
android:id="#+id/future_detail_weather"
android:name="com.example.wheatherapp.UI.Weather.FutureWeather.FutureDetailFrag.FutureDetailWeather"
android:label="future_detail_weather_fragment"
tools:layout="#layout/future_detail_weather_fragment" />
<fragment
android:id="#+id/setting_fragment"
android:name="com.example.wheatherapp.UI.Setting.SettingFragment"
android:label="SettingFragment" />
</navigation>
This is the MainActvity.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
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"
tools:context=".UI.MainActivity">
<com.google.android.material.appbar.AppBarLayout
android:id="#+id/appbar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
android:theme="#style/ToolbarTheme">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?actionBarSize"
android:background="?colorPrimary"
/>
</com.google.android.material.appbar.AppBarLayout>
<androidx.fragment.app.FragmentContainerView
android:id="#+id/nav_host_frag"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintTop_toBottomOf="#id/appbar_layout"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintBottom_toTopOf="#id/bottom_nav"
app:navGraph="#navigation/mobile_navigation"
app:defaultNavHost="true"
android:name="androidx.navigation.fragment.NavHostFragment" />
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bottom_nav"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:menu="#menu/bottom_nav_menu"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"/>
</androidx.constraintlayout.widget.ConstraintLayout>
This is the image in which i want the title to be aligned centered:
the uploaded one
Style.xml
<resources xmlns:tools="http://schemas.android.com/tools">
<!-- Base application theme. -->
<style name="Theme.WheatherApp" parent="Theme.MaterialComponents.DayNight.DarkActionBar">
<!-- Primary brand color. -->
<item name="colorPrimary">#color/purple_200</item>
<item name="colorPrimaryVariant">#color/purple_700</item>
<item name="colorOnPrimary">#color/black</item>
<!-- Secondary brand color. -->
<item name="colorSecondary">#color/teal_200</item>
<item name="colorSecondaryVariant">#color/teal_200</item>
<item name="colorOnSecondary">#color/black</item>
<!-- Status bar color. -->
<item name="android:statusBarColor" tools:targetApi="l">?attr/colorPrimaryVariant</item>
<!-- Customize your theme here. -->
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
<style name="ToolbarTheme" parent="ThemeOverlay.MaterialComponents.ActionBar">
<item name="android:textColorPrimary">#color/white</item>
<item name="android:textColorSecondary">#EEEEEE</item>
<item name="android:gravity">center_vertical|center_horizontal</item>
<item name="background">?colorPrimary</item>
</style>
</resources>

1) Add Textview for your toolbar title into your tag which is located in MainActivity.xml in your case.
<com.google.android.material.appbar.AppBarLayout
android:id="#+id/appbar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
android:theme="#style/ToolbarTheme">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?actionBarSize"
android:background="?colorPrimary">
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Borrowers"
android:textColor="#color/white"
android:textSize="18dp" />
</androidx.appcompat.widget.Toolbar>
</com.google.android.material.appbar.AppBarLayout>
2) Add toolbar to your MainActivity.java in onCreate() method.
//set toolbar
Toolbar toolbar = findViewById(R.id.borrowerstoolbar_main);
setSupportActionBar(toolbar);
getSupportActionBar().setTitle(null);

How to make BottomNavigationView Menu in Uppercase?

I want to make BottomNavigationView Menu in UpperCase, How can i do that without using 3rd party library?
Here is my xml code:
<android.support.design.widget.BottomNavigationView
android:id="#+id/navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:background="#android:color/white"
android:foreground="?attr/selectableItemBackground"
app:itemIconTint="#color/bottom_nav_color"
app:itemTextColor="#color/bottom_nav_color"
app:menu="#menu/navigation" />
And navigation.xml as follows:
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="#+id/navigation_home"
android:icon="#drawable/home_icon"
android:title="#string/title_home"
/>
<item
android:id="#+id/navigation_deals"
android:icon="#drawable/ic_deals"
android:title="#string/deals" />
<item
android:id="#+id/navigation_myBookings"
android:icon="#drawable/ic_my_bookings"
android:title="#string/title_my_bookings" />
<item
android:id="#+id/navigation_more"
android:icon="#drawable/ic_more"
android:title="#string/title_more" />
</menu>

Try this
Create a style like this BottomNavigationViewStyle
<style name="BottomNavigationViewStyle">
<item name="android:textAllCaps">true</item>
<item name="android:textSize">15sp</item>
</style>
Than use like this
<android.support.design.widget.BottomNavigationView
android:id="#+id/navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_gravity="bottom"
android:background="#android:color/white"
android:foreground="?attr/selectableItemBackground"
app:menu="#menu/navigation"
app:theme="#style/BottomNavigationViewStyle" />
OUTPUT

Apply this theme to your bottom navigation
<style name="AppTheme2" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="android:textAllCaps">true</item>
</style>

Shadow effect (elevation) is hiding after app was launched

I have a problem with elevation effect in my app (shadow under TabLayout exactly) that is collapsing after I'm running my App. It's visible in preview mode but not on my device cause it's hiding. This is my code:
Main Activity
<android.support.design.widget.CoordinatorLayout 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:background="#android:color/white"
android:clipToPadding="false">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar_material_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/toolbar1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways|enterAlwaysCollapsed" >
<ImageView
android:id="#+id/header"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/background_portrait"
android:fitsSystemWindows="true"
android:scaleType="centerCrop"
app:layout_collapseMode="parallax" />`
</android.support.design.widget.CollapsingToolbarLayout>
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabGravity="fill"
android:elevation="20dp"
app:tabTextAppearance="#style/MineCustomTabText"
/>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
/></android.support.design.widget.CoordinatorLayout>
Here is code of styles.xml
<resources>
<style name="MyMaterialTheme" parent="MyMaterialTheme.Base">
</style>
<style name="MyMaterialTheme.Base" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="windowNoTitle">true</item>
<item name="windowActionBar">false</item>
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="colorControlNormal">#color/editTextIndigo</item>
<item name="colorControlActivated">#color/editTextPink</item>
</style>
<style name="Toolbar.TitleText" parent="TextAppearance.Widget.AppCompat.Toolbar.Title">
<item name="android:textSize">16sp</item>
<item name="android:textAllCaps">true</item>
</style>
<style name="MineCustomTabText" parent="TextAppearance.AppCompat.Widget.ActionBar.Title.Inverse">
<item name="android:textSize">13sp</item>
<item name="android:textAllCaps">true</item>
<item name="android:textColor">#android:color/white</item>
</style>
styles-v21.xml
<resources>
<style name="MyMaterialTheme" parent="MyMaterialTheme.Base">
<item name="android:windowContentTransitions">true</item>
<item name="android:windowAllowEnterTransitionOverlap">true</item>
<item name="android:windowAllowReturnTransitionOverlap">true</item>
<item name="android:windowSharedElementEnterTransition">#android:transition/move</item>
<item name="android:windowSharedElementExitTransition">#android:transition/move</item>
</style>
And here is my screen while running app:
via GIPHY
I want to achieve simple shadow effectt that is not hiding under tablayout to seperate from the rest of the content. I'm testing it on my phone with android 6.0.1

I've found a solution to my problem. I have created Relative layout with view inside that imitates shadow. Adding this line of code after TabLayout and before end of AppBarLayout solved everything.
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_anchor="#id/tabs"
app:layout_anchorGravity="bottom"
android:background="#android:color/white">
<View
android:layout_width="match_parent"
android:layout_height="4dp"
android:layout_alignParentBottom="true"
android:background="#drawable/tablayout_shadow"
/>
</RelativeLayout>
And here is full code of main_activity.xml
<android.support.design.widget.CoordinatorLayout 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:background="#android:color/white"
android:clipToPadding="false">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar_material_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/toolbar1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways|enterAlwaysCollapsed" >
<ImageView
android:id="#+id/header"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/background_portrait"
android:fitsSystemWindows="true"
android:scaleType="centerCrop"
app:layout_collapseMode="parallax" />
</android.support.design.widget.CollapsingToolbarLayout>
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabGravity="fill"
android:elevation="20dp"
app:tabTextAppearance="#style/MineCustomTabText"
/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_anchor="#id/tabs"
app:layout_anchorGravity="bottom"
android:background="#android:color/white">
<View
android:layout_width="match_parent"
android:layout_height="4dp"
android:layout_alignParentBottom="true"
android:background="#drawable/toolbar_shadow"
/>
</RelativeLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
/>
tablayout_shadow.xml
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<gradient
android:startColor="#android:color/transparent"
android:endColor="#88333333"
android:angle="90"/>
Finally after 2 days of brainstorming i solved it:D. I hope this will help someone in future.

Status bar turns white when using custom Toolbar

I'm using NavigationView with a Toolbar. Status bar's background is white. If you have any questions just comment it before downvoting I'll look at them asap.
activity_main.xml
<android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<include
layout="#layout/app_bar_main"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<FrameLayout
android:id="#+id/flContent"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
<android.support.design.widget.NavigationView
android:id="#+id/nvView"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:background="#android:color/white"
app:headerLayout="#layout/nav_header_main"
app:menu="#menu/activity_main_drawer/>
</android.support.v4.widget.DrawerLayout>
app_bar_main.xml
<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_height="wrap_content"
android:layout_width="match_parent"
android:fitsSystemWindows="true"
android:minHeight="?attr/actionBarSize"
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
android:background="?attr/colorPrimaryDark">
</android.support.v7.widget.Toolbar>
styles.xml
<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/colorPrimaryDark</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" />
colors.xml
<resources>
<color name="colorPrimary">#3F51B5</color>
<color name="colorPrimaryDark">#303F9F</color>
<color name="colorAccent">#FF4081</color>
</resources>

You must add this attribute android:fitsSystemWindows="true" in parent (DrawerLayout). To fix the white status bar while using it.
To know more about it refer this link Why would I want to fitsSystemWindows?
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/drawer"
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">
<include
android:id="#+id/toolbar"
layout="#layout/tool_bar" />
<FrameLayout
android:id="#+id/Holder"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
<android.support.design.widget.NavigationView
android:id="#+id/navigation"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="start"
app:headerLayout="#layout/navigation_header"
app:itemTextColor="#color/primary_dark"
app:menu="#menu/my_navigation_items" />

Delete blue line in View android API 16

I need delete a blue line that appears in my application when I compile with API 20 or higher but doesn't appear when I compile in API < 20.
This image shows the blue line I need delete.
that is mi code view XML
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_marginBottom="10dp"
android:layout_marginTop="0dp"
android:background="#color/transparent"
android:layout_height="280dp" >
<net.simonvt.numberpicker.NumberPicker
android:textAppearance="?android:attr/textAppearanceMedium"
android:textColor="?android:attr/textColorPrimary"
android:id="#+id/numberPicker1_popup"
android:singleLine="true"
android:background="#null"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:configChanges="keyboard|keyboardHidden"
android:layout_centerVertical="true"
android:layout_alignLeft="#+id/title_picker"
android:layout_alignStart="#+id/title_picker"
android:layout_alignRight="#+id/title_picker"
android:layout_alignEnd="#+id/title_picker" />
<Button
android:layout_width="50dp"
android:layout_height="50dp"
android:text=""
android:id="#+id/button_cancel"
android:layout_below="#+id/numberPicker1"
android:layout_alignParentLeft="true"
android:layout_marginLeft="15dp"
android:layout_alignParentStart="false"
android:background="#drawable/big_cancel"/>
<Button
android:layout_width="50dp"
android:layout_height="50dp"
android:id="#+id/button_ok"
android:layout_alignTop="#+id/button_cancel"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:layout_marginRight="15dp"
android:background="#drawable/big_ok_line_green"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="40dp"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Title"
android:id="#+id/title_picker"
android:layout_marginTop="0dp"
android:layout_alignLeft="#+id/button_cancel"
android:layout_alignStart="#+id/button_cancel"
android:layout_alignRight="#+id/button_ok"
android:layout_alignEnd="#+id/button_ok"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="false"
android:textAlignment="center"
android:textColor="#000000"/>
</RelativeLayout>
and this is my style
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="numberPickerStyle">#style/NPWidget.Holo.Light.NumberPicker</item>
<item name="android:typeface">monospace</item>
</style>
<style name="AppTheme.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
<style name="AppTheme.NowindowTitle">
<item name="windowActionBar">false</item>
<item name="android:windowNoTitle">true</item>
</style>
thanks for helpme

You need to customize your view appearance by setting background , etc if you want to remove that blue line . Because that is the default appearance for that platform (which I guess is started since Honeycomb).