From 589365ef7caddb7c6228769c2f9ef15348881ca8 Mon Sep 17 00:00:00 2001
From: Arnaud Vergnet <80701113+arnaudvergnet@users.noreply.github.com>
Date: Thu, 7 Apr 2022 20:09:22 +0200
Subject: [PATCH] [android] Migrate nav menu to bottom sheet behavior (#2258)

* [android] Migrate nav menu to bottom sheet behavior

Signed-off-by: Arnaud Vergnet <arnaud.vergnet@mailo.com>

* [android] Improve bottom sheet style

Signed-off-by: Arnaud Vergnet <arnaud.vergnet@mailo.com>

* [android] Add background dim to nav menu

Signed-off-by: Arnaud Vergnet <arnaud.vergnet@mailo.com>

* [android] Collapse nav menu on back press

Signed-off-by: Arnaud Vergnet <arnaud.vergnet@mailo.com>

* [android] Allow clicking on nav menu to toggle its state

Signed-off-by: Arnaud Vergnet <arnaud.vergnet@mailo.com>

* [android] Improve nav menu layout

Signed-off-by: Arnaud Vergnet <arnaud.vergnet@mailo.com>

* [android] Refactor main menu

Signed-off-by: Arnaud Vergnet <arnaud.vergnet@mailo.com>

* [android] Improve nav menu font scaling behavior

Signed-off-by: Arnaud Vergnet <arnaud.vergnet@mailo.com>
---
 .../res/drawable-v21/menu_button_right.xml    |  10 -
 android/res/drawable/bottom_sheet_handle.xml  |   6 +
 android/res/drawable/ic_menu_close.xml        |  15 -
 android/res/drawable/menu_button_right.xml    |   4 -
 android/res/layout-land/layout_nav.xml        |  39 ++
 .../layout-land/layout_nav_bottom_numbers.xml | 148 -------
 android/res/layout-land/layout_nav_search.xml |   2 +-
 .../layout-land/map_navigation_buttons.xml    |   2 +-
 android/res/layout/activity_map.xml           |   1 -
 android/res/layout/bottom_sheet_handle.xml    |  15 +
 android/res/layout/layout_nav.xml             |  37 +-
 android/res/layout/layout_nav_bottom.xml      | 102 ++---
 .../res/layout/layout_nav_bottom_numbers.xml  | 262 ++++++------
 android/res/layout/menu.xml                   |  58 +--
 android/res/layout/menu_buttons_line.xml      |  31 +-
 android/res/layout/menu_news_marker.xml       |  12 -
 android/res/values-land/dimens.xml            |   2 -
 android/res/values-sw720dp-land/dimens.xml    |   1 -
 android/res/values-sw720dp/dimens.xml         |   3 -
 android/res/values/colors.xml                 |   2 -
 android/res/values/dimens.xml                 |   9 +-
 android/res/values/font_sizes.xml             |   2 +
 android/res/values/styles-menu.xml            |  11 -
 android/res/values/styles-text.xml            |  31 +-
 android/res/values/styles.xml                 |  16 +
 android/res/values/themes-attrs.xml           |   1 -
 android/res/values/themes-base.xml            |   6 +-
 android/res/values/themes.xml                 |   8 -
 .../src/com/mapswithme/maps/MwmActivity.java  | 222 ++++------
 .../maps/routing/NavigationController.java    | 235 +++-------
 .../mapswithme/maps/widget/menu/BaseMenu.java | 100 -----
 .../mapswithme/maps/widget/menu/MainMenu.java | 255 ++---------
 .../maps/widget/menu/MenuToggle.java          |  85 ----
 .../mapswithme/maps/widget/menu/NavMenu.java  | 401 ++++++++----------
 .../bottomsheet/MenuBottomSheetFragment.java  |   4 +-
 35 files changed, 698 insertions(+), 1440 deletions(-)
 delete mode 100644 android/res/drawable-v21/menu_button_right.xml
 create mode 100644 android/res/drawable/bottom_sheet_handle.xml
 delete mode 100644 android/res/drawable/ic_menu_close.xml
 delete mode 100644 android/res/drawable/menu_button_right.xml
 create mode 100644 android/res/layout-land/layout_nav.xml
 delete mode 100644 android/res/layout-land/layout_nav_bottom_numbers.xml
 create mode 100644 android/res/layout/bottom_sheet_handle.xml
 delete mode 100644 android/res/layout/menu_news_marker.xml
 delete mode 100644 android/src/com/mapswithme/maps/widget/menu/BaseMenu.java
 delete mode 100644 android/src/com/mapswithme/maps/widget/menu/MenuToggle.java

diff --git a/android/res/drawable-v21/menu_button_right.xml b/android/res/drawable-v21/menu_button_right.xml
deleted file mode 100644
index 200c32466f..0000000000
--- a/android/res/drawable-v21/menu_button_right.xml
+++ /dev/null
@@ -1,10 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<ripple xmlns:android="http://schemas.android.com/apk/res/android"
-        android:color="?android:attr/colorControlHighlight">
-  <item android:id="@android:id/mask">
-    <inset android:drawable="@drawable/menu_button_circle"
-           android:insetTop="@dimen/menu_line_button_inset_top"
-           android:insetBottom="@dimen/menu_line_button_inset_top"
-           android:insetRight="@dimen/menu_line_button_inset_edge"/>
-  </item>
-</ripple>
\ No newline at end of file
diff --git a/android/res/drawable/bottom_sheet_handle.xml b/android/res/drawable/bottom_sheet_handle.xml
new file mode 100644
index 0000000000..4018125665
--- /dev/null
+++ b/android/res/drawable/bottom_sheet_handle.xml
@@ -0,0 +1,6 @@
+<shape xmlns:android="http://schemas.android.com/apk/res/android"
+  android:shape="rectangle">
+    <solid android:color="#fff" />
+    <corners android:radius="2dp" />
+    <size android:width="24dp" android:height="4dp" />
+</shape>
diff --git a/android/res/drawable/ic_menu_close.xml b/android/res/drawable/ic_menu_close.xml
deleted file mode 100644
index 56f97bd469..0000000000
--- a/android/res/drawable/ic_menu_close.xml
+++ /dev/null
@@ -1,15 +0,0 @@
-<vector xmlns:android="http://schemas.android.com/apk/res/android"
-    android:width="48dp"
-    android:height="48dp"
-    android:viewportWidth="48"
-    android:viewportHeight="48">
-    <group
-        android:pivotX="24"
-        android:pivotY="24"
-        android:scaleX="0.75"
-        android:scaleY="0.75">
-        <path
-            android:fillColor="#fff"
-            android:pathData="M30.83,14.83l-2.83,-2.83 -12,12 12,12 2.83,-2.83 -9.17,-9.17Z" />
-    </group>
-</vector>
diff --git a/android/res/drawable/menu_button_right.xml b/android/res/drawable/menu_button_right.xml
deleted file mode 100644
index 7f6bd90201..0000000000
--- a/android/res/drawable/menu_button_right.xml
+++ /dev/null
@@ -1,4 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<selector xmlns:android="http://schemas.android.com/apk/res/android">
-  <item android:drawable="@drawable/menu_button"/>
-</selector>
diff --git a/android/res/layout-land/layout_nav.xml b/android/res/layout-land/layout_nav.xml
new file mode 100644
index 0000000000..7f1c6fbb89
--- /dev/null
+++ b/android/res/layout-land/layout_nav.xml
@@ -0,0 +1,39 @@
+<?xml version="1.0" encoding="utf-8"?>
+<FrameLayout 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/navigation_frame"
+  android:layout_width="match_parent"
+  android:layout_height="match_parent">
+
+  <include layout="@layout/layout_nav_top" />
+
+  <androidx.coordinatorlayout.widget.CoordinatorLayout
+    android:id="@+id/nav_bottom_sheet_coordinator"
+    android:layout_width="match_parent"
+    android:layout_height="match_parent">
+
+    <View
+      android:id="@+id/nav_bottom_sheet_background"
+      android:layout_width="match_parent"
+      android:layout_height="match_parent"
+      android:background="#99000000"
+      android:clickable="true"
+      android:focusable="true"
+      android:visibility="gone"
+      tools:visibility="visible" />
+
+    <FrameLayout
+      android:id="@+id/nav_bottom_sheet"
+      style="?attr/bottomSheetStyle"
+      android:layout_width="@dimen/nav_menu_landscape_width"
+      android:layout_height="wrap_content"
+      android:layout_gravity="start"
+      app:layout_behavior="com.google.android.material.bottomsheet.BottomSheetBehavior">
+
+      <include layout="@layout/layout_nav_bottom" />
+    </FrameLayout>
+
+  </androidx.coordinatorlayout.widget.CoordinatorLayout>
+
+</FrameLayout>
diff --git a/android/res/layout-land/layout_nav_bottom_numbers.xml b/android/res/layout-land/layout_nav_bottom_numbers.xml
deleted file mode 100644
index 4865cf5f39..0000000000
--- a/android/res/layout-land/layout_nav_bottom_numbers.xml
+++ /dev/null
@@ -1,148 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<RelativeLayout
-  xmlns:android="http://schemas.android.com/apk/res/android"
-  xmlns:tools="http://schemas.android.com/tools"
-  android:layout_width="match_parent"
-  android:layout_height="wrap_content"
-  android:orientation="horizontal"
-  android:paddingStart="@dimen/nav_numbers_margin"
-  android:layout_marginEnd="@dimen/nav_toggle"
-  android:background="?clickableBackground"
-  tools:background="#3000FF00"
-  tools:ignore="RtlSymmetry">
-  <!-- Speed -->
-  <LinearLayout
-    android:id="@+id/speed_view_container"
-    android:layout_width="wrap_content"
-    android:layout_height="wrap_content"
-    android:minWidth="@dimen/nav_numbers_side_min_width"
-    android:orientation="horizontal"
-    android:paddingStart="@dimen/nav_numbers_margin"
-    android:paddingEnd="@dimen/nav_numbers_margin"
-    android:paddingTop="@dimen/margin_eighth"
-    android:gravity="center_horizontal"
-    android:background="@drawable/speed_cams_bg"
-    tools:background="@drawable/speed_cams_bg">
-    <TextView
-      android:id="@+id/speed_value"
-      android:layout_width="wrap_content"
-      android:layout_height="wrap_content"
-      android:singleLine="true"
-      android:textAppearance="@style/MwmTextAppearance.RoutingNumber.Navigation"
-      tools:text="999"/>
-    <TextView
-      android:id="@+id/speed_dimen"
-      android:layout_width="wrap_content"
-      android:layout_height="wrap_content"
-      android:singleLine="true"
-      android:textAppearance="@style/MwmTextAppearance.RoutingDimension"
-      tools:text="km/h"/>
-  </LinearLayout>
-
-  <!-- Time -->
-  <RelativeLayout
-    android:id="@+id/time_frame"
-    android:layout_width="wrap_content"
-    android:layout_height="wrap_content"
-    android:layout_centerHorizontal="true"
-    android:minWidth="@dimen/nav_numbers_center_min_width"
-    android:paddingTop="@dimen/margin_eighth"
-    tools:background="#20FF0000">
-    <LinearLayout
-      android:id="@+id/time_values_container"
-      android:layout_width="wrap_content"
-      android:layout_height="wrap_content"
-      android:layout_centerHorizontal="true"
-      android:orientation="horizontal"
-      android:layout_gravity="center_horizontal"
-      android:gravity="bottom">
-      <TextView
-        android:id="@+id/time_hour_value"
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        android:singleLine="true"
-        android:textAppearance="@style/MwmTextAppearance.RoutingNumber.Navigation"
-        tools:text="999"/>
-
-      <TextView
-        android:id="@+id/time_hour_dimen"
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        android:layout_marginEnd="@dimen/margin_quarter"
-        android:singleLine="true"
-        android:textAppearance="@style/MwmTextAppearance.RoutingDimension"
-        tools:text="h"/>
-
-      <TextView
-        android:id="@+id/time_minute_value"
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        android:singleLine="true"
-        android:textAppearance="@style/MwmTextAppearance.RoutingNumber.Navigation"
-        tools:text="99"/>
-
-      <TextView
-        android:id="@+id/time_minute_dimen"
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        android:singleLine="true"
-        android:textAppearance="@style/MwmTextAppearance.RoutingDimension"
-        tools:text="m"/>
-    </LinearLayout>
-
-    <LinearLayout
-      android:layout_below="@id/time_values_container"
-      android:layout_width="wrap_content"
-      android:layout_height="wrap_content"
-      android:layout_centerHorizontal="true"
-      android:theme="?navigationTheme"
-      android:layout_marginBottom="4dp"
-      android:layout_gravity="center_horizontal"
-      android:orientation="horizontal">
-      <ImageView
-        android:id="@+id/dot_left"
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        android:layout_marginEnd="@dimen/margin_half"
-        android:src="?newsMarker"
-        tools:ignore="ContentDescription" />
-
-      <ImageView
-        android:id="@+id/dot_estimate"
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        android:src="?newsMarker"
-        tools:ignore="ContentDescription" />
-    </LinearLayout>
-  </RelativeLayout>
-
-  <!-- Distance -->
-  <LinearLayout
-    android:id="@+id/distance_frame"
-    android:layout_width="wrap_content"
-    android:layout_height="wrap_content"
-    android:layout_alignParentEnd="true"
-    android:minWidth="@dimen/nav_numbers_side_min_width"
-    android:orientation="horizontal"
-    android:paddingStart="@dimen/nav_numbers_margin"
-    android:paddingEnd="@dimen/nav_numbers_margin"
-    android:paddingTop="@dimen/margin_eighth"
-    android:gravity="center_horizontal"
-    tools:background="#20FF0000">
-    <TextView
-      android:id="@+id/distance_value"
-      android:layout_width="wrap_content"
-      android:layout_height="wrap_content"
-      android:singleLine="true"
-      android:textAppearance="@style/MwmTextAppearance.RoutingNumber.Navigation"
-      tools:text="99999"/>
-
-    <TextView
-      android:id="@+id/distance_dimen"
-      android:layout_width="wrap_content"
-      android:layout_height="wrap_content"
-      android:singleLine="true"
-      android:textAppearance="@style/MwmTextAppearance.RoutingDimension"
-      tools:text="km"/>
-  </LinearLayout>
-</RelativeLayout>
diff --git a/android/res/layout-land/layout_nav_search.xml b/android/res/layout-land/layout_nav_search.xml
index a5971a6efa..f42a08c569 100644
--- a/android/res/layout-land/layout_nav_search.xml
+++ b/android/res/layout-land/layout_nav_search.xml
@@ -6,7 +6,7 @@
   android:layout_width="match_parent"
   android:layout_height="match_parent"
   android:theme="?navButtonsTheme"
-  android:layout_marginBottom="@dimen/nav_menu_height"
+  android:layout_marginBottom="@dimen/nav_numbers_height"
   android:padding="@dimen/nav_frame_padding"
   android:layoutDirection="ltr"
   tools:background="@color/bg_primary">
diff --git a/android/res/layout-land/map_navigation_buttons.xml b/android/res/layout-land/map_navigation_buttons.xml
index 187b5bdaf4..f0d5ccdc10 100644
--- a/android/res/layout-land/map_navigation_buttons.xml
+++ b/android/res/layout-land/map_navigation_buttons.xml
@@ -4,7 +4,7 @@
   xmlns:tools="http://schemas.android.com/tools"
   android:layout_width="match_parent"
   android:layout_height="match_parent"
-  android:layout_marginBottom="@dimen/nav_menu_height"
+  android:layout_marginBottom="@dimen/menu_line_height"
   android:layoutDirection="ltr"
   android:padding="@dimen/nav_frame_padding"
   android:theme="?navButtonsTheme">
diff --git a/android/res/layout/activity_map.xml b/android/res/layout/activity_map.xml
index e4bf79969f..249bab0cde 100644
--- a/android/res/layout/activity_map.xml
+++ b/android/res/layout/activity_map.xml
@@ -55,7 +55,6 @@
     android:visibility="invisible"/>
 
   <include
-    android:id="@+id/menu_frame"
     layout="@layout/menu"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
diff --git a/android/res/layout/bottom_sheet_handle.xml b/android/res/layout/bottom_sheet_handle.xml
new file mode 100644
index 0000000000..09755bb88f
--- /dev/null
+++ b/android/res/layout/bottom_sheet_handle.xml
@@ -0,0 +1,15 @@
+<?xml version="1.0" encoding="utf-8"?>
+<RelativeLayout 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">
+
+  <ImageView
+    android:layout_width="match_parent"
+    android:layout_height="4dp"
+    android:layout_marginTop="@dimen/margin_quarter"
+    android:layout_marginBottom="@dimen/margin_eighth"
+    android:src="@drawable/bottom_sheet_handle"
+    app:tint="?colorControlHighlight" />
+
+</RelativeLayout>
\ No newline at end of file
diff --git a/android/res/layout/layout_nav.xml b/android/res/layout/layout_nav.xml
index 0e79aad621..5b28d2ec59 100644
--- a/android/res/layout/layout_nav.xml
+++ b/android/res/layout/layout_nav.xml
@@ -1,13 +1,38 @@
 <?xml version="1.0" encoding="utf-8"?>
-<FrameLayout
-  xmlns:android="http://schemas.android.com/apk/res/android"
+<FrameLayout 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/navigation_frame"
   android:layout_width="match_parent"
-  android:layout_height="match_parent"
-  tools:showIn="@layout/activity_map">
+  android:layout_height="match_parent">
 
-  <include layout="@layout/layout_nav_top"/>
+  <include layout="@layout/layout_nav_top" />
+
+  <androidx.coordinatorlayout.widget.CoordinatorLayout
+    android:id="@+id/nav_bottom_sheet_coordinator"
+    android:layout_width="match_parent"
+    android:layout_height="match_parent">
+
+    <View
+      android:id="@+id/nav_bottom_sheet_background"
+      android:layout_width="match_parent"
+      android:layout_height="match_parent"
+      android:background="#99000000"
+      android:clickable="true"
+      android:focusable="true"
+      android:visibility="gone"
+      tools:visibility="visible" />
+
+    <FrameLayout
+      android:id="@+id/nav_bottom_sheet"
+      style="?attr/bottomSheetStyle"
+      android:layout_width="match_parent"
+      android:layout_height="wrap_content"
+      app:layout_behavior="com.google.android.material.bottomsheet.BottomSheetBehavior">
+
+      <include layout="@layout/layout_nav_bottom" />
+    </FrameLayout>
+
+  </androidx.coordinatorlayout.widget.CoordinatorLayout>
 
-  <include layout="@layout/layout_nav_bottom"/>
 </FrameLayout>
diff --git a/android/res/layout/layout_nav_bottom.xml b/android/res/layout/layout_nav_bottom.xml
index fd93930ebe..2e08ad8aa7 100644
--- a/android/res/layout/layout_nav_bottom.xml
+++ b/android/res/layout/layout_nav_bottom.xml
@@ -1,105 +1,77 @@
 <?xml version="1.0" encoding="utf-8"?>
-<LinearLayout
-  xmlns:android="http://schemas.android.com/apk/res/android"
+<LinearLayout 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/nav_bottom_frame"
   android:layout_width="match_parent"
   android:layout_height="wrap_content"
   android:orientation="vertical"
-  android:layout_gravity="bottom"
-  android:clickable="true"
-  android:visibility="invisible"
-  android:background="?menuBackgroundOpen"
-  tools:visibility="visible"
   tools:showIn="@layout/layout_nav">
 
-  <FrameLayout
+  <LinearLayout
     android:id="@+id/line_frame"
-    android:layout_width="match_parent"
-    android:layout_height="wrap_content">
-    <include layout="@layout/layout_nav_bottom_numbers"/>
-
-    <ImageView
-      android:id="@+id/toggle"
-      android:layout_width="@dimen/nav_menu_height"
-      android:layout_height="@dimen/nav_menu_height"
-      android:layout_gravity="end|center_vertical"
-      android:background="?clickableBackground"
-      android:scaleType="center"
-      app:tint="?iconTint"
-      tools:src="@drawable/ic_menu_close"/>
-  </FrameLayout>
-
-  <com.mapswithme.maps.widget.FlatProgressView
-    android:id="@+id/navigation_progress"
+    android:gravity="center_vertical"
+    android:orientation="vertical"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
-    app:headRadius="@dimen/nav_progress_head"
-    app:progressColor="?colorAccent"
-    app:headColor="?colorAccent"
-    app:progressThickness="@dimen/nav_progress"
-    app:secondaryProgressColor="@color/bg_routing_progress"
-    app:secondaryProgressThickness="@dimen/nav_progress"/>
+    android:clickable="true"
+    android:focusable="true">
+
+    <include layout="@layout/bottom_sheet_handle" />
+    <include layout="@layout/layout_nav_bottom_numbers" />
+
+    <com.mapswithme.maps.widget.FlatProgressView
+      android:id="@+id/navigation_progress"
+      android:layout_width="match_parent"
+      android:layout_height="wrap_content"
+      app:headColor="?colorAccent"
+      app:headRadius="@dimen/nav_progress_head"
+      app:progressColor="?colorAccent"
+      app:progressThickness="@dimen/nav_progress"
+      app:secondaryProgressColor="@color/bg_routing_progress"
+      app:secondaryProgressThickness="@dimen/nav_progress" />
+  </LinearLayout>
 
   <LinearLayout
     android:id="@+id/content_frame"
     android:layout_width="match_parent"
     android:layout_height="@dimen/nav_menu_content_height"
+    android:gravity="center_vertical"
+    android:orientation="horizontal"
     android:paddingStart="@dimen/nav_bottom_gap"
     android:paddingEnd="@dimen/nav_bottom_gap"
-    android:orientation="horizontal"
-    android:gravity="center_vertical"
     tools:background="#300000FF">
 
     <ImageView
       android:id="@+id/tts_volume"
-      android:layout_weight="0.2"
       android:layout_width="0dp"
       android:layout_height="@dimen/nav_icon_size"
-      android:scaleType="center"
-      android:src="@drawable/ic_voice_on"
-      android:background="?selectableItemBackgroundBorderless"/>
-
-    <ImageView
-      android:id="@+id/subway"
       android:layout_weight="0.2"
-      android:layout_width="0dp"
-      android:layout_height="@dimen/nav_icon_size"
+      android:background="?selectableItemBackgroundBorderless"
       android:scaleType="center"
-      android:visibility="gone"
-      android:background="?attr/nav_bg_subway"/>
-
-    <ImageView
-      android:id="@+id/isolines"
-      android:layout_weight="0.2"
-      android:layout_width="0dp"
-      android:layout_height="@dimen/nav_icon_size"
-      android:scaleType="center"
-      android:visibility="gone"
-      android:background="?nav_bg_isolines"/>
+      android:src="@drawable/ic_voice_on" />
 
     <ImageView
       android:id="@+id/settings"
-      android:layout_weight="0.2"
       android:layout_width="0dp"
       android:layout_height="@dimen/nav_icon_size"
       android:layout_marginEnd="@dimen/nav_bottom_gap"
+      android:layout_weight="0.2"
+      android:background="?selectableItemBackgroundBorderless"
       android:scaleType="center"
       android:src="@drawable/ic_menu_settings"
-      android:background="?selectableItemBackgroundBorderless"
       app:tint="?iconTint" />
 
     <Button
-        android:id="@+id/stop"
-        android:layout_weight="0.4"
-        android:layout_width="0dp"
-        android:minWidth="@dimen/start_button_width"
-        android:layout_height="@dimen/nav_button_height"
-        android:background="?redButtonBackground"
-        android:text="@string/current_location_unknown_stop_button"
-        android:fontFamily="@string/robotoMedium"
-        android:textAppearance="@style/MwmTextAppearance.Button.Red"
-        tools:ignore="UnusedAttribute"/>
+      android:id="@+id/stop"
+      android:layout_width="0dp"
+      android:layout_height="@dimen/nav_button_height"
+      android:layout_weight="0.4"
+      android:background="?redButtonBackground"
+      android:fontFamily="@string/robotoMedium"
+      android:minWidth="@dimen/start_button_width"
+      android:text="@string/current_location_unknown_stop_button"
+      android:textAppearance="@style/MwmTextAppearance.Button.Red"
+      tools:ignore="UnusedAttribute" />
   </LinearLayout>
 </LinearLayout>
diff --git a/android/res/layout/layout_nav_bottom_numbers.xml b/android/res/layout/layout_nav_bottom_numbers.xml
index 6c4474377a..5434b77e19 100644
--- a/android/res/layout/layout_nav_bottom_numbers.xml
+++ b/android/res/layout/layout_nav_bottom_numbers.xml
@@ -1,165 +1,149 @@
 <?xml version="1.0" encoding="utf-8"?>
-<LinearLayout
-  xmlns:android="http://schemas.android.com/apk/res/android"
+<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
   xmlns:tools="http://schemas.android.com/tools"
   android:layout_width="match_parent"
-  android:layout_height="wrap_content"
-  android:orientation="vertical"
-  android:layout_marginEnd="@dimen/nav_toggle"
-  android:background="?clickableBackground"
+  android:layout_height="@dimen/nav_numbers_height"
+  android:gravity="center_vertical"
+  android:orientation="horizontal"
   tools:background="#3000FF00"
   tools:ignore="RtlSymmetry">
 
-  <LinearLayout
-    android:orientation="horizontal"
-    android:layout_width="match_parent"
-    android:layout_height="wrap_content">
+  <!-- Speed -->
+  <RelativeLayout
+    android:id="@+id/speed_view_container"
+    android:layout_width="0dp"
+    android:layout_height="match_parent"
+    android:layout_weight="1"
+    android:background="@drawable/speed_cams_bg"
+    android:gravity="center"
+    android:minWidth="@dimen/nav_numbers_side_min_width"
+    android:paddingStart="@dimen/nav_numbers_margin"
+    android:paddingEnd="@dimen/nav_numbers_margin">
+
+    <TextView
+      android:id="@+id/speed_value"
+      android:layout_width="wrap_content"
+      android:layout_height="wrap_content"
+      android:layout_centerHorizontal="true"
+      android:includeFontPadding="false"
+      android:lines="1"
+      android:textAppearance="@style/MwmTextAppearance.NavMenu.Number"
+      tools:text="999" />
+
     <!-- Speed -->
-    <RelativeLayout
-      android:id="@+id/speed_view_container"
-      android:layout_width="0dp"
-      android:layout_weight="1"
-      android:layout_height="match_parent"
-      android:background="@drawable/speed_cams_bg"
-      android:minWidth="@dimen/nav_numbers_side_min_width"
-      android:paddingBottom="@dimen/margin_eighth"
-      android:paddingTop="@dimen/margin_eighth"
-      android:paddingStart="@dimen/nav_numbers_margin"
-      android:paddingEnd="@dimen/nav_numbers_margin">
+    <TextView
+      android:id="@+id/speed_dimen"
+      android:layout_width="wrap_content"
+      android:layout_height="wrap_content"
+      android:layout_below="@id/speed_value"
+      android:layout_centerHorizontal="true"
+      android:includeFontPadding="false"
+      android:lines="1"
+      android:textAppearance="@style/MwmTextAppearance.NavMenu.Number.Dimension"
+      tools:background="#20FF0000"
+      tools:text="km/h" />
+  </RelativeLayout>
+
+  <!-- Time -->
+  <RelativeLayout
+    android:layout_width="0dp"
+    android:layout_height="match_parent"
+    android:layout_weight="1.5"
+    android:gravity="center"
+    android:minWidth="@dimen/nav_numbers_side_min_width"
+    android:paddingStart="@dimen/nav_numbers_margin"
+    android:paddingEnd="@dimen/nav_numbers_margin">
+
+    <LinearLayout
+      android:id="@+id/time_values_container"
+      android:layout_width="wrap_content"
+      android:layout_height="wrap_content"
+      android:layout_centerHorizontal="true"
+      tools:background="#20FF0000">
+
       <TextView
-        android:id="@+id/speed_value"
-        android:layout_centerHorizontal="true"
+        android:id="@+id/time_hour_value"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
-        android:lines="1"
         android:includeFontPadding="false"
-        android:textAppearance="@style/MwmTextAppearance.RoutingNumber.Navigation"
-        tools:text="999"/>
+        android:lines="1"
+        android:textAppearance="@style/MwmTextAppearance.NavMenu.Time"
+        tools:text="999" />
 
-      <!-- Speed -->
       <TextView
-        android:id="@+id/speed_dimen"
-        android:layout_below="@id/speed_value"
-        android:layout_centerHorizontal="true"
+        android:id="@+id/time_hour_dimen"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
-        android:lines="1"
+        android:layout_marginEnd="@dimen/margin_quarter"
         android:includeFontPadding="false"
-        android:textAppearance="@style/MwmTextAppearance.RoutingDimension"
-        tools:text="km/h"
-        tools:background="#20FF0000"/>
-    </RelativeLayout>
+        android:lines="1"
+        android:textAppearance="@style/MwmTextAppearance.NavMenu.Time.Dimension"
+        tools:text="h" />
 
-    <!-- Time -->
-    <RelativeLayout
-      android:layout_width="0dp"
-      android:layout_weight="1"
-      android:layout_height="match_parent"
-      android:minWidth="@dimen/nav_numbers_side_min_width"
-      android:paddingBottom="@dimen/margin_eighth"
-      android:paddingTop="@dimen/margin_eighth"
-      android:paddingStart="@dimen/nav_numbers_margin"
-      android:paddingEnd="@dimen/nav_numbers_margin">
-      <LinearLayout
-        android:id="@+id/time_values_container"
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        android:layout_centerHorizontal="true"
-        tools:background="#20FF0000">
-        <TextView
-          android:id="@+id/time_hour_value"
-          android:layout_width="wrap_content"
-          android:layout_height="wrap_content"
-          android:lines="1"
-          android:includeFontPadding="false"
-          android:textAppearance="@style/MwmTextAppearance.RoutingNumber.Navigation"
-          tools:text="999"/>
-
-        <TextView
-          android:id="@+id/time_hour_dimen"
-          android:layout_width="wrap_content"
-          android:layout_height="wrap_content"
-          android:layout_marginEnd="@dimen/margin_quarter"
-          android:lines="1"
-          android:includeFontPadding="false"
-          android:textAppearance="@style/MwmTextAppearance.RoutingDimension"
-          tools:text="h"/>
-        <TextView
-          android:id="@+id/time_minute_value"
-          android:layout_width="wrap_content"
-          android:layout_height="wrap_content"
-          android:lines="1"
-          android:includeFontPadding="false"
-          android:textAppearance="@style/MwmTextAppearance.RoutingNumber.Navigation"
-          tools:text="99"/>
-
-        <TextView
-          android:id="@+id/time_minute_dimen"
-          android:layout_width="wrap_content"
-          android:layout_height="wrap_content"
-          android:lines="1"
-          android:includeFontPadding="false"
-          android:textAppearance="@style/MwmTextAppearance.RoutingNumber"
-          tools:text="m"/>
-      </LinearLayout>
-
-      <LinearLayout
-        android:layout_below="@+id/time_values_container"
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        android:orientation="horizontal"
-        android:theme="?navigationTheme"
-        android:minWidth="@dimen/nav_numbers_center_min_width"
-        android:layout_centerHorizontal="true"
-        android:gravity="center"
-        tools:background="#20FF0000">
-        <ImageView
-          android:id="@+id/dot_left"
-          android:layout_width="wrap_content"
-          android:layout_height="wrap_content"
-          android:layout_marginEnd="@dimen/margin_half"
-          android:src="?newsMarker"
-          tools:ignore="ContentDescription" />
-        <ImageView
-          android:id="@+id/dot_estimate"
-          android:layout_width="wrap_content"
-          android:layout_height="wrap_content"
-          android:src="?newsMarker"
-          tools:ignore="ContentDescription" />
-      </LinearLayout>
-    </RelativeLayout>
-
-
-    <!-- Distance -->
-    <RelativeLayout
-      android:layout_width="0dp"
-      android:layout_weight="1"
-      android:layout_height="match_parent"
-      android:minWidth="@dimen/nav_numbers_side_min_width"
-      android:paddingBottom="@dimen/margin_eighth"
-      android:paddingTop="@dimen/margin_eighth"
-      android:paddingStart="@dimen/nav_numbers_margin"
-      android:paddingEnd="@dimen/nav_numbers_margin">
       <TextView
-        android:id="@+id/distance_value"
+        android:id="@+id/time_minute_value"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
-        android:layout_centerHorizontal="true"
-        android:lines="1"
         android:includeFontPadding="false"
-        android:textAppearance="@style/MwmTextAppearance.RoutingNumber.Navigation"
-        tools:text="99999"/>
+        android:lines="1"
+        android:textAlignment="center"
+        android:textAppearance="@style/MwmTextAppearance.NavMenu.Time"
+        tools:text="99" />
+
       <TextView
-        android:id="@+id/distance_dimen"
-        android:layout_below="@id/distance_value"
-        android:layout_centerHorizontal="true"
+        android:id="@+id/time_minute_dimen"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
-        android:lines="1"
         android:includeFontPadding="false"
-        android:textAppearance="@style/MwmTextAppearance.RoutingDimension"
-        tools:text="km"
-        tools:background="#20FF0000"/>
-    </RelativeLayout>
-  </LinearLayout>
+        android:lines="1"
+        android:textAppearance="@style/MwmTextAppearance.NavMenu.Time.Dimension"
+        tools:text="m" />
+    </LinearLayout>
+
+    <TextView
+      android:id="@+id/time_estimate"
+      android:layout_width="wrap_content"
+      android:layout_height="wrap_content"
+      android:layout_below="@+id/time_values_container"
+      android:layout_centerHorizontal="true"
+      android:includeFontPadding="false"
+      android:lines="1"
+      android:textAlignment="center"
+      android:textAppearance="@style/MwmTextAppearance.NavMenu.Number.Dimension"
+      tools:text="99:99 AM" />
+  </RelativeLayout>
+
+
+  <!-- Distance -->
+  <RelativeLayout
+    android:layout_width="0dp"
+    android:layout_height="match_parent"
+    android:layout_weight="1"
+    android:gravity="center"
+    android:minWidth="@dimen/nav_numbers_side_min_width"
+    android:paddingStart="@dimen/nav_numbers_margin"
+    android:paddingEnd="@dimen/nav_numbers_margin">
+
+    <TextView
+      android:id="@+id/distance_value"
+      android:layout_width="wrap_content"
+      android:layout_height="wrap_content"
+      android:layout_centerHorizontal="true"
+      android:includeFontPadding="false"
+      android:lines="1"
+      android:textAppearance="@style/MwmTextAppearance.NavMenu.Number"
+      tools:text="99999" />
+
+    <TextView
+      android:id="@+id/distance_dimen"
+      android:layout_width="wrap_content"
+      android:layout_height="wrap_content"
+      android:layout_below="@id/distance_value"
+      android:layout_centerHorizontal="true"
+      android:includeFontPadding="false"
+      android:lines="1"
+      android:textAppearance="@style/MwmTextAppearance.NavMenu.Number.Dimension"
+      tools:background="#20FF0000"
+      tools:text="km" />
+  </RelativeLayout>
 </LinearLayout>
diff --git a/android/res/layout/menu.xml b/android/res/layout/menu.xml
index 36c42eac1a..b2d745e286 100644
--- a/android/res/layout/menu.xml
+++ b/android/res/layout/menu.xml
@@ -1,46 +1,30 @@
 <?xml version="1.0" encoding="utf-8"?>
-<LinearLayout
-  xmlns:android="http://schemas.android.com/apk/res/android"
+<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
   xmlns:tools="http://schemas.android.com/tools"
-  android:orientation="vertical"
+  android:id="@+id/menu_frame"
   android:layout_width="match_parent"
   android:layout_height="wrap_content"
-  android:clickable="true"
+  android:background="?menuBackground"
   android:visibility="invisible"
   tools:visibility="visible">
-  <LinearLayout
-    android:layout_width="match_parent"
-    android:layout_height="wrap_content"
-    android:orientation="horizontal">
 
-    <FrameLayout
-      android:id="@+id/line_frame"
-      android:layout_width="match_parent"
-      android:layout_height="wrap_content">
+  <include
+    android:id="@+id/buttons_frame"
+    layout="@layout/menu_buttons_line" />
 
-      <ImageView
-        android:id="@+id/toggle"
-        style="@style/MwmTheme.Menu.Line.Button.Toggle"
-        tools:layout_marginTop="60dp"/>
+  <include
+    android:id="@+id/routing_plan_frame"
+    layout="@layout/menu_route_plan_line"
+    tools:layout_height="@dimen/menu_line_height"
+    tools:layout_marginTop="60dp"
+    tools:layout_width="match_parent" />
 
-      <include
-        android:id="@+id/buttons_frame"
-        layout="@layout/menu_buttons_line"/>
-
-      <include
-        android:id="@+id/routing_plan_frame"
-        layout="@layout/menu_route_plan_line"
-        tools:layout_width="match_parent"
-        tools:layout_height="@dimen/menu_line_height"
-        tools:layout_marginTop="60dp"/>
-
-      <include
-        android:id="@+id/routing_action_frame"
-        layout="@layout/routing_action_panel"
-        android:visibility="gone"
-        tools:layout_width="match_parent"
-        tools:layout_height="wrap_content"
-        tools:layout_marginTop="60dp"/>
-    </FrameLayout>
-  </LinearLayout>
-</LinearLayout>
+  <include
+    android:id="@+id/routing_action_frame"
+    layout="@layout/routing_action_panel"
+    android:visibility="gone"
+    tools:layout_height="wrap_content"
+    tools:layout_marginTop="120dp"
+    tools:layout_width="match_parent"
+    tools:visibility="visible" />
+</FrameLayout>
diff --git a/android/res/layout/menu_buttons_line.xml b/android/res/layout/menu_buttons_line.xml
index 8498017565..b26aec09c0 100644
--- a/android/res/layout/menu_buttons_line.xml
+++ b/android/res/layout/menu_buttons_line.xml
@@ -1,9 +1,10 @@
 <?xml version="1.0" encoding="utf-8"?>
-<FrameLayout
-  xmlns:android="http://schemas.android.com/apk/res/android"
+<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
   xmlns:tools="http://schemas.android.com/tools"
   android:layout_width="match_parent"
   android:layout_height="@dimen/menu_line_height"
+  android:paddingStart="@dimen/margin_half"
+  android:paddingEnd="@dimen/margin_half"
   tools:background="#40FF0000">
   <LinearLayout
     android:layout_width="match_parent"
@@ -43,17 +44,21 @@
       android:layout_height="match_parent"
       android:layout_weight="1"/>
 
-    <!-- Gap for menu open/close button -->
-    <View
-      android:id="@+id/menu"
-      android:layout_width="@dimen/menu_line_button_width_edge"
-      android:layout_height="match_parent"/>
+    <ImageView
+      android:id="@+id/toggle"
+      style="@style/MwmTheme.Menu.Line.Button"
+      android:src="@drawable/ic_menu_open"
+      android:tag="@string/tag_menu_collapse"/>
   </LinearLayout>
 
-  <FrameLayout
-    android:layout_width="@dimen/menu_line_button_width_edge"
-    android:layout_height="match_parent"
-    android:layout_gravity="end">
-    <include layout="@layout/menu_news_marker"/>
-  </FrameLayout>
+  <View
+    android:id="@+id/marker"
+    android:layout_width="10dp"
+    android:layout_height="10dp"
+    android:layout_gravity="end"
+    android:layout_marginTop="@dimen/margin_half"
+    android:layout_marginEnd="@dimen/margin_half"
+    android:background="@drawable/counter"
+    android:visibility="gone"
+    tools:visibility="visible"/>
 </FrameLayout>
diff --git a/android/res/layout/menu_news_marker.xml b/android/res/layout/menu_news_marker.xml
deleted file mode 100644
index a9fadc1189..0000000000
--- a/android/res/layout/menu_news_marker.xml
+++ /dev/null
@@ -1,12 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<View xmlns:android="http://schemas.android.com/apk/res/android"
-      xmlns:tools="http://schemas.android.com/tools"
-      android:id="@+id/marker"
-      android:layout_width="10dp"
-      android:layout_height="10dp"
-      android:layout_gravity="center"
-      android:layout_marginStart="10dp"
-      android:layout_marginBottom="8dp"
-      android:background="@drawable/counter"
-      android:visibility="gone"
-      tools:visibility="visible"/>
diff --git a/android/res/values-land/dimens.xml b/android/res/values-land/dimens.xml
index 60f80f4878..4cf2be24b3 100644
--- a/android/res/values-land/dimens.xml
+++ b/android/res/values-land/dimens.xml
@@ -7,10 +7,8 @@
   <dimen name="menu_line_button_width">88dp</dimen>
 
   <!-- Nav menu -->
-  <dimen name="nav_menu_height">36dp</dimen>
   <dimen name="nav_menu_content_height">48dp</dimen>
   <dimen name="nav_zoom_bottom">80dp</dimen>
-  <dimen name="nav_toggle_margin">16dp</dimen>
   <dimen name="nav_numbers_margin">16dp</dimen>
   <dimen name="nav_bottom_gap">24dp</dimen>
 
diff --git a/android/res/values-sw720dp-land/dimens.xml b/android/res/values-sw720dp-land/dimens.xml
index 844dfc1f1f..6c9866c195 100644
--- a/android/res/values-sw720dp-land/dimens.xml
+++ b/android/res/values-sw720dp-land/dimens.xml
@@ -1,7 +1,6 @@
 <?xml version="1.0" encoding="utf-8"?>
 <resources>
   <!-- Nav menu -->
-  <dimen name="nav_menu_height">40dp</dimen>
   <dimen name="nav_menu_content_height">64dp</dimen>
   <dimen name="nav_progress">8dp</dimen>
   <dimen name="nav_numbers_margin">32dp</dimen>
diff --git a/android/res/values-sw720dp/dimens.xml b/android/res/values-sw720dp/dimens.xml
index 595939a260..a33653442b 100644
--- a/android/res/values-sw720dp/dimens.xml
+++ b/android/res/values-sw720dp/dimens.xml
@@ -1,7 +1,6 @@
 <resources>
   <dimen name="dialog_max_height">600dp</dimen>
 
-  <dimen name="nav_menu_height">40dp</dimen>
   <dimen name="nav_menu_content_height">64dp</dimen>
   <dimen name="nav_street_height">56dp</dimen>
   <dimen name="nav_street_left">152dp</dimen>
@@ -14,8 +13,6 @@
 
   <dimen name="nav_frame_padding">@dimen/margin_base</dimen>
   <dimen name="nav_zoom_bottom">250dp</dimen>
-  <dimen name="nav_toggle_margin">16dp</dimen>
-  <dimen name="nav_numbers_margin">16dp</dimen>
   <dimen name="nav_menu_top_offset">-6dp</dimen>
 
   <!-- Altitude chart -->
diff --git a/android/res/values/colors.xml b/android/res/values/colors.xml
index 1ad80c4e92..83c45dc37a 100644
--- a/android/res/values/colors.xml
+++ b/android/res/values/colors.xml
@@ -85,8 +85,6 @@
 
   <color name="bg_menu">#CCFFFFFF</color>
   <color name="bg_menu_night">#CC2D3237</color>
-  <color name="bg_menu_open">#FFFFFFFF</color>
-  <color name="bg_menu_open_night">#FF2D3237</color>
 
   <color name="bg_statusbar">#197841</color>
   <color name="bg_statusbar_night">#14181C</color>
diff --git a/android/res/values/dimens.xml b/android/res/values/dimens.xml
index 14768d362c..e5f4beebcc 100644
--- a/android/res/values/dimens.xml
+++ b/android/res/values/dimens.xml
@@ -124,20 +124,19 @@
   <dimen name="nav_next_turn_space">6dp</dimen>
   <dimen name="nav_next_turn_sign">64dp</dimen>
   <dimen name="nav_next_next_turn_frame">32dp</dimen>
-  <dimen name="nav_menu_height">48dp</dimen>
-  <dimen name="nav_menu_content_height">64dp</dimen>
   <dimen name="nav_numbers_margin">8dp</dimen>
   <dimen name="nav_numbers_side_min_width">90dp</dimen>
   <dimen name="nav_numbers_center_min_width">130dp</dimen>
-  <dimen name="nav_progress">4dp</dimen>
+  <dimen name="nav_progress">4sp</dimen>
   <dimen name="nav_progress_head">2dp</dimen>
-  <dimen name="nav_toggle">40dp</dimen>
-  <dimen name="nav_toggle_margin">8dp</dimen>
   <dimen name="nav_button_width">200dp</dimen>
   <dimen name="nav_button_height">@dimen/primary_button_min_height</dimen>
   <dimen name="nav_icon_size">48dp</dimen>
   <dimen name="nav_bottom_gap">12dp</dimen>
   <dimen name="nav_menu_top_offset">0dp</dimen>
+  <dimen name="nav_numbers_height">54sp</dimen>
+  <dimen name="nav_menu_content_height">64dp</dimen>
+  <dimen name="nav_menu_landscape_width">360dp</dimen>
 
   <dimen name="nav_frame_padding">@dimen/margin_eighth</dimen>
   <dimen name="nav_button">28dp</dimen>
diff --git a/android/res/values/font_sizes.xml b/android/res/values/font_sizes.xml
index 841fb0dc23..da918e06cb 100644
--- a/android/res/values/font_sizes.xml
+++ b/android/res/values/font_sizes.xml
@@ -58,6 +58,8 @@
   <dimen name="text_size_nav_circle_exit">12sp</dimen>
   <dimen name="text_size_nav_number">24sp</dimen>
   <dimen name="text_size_nav_dimension">20sp</dimen>
+  <dimen name="text_size_nav_menu_number">28sp</dimen>
+  <dimen name="text_size_nav_menu_dimension">16sp</dimen>
 
   <dimen name="text_size_banner">8sp</dimen>
   <dimen name="terms_of_use_line_spacing">2sp</dimen>
diff --git a/android/res/values/styles-menu.xml b/android/res/values/styles-menu.xml
index 2512018dfc..7822007e1a 100644
--- a/android/res/values/styles-menu.xml
+++ b/android/res/values/styles-menu.xml
@@ -12,17 +12,6 @@
     <item name="android:tint">?iconTint</item>
   </style>
 
-  <style name="MwmTheme.Menu.Line.Button.Toggle">
-    <item name="android:layout_width">@dimen/menu_line_button_width_edge</item>
-    <item name="android:layout_height">@dimen/menu_line_height</item>
-    <item name="android:layout_gravity">end</item>
-    <item name="android:paddingStart">@dimen/margin_half_plus</item>
-    <item name="android:paddingEnd">@dimen/margin_half</item>
-    <item name="android:src">@drawable/ic_menu_close</item>
-    <item name="android:background">@drawable/menu_button_right</item>
-    <item name="android:tint">@null</item>
-  </style>
-
   <style name="MwmTheme.Menu.Content.ListItem"
          parent="MwmTextAppearance.Body1">
     <item name="android:layout_width">match_parent</item>
diff --git a/android/res/values/styles-text.xml b/android/res/values/styles-text.xml
index c1278a5488..3eb29202db 100644
--- a/android/res/values/styles-text.xml
+++ b/android/res/values/styles-text.xml
@@ -122,24 +122,27 @@
     <item name="android:textAllCaps">true</item>
   </style>
 
-  <style name="MwmTextAppearance.RoutingNumber">
-    <item name="android:textSize">@dimen/text_size_routing_number</item>
+  <style name="MwmTextAppearance.NavMenu">
+    <item name="android:textStyle">bold</item>
+  </style>
+
+  <style name="MwmTextAppearance.NavMenu.Time">
+    <item name="android:textSize">@dimen/text_size_nav_menu_number</item>
+    <item name="android:textColor">?colorAccent</item>
+  </style>
+
+  <style name="MwmTextAppearance.NavMenu.Time.Dimension">
+    <item name="android:textSize">@dimen/text_size_nav_menu_dimension</item>
+  </style>
+
+  <style name="MwmTextAppearance.NavMenu.Number">
+    <item name="android:textSize">@dimen/text_size_nav_menu_number</item>
     <item name="android:textColor">?android:textColorPrimary</item>
-    <item name="android:textStyle">bold</item>
   </style>
 
-  <style name="MwmTextAppearance.RoutingNumber.Navigation">
-    <item name="android:textSize">@dimen/text_size_nav_number</item>
-  </style>
-
-  <style name="MwmTextAppearance.RoutingDimension">
-    <item name="android:textSize">@dimen/text_size_routing_dimension</item>
+  <style name="MwmTextAppearance.NavMenu.Number.Dimension">
+    <item name="android:textSize">@dimen/text_size_nav_menu_dimension</item>
     <item name="android:textColor">?android:textColorSecondary</item>
-    <item name="android:textStyle">bold</item>
-  </style>
-
-  <style name="MwmTextAppearance.RoutingDimension.Inline" parent="MwmTextAppearance.RoutingNumber">
-    <item name="android:textSize">@dimen/text_size_routing_dimension_inline</item>
   </style>
 
   <style name="MwmTextAppearance.RoutingDetail">
diff --git a/android/res/values/styles.xml b/android/res/values/styles.xml
index 2bbac14f4d..f09478ac34 100644
--- a/android/res/values/styles.xml
+++ b/android/res/values/styles.xml
@@ -385,4 +385,20 @@
   <style name="TextAppearance.Large.Inverse" parent="MwmTextAppearance.Body1.Light">
     <item name="android:textSize">@dimen/text_size_toolbar</item>
   </style>
+
+  <style name="MwmWidget.BottomSheet" parent="Widget.Material3.BottomSheet.Modal">
+    <item name="android:background">?cardBackground</item>
+    <item name="backgroundTint">?cardBackground</item>
+    <item name="behavior_hideable">false</item>
+    <item name="shapeAppearance">@style/ShapeAppearance.Material3.LargeComponent</item>
+  </style>
+
+  <style name="MwmWidget.BottomSheetDialog" parent="Theme.Material3.Light.BottomSheetDialog">
+    <item name="colorSurface">?cardBackground</item>
+  </style>
+
+  <style name="MwmWidget.Night.BottomSheetDialog" parent="Theme.Material3.Dark.BottomSheetDialog" >
+    <item name="colorSurface">?cardBackground</item>
+  </style>
+
 </resources>
diff --git a/android/res/values/themes-attrs.xml b/android/res/values/themes-attrs.xml
index a0ce332a0e..7b13d7ff95 100644
--- a/android/res/values/themes-attrs.xml
+++ b/android/res/values/themes-attrs.xml
@@ -43,7 +43,6 @@
     <attr name="primaryButtonBackground" format="reference" />
     <attr name="circleAccent" format="reference" />
     <attr name="menuBackground" format="color" />
-    <attr name="menuBackgroundOpen" format="color" />
     <attr name="myPositionButtonAnimation" format="reference" />
     <attr name="wheelPendingAnimation" format="reference" />
     <attr name="trafficLoadingAnimation" format="reference" />
diff --git a/android/res/values/themes-base.xml b/android/res/values/themes-base.xml
index a934cfc62e..0c59926afc 100644
--- a/android/res/values/themes-base.xml
+++ b/android/res/values/themes-base.xml
@@ -71,7 +71,6 @@
     <item name="circleAccent">@drawable/circle_accent</item>
 
     <item name="menuBackground">@color/bg_menu</item>
-    <item name="menuBackgroundOpen">@color/bg_menu_open</item>
 
     <item name="myPositionButtonAnimation">@drawable/anim_myposition_pending</item>
     <item name="wheelPendingAnimation">@drawable/anim_spinner_pending</item>
@@ -175,6 +174,8 @@
     <item name="chipIconTintColor">@color/extended_green</item>
     <item name="chipTextColor">@color/bg_primary</item>
     <item name="android:popupMenuStyle">@style/PopupMenu</item>
+
+    <item name="bottomSheetStyle">@style/MwmWidget.BottomSheet</item>
   </style>
 
   <!-- Night theme -->
@@ -250,7 +251,6 @@
     <item name="circleAccent">@drawable/circle_accent_night</item>
 
     <item name="menuBackground">@color/bg_menu_night</item>
-    <item name="menuBackgroundOpen">@color/bg_menu_open_night</item>
 
     <item name="myPositionButtonAnimation">@drawable/anim_myposition_pending_night</item>
     <item name="wheelPendingAnimation">@drawable/anim_spinner_pending</item>
@@ -345,5 +345,7 @@
     <item name="chipIconTintColor">@color/white_lightest</item>
     <item name="chipTextColor">@color/white_secondary</item>
     <item name="android:popupMenuStyle">@style/PopupMenu.Dark</item>
+
+    <item name="bottomSheetStyle">@style/MwmWidget.BottomSheet</item>
   </style>
 </resources>
diff --git a/android/res/values/themes.xml b/android/res/values/themes.xml
index 548e9340a8..482183fabf 100644
--- a/android/res/values/themes.xml
+++ b/android/res/values/themes.xml
@@ -144,14 +144,6 @@
 
   <style name="MwmTheme.Editor"/>
 
-  <style name="MwmTheme.BottomSheetDialog" parent="Theme.Material3.Light.BottomSheetDialog">
-    <item name="colorSurface">@color/bg_cards</item>
-  </style>
-
-  <style name="MwmTheme.Night.BottomSheetDialog" parent="Theme.Material3.Dark.BottomSheetDialog" >
-    <item name="colorSurface">@color/bg_cards_night</item>
-  </style>
-
   <style name="MwmTheme.Downloader">
     <item name="status_done">@drawable/ic_downloader_done</item>
     <item name="status_downloadable">@drawable/ic_downloader_download</item>
diff --git a/android/src/com/mapswithme/maps/MwmActivity.java b/android/src/com/mapswithme/maps/MwmActivity.java
index 9e8410ec0c..1932b81ed2 100644
--- a/android/src/com/mapswithme/maps/MwmActivity.java
+++ b/android/src/com/mapswithme/maps/MwmActivity.java
@@ -82,7 +82,6 @@ import com.mapswithme.maps.settings.SettingsActivity;
 import com.mapswithme.maps.settings.StoragePathManager;
 import com.mapswithme.maps.settings.UnitLocale;
 import com.mapswithme.maps.sound.TtsPlayer;
-import com.mapswithme.maps.widget.menu.BaseMenu;
 import com.mapswithme.maps.widget.menu.MainMenu;
 import com.mapswithme.maps.widget.menu.MyPositionButton;
 import com.mapswithme.maps.widget.placepage.PlacePageController;
@@ -192,9 +191,6 @@ public class MwmActivity extends BaseMwmFragmentActivity
 
   private boolean mIsTabletLayout;
   private boolean mIsFullscreen;
-  private boolean mIsFullscreenAnimating;
-  private boolean mIsAppearMenuLater;
-
   @SuppressWarnings("NotNullFieldNotInitialized")
   @NonNull
   private FloatingSearchToolbarController mSearchController;
@@ -308,9 +304,16 @@ public class MwmActivity extends BaseMwmFragmentActivity
 
   private void showBookmarks()
   {
+    closeFloatingPanels();
     BookmarkCategoriesActivity.start(this);
   }
 
+  public void showHelp()
+  {
+    Intent intent = new Intent(getActivity(), HelpActivity.class);
+    startActivity(intent);
+  }
+
   public void showSearch(String query)
   {
     if (mIsTabletLayout)
@@ -481,7 +484,7 @@ public class MwmActivity extends BaseMwmFragmentActivity
       removeCurrentFragment(false);
     }
 
-    mNavigationController = new NavigationController(this);
+    mNavigationController = new NavigationController(this, v -> onSettingsOptionSelected(), v -> showBookmarks());
     //TrafficManager.INSTANCE.attach(mNavigationController);
 
     initMainMenu();
@@ -591,18 +594,18 @@ public class MwmActivity extends BaseMwmFragmentActivity
 
     View mLayersButton = frame.findViewById(R.id.layers_button);
 
-    mToggleMapLayerController = new MapLayersController(mLayersButton, this::toggleMapLayerMenu,this);
+    mToggleMapLayerController = new MapLayersController(mLayersButton, this::toggleMapLayerBottomSheet,this);
 
     mNavAnimationController = new NavigationButtonsAnimationController(
         zoomIn, zoomOut, myPosition, getWindow().getDecorView().getRootView(), this);
   }
-  private void toggleMapLayerMenu()
+  private void toggleMapLayerBottomSheet()
   {
-    if (!closeMapLayerMenu())
-      showMapLayerMenu();
+    if (!closeMapLayerBottomSheet())
+      showMapLayerBottomSheet();
   }
 
-  private boolean closeMapLayerMenu()
+  private boolean closeMapLayerBottomSheet()
   {
     if (!mLayersBottomSheet.isAdded())
       return false;
@@ -610,12 +613,12 @@ public class MwmActivity extends BaseMwmFragmentActivity
     return true;
   }
 
-  private void showMapLayerMenu()
+  private void showMapLayerBottomSheet()
   {
     mLayersBottomSheet.show(getSupportFragmentManager(), "layersBottomSheet");
   }
 
-  private boolean closeMainMenu()
+  private boolean closeMainMenuBottomSheet()
   {
     if (!mMainMenuBottomSheet.isAdded())
       return false;
@@ -623,7 +626,7 @@ public class MwmActivity extends BaseMwmFragmentActivity
     return true;
   }
 
-  private void showMainMenu()
+  private void showMainMenuBottomSheet()
   {
     mMainMenuBottomSheet = new MenuBottomSheetFragment(mToggleMapLayerFragment, getMainMenuItems());
     mMainMenuBottomSheet.show(getSupportFragmentManager(), "mainMenuBottomSheet");
@@ -641,6 +644,17 @@ public class MwmActivity extends BaseMwmFragmentActivity
     return true;
   }
 
+  /**
+   * @return False if the navigation menu was already collapsed or hidden, true otherwise
+   */
+  public boolean collapseNavMenu()
+  {
+    if (mNavigationController.isNavMenuCollapsed() || mNavigationController.isNavMenuHidden())
+      return false;
+    mNavigationController.collapseNavMenu();
+    return true;
+  }
+
   /**
    * @return False if the side panel was already closed, true otherwise
    */
@@ -714,8 +728,8 @@ public class MwmActivity extends BaseMwmFragmentActivity
 
   public void closeFloatingPanels()
   {
-    closeMainMenu();
-    closeMapLayerMenu();
+    closeMainMenuBottomSheet();
+    closeMapLayerBottomSheet();
     closePlacePage();
   }
 
@@ -740,7 +754,7 @@ public class MwmActivity extends BaseMwmFragmentActivity
 
   private void initMainMenu()
   {
-    mMainMenu = new MainMenu(findViewById(R.id.menu_frame), this::onItemClickOrSkipAnim);
+    mMainMenu = new MainMenu(findViewById(R.id.menu_frame), this::onMenuItemClick);
 
     if (mIsTabletLayout)
     {
@@ -748,12 +762,26 @@ public class MwmActivity extends BaseMwmFragmentActivity
     }
   }
 
-  private void onItemClickOrSkipAnim(@NonNull MainMenu.Item item)
+  private void onMenuItemClick(@NonNull MainMenu.Item item)
   {
-    if (mIsFullscreenAnimating)
-      return;
-
-    item.onClicked(this, item);
+    switch (item)
+    {
+      case HELP:
+        showHelp();
+        break;
+      case SEARCH:
+        RoutingController.get().cancel();
+        closeFloatingPanels();
+        showSearch(mSearchController.getQuery());
+        break;
+      case BOOKMARKS:
+        showBookmarks();
+        break;
+      case MENU:
+        closeFloatingPanels();
+        showMainMenuBottomSheet();
+        break;
+    }
   }
 
   private void initOnmapDownloader()
@@ -957,7 +985,7 @@ public class MwmActivity extends BaseMwmFragmentActivity
   {
     super.onResume();
     refreshSearchToolbar();
-    mMainMenu.onResume(null);
+    mMainMenu.onResume();
     if (Framework.nativeIsInChoosePositionMode())
     {
       UiUtils.show(mPositionChooser);
@@ -1044,9 +1072,10 @@ public class MwmActivity extends BaseMwmFragmentActivity
   public void onBackPressed()
   {
     RoutingController routingController = RoutingController.get();
-    if (!closeMainMenu() && !closeMapLayerMenu() && !closePlacePage() && !closeSearchToolbar(true, true) &&
-            !closeSidePanel() && !closePositionChooser() &&
-            !routingController.resetToPlanningStateIfNavigating() && !routingController.cancel())
+    if (!closeMainMenuBottomSheet() && !closeMapLayerBottomSheet() && !collapseNavMenu() &&
+        !closePlacePage() &&!closeSearchToolbar(true, true) &&
+        !closeSidePanel() && !closePositionChooser() &&
+        !routingController.resetToPlanningStateIfNavigating() && !routingController.cancel())
     {
       try
       {
@@ -1158,14 +1187,6 @@ public class MwmActivity extends BaseMwmFragmentActivity
     }
   }
 
-  @NonNull
-  private BaseMenu getCurrentMenu()
-  {
-    return (RoutingController.get().isNavigating()
-            ? mNavigationController.getNavMenu()
-            : mMainMenu);
-  }
-
   private void setFullscreen(boolean isFullscreen)
   {
     if (RoutingController.get().isNavigating()
@@ -1174,52 +1195,27 @@ public class MwmActivity extends BaseMwmFragmentActivity
       return;
 
     mIsFullscreen = isFullscreen;
-    final BaseMenu menu = getCurrentMenu();
 
-    if (isFullscreen)
+    showMainMenu(!isFullscreen);
+    showMapButtons(!isFullscreen);
+  }
+
+  private void showMapButtons(boolean show)
+  {
+    if (show)
     {
-      if (menu.isAnimating())
-        return;
-
-      mIsFullscreenAnimating = true;
-
-      showLineFrame(false);
-
-      mIsFullscreenAnimating = false;
-      if (mIsAppearMenuLater)
-      {
-        appearMenu(menu);
-        mIsAppearMenuLater = false;
-      }
-
+      if (mPlacePageController.isClosed() && mNavAnimationController != null)
+        mNavAnimationController.appearZoomButtons();
+      if (mNavMyPosition != null)
+        mNavMyPosition.show();
+      mToggleMapLayerController.showButton();
+    } else {
       if (mNavAnimationController != null)
         mNavAnimationController.disappearZoomButtons();
       if (mNavMyPosition != null)
         mNavMyPosition.hide();
       mToggleMapLayerController.hideButton();
     }
-    else
-    {
-      if (mPlacePageController.isClosed() && mNavAnimationController != null)
-        mNavAnimationController.appearZoomButtons();
-      if (!mIsFullscreenAnimating)
-        appearMenu(menu);
-      else
-        mIsAppearMenuLater = true;
-      mToggleMapLayerController.showButton();
-    }
-  }
-
-  private void appearMenu(BaseMenu menu)
-  {
-    showLineFrame(true);
-    showNavMyPositionBtn();
-  }
-
-  private void showNavMyPositionBtn()
-  {
-    if (mNavMyPosition != null)
-      mNavMyPosition.show();
   }
 
   @Override
@@ -1298,7 +1294,7 @@ public class MwmActivity extends BaseMwmFragmentActivity
 
   private int getBottomMapWidgetOffsetY()
   {
-    View menuView = getCurrentMenu().getFrame();
+    View menuView = mMainMenu.getFrame();
     return UiUtils.isVisible(menuView) ? 0 : menuView.getHeight();
   }
 
@@ -1353,7 +1349,7 @@ public class MwmActivity extends BaseMwmFragmentActivity
 
     if (controller.isBuilt())
     {
-      showLineFrame(true);
+      showMainMenu(true);
       return true;
     }
 
@@ -1364,12 +1360,12 @@ public class MwmActivity extends BaseMwmFragmentActivity
         return true;
       }
 
-      showLineFrame(false);
+      showMainMenu(false);
       return false;
     }
 
     hideRoutingActionFrame();
-    showLineFrame(true);
+    showMainMenu(true);
     return true;
   }
 
@@ -1392,21 +1388,21 @@ public class MwmActivity extends BaseMwmFragmentActivity
     {
       showAddFinishFrame();
       if (showFrame)
-        showLineFrame(true);
+        showMainMenu(true);
       return true;
     }
     if (!controller.hasStartPoint())
     {
       showAddStartFrame();
       if (showFrame)
-        showLineFrame(true);
+        showMainMenu(true);
       return true;
     }
     if (!controller.hasEndPoint())
     {
       showAddFinishFrame();
       if (showFrame)
-        showLineFrame(true);
+        showMainMenu(true);
       return true;
     }
 
@@ -1452,9 +1448,9 @@ public class MwmActivity extends BaseMwmFragmentActivity
       fragment.hideActionFrame();
   }
 
-  private void showLineFrame(boolean show)
+  private void showMainMenu(boolean show)
   {
-    UiUtils.showIf(show, getCurrentMenu().getFrame());
+    mMainMenu.show(show);
     adjustBottomWidgets(show ? 0 : getBottomMapWidgetOffsetY());
   }
 
@@ -1475,7 +1471,7 @@ public class MwmActivity extends BaseMwmFragmentActivity
     int totalHeight = calcFloatingViewsOffset();
 
     mNavAnimationController.setTopLimit(!show ? 0 : totalHeight);
-    mNavAnimationController.setBottomLimit(!show ? 0 : getCurrentMenu().getFrame().getHeight());
+    mNavAnimationController.setBottomLimit(!show ? 0 : mMainMenu.getFrame().getHeight());
     adjustCompassAndTraffic(!show ? UiUtils.getStatusBarHeight(getApplicationContext())
                                   : totalHeight);
   }
@@ -1728,7 +1724,7 @@ public class MwmActivity extends BaseMwmFragmentActivity
   public void onCompassUpdated(@NonNull CompassData compass)
   {
     MapFragment.nativeCompassUpdated(compass.getNorth(), false);
-    mNavigationController.updateNorth(compass.getNorth());
+    mNavigationController.updateNorth();
   }
 
   @Override
@@ -2011,68 +2007,6 @@ public class MwmActivity extends BaseMwmFragmentActivity
     abstract void onMenuItemClickInternal();
   }
 
-  public static class MenuClickDelegate extends AbstractClickMenuDelegate
-  {
-    public MenuClickDelegate(@NonNull MwmActivity activity, @NonNull MainMenu.Item item)
-    {
-      super(activity, item);
-    }
-
-    @Override
-    public void onMenuItemClickInternal()
-    {
-      getActivity().closePlacePage();
-      getActivity().closeSidePanel();
-      getActivity().showMainMenu();
-    }
-  }
-
-  public static class SearchClickDelegate extends AbstractClickMenuDelegate
-  {
-    public SearchClickDelegate(@NonNull MwmActivity activity, @NonNull MainMenu.Item item)
-    {
-      super(activity, item);
-    }
-
-    @Override
-    public void onMenuItemClickInternal()
-    {
-      RoutingController.get().cancel();
-      getActivity().closeFloatingPanels();
-      getActivity().showSearch(getActivity().mSearchController.getQuery());
-    }
-  }
-
-  public static class BookmarksDelegate extends AbstractClickMenuDelegate
-  {
-    public BookmarksDelegate(@NonNull MwmActivity activity, @NonNull MainMenu.Item item)
-    {
-      super(activity, item);
-    }
-
-    @Override
-    void onMenuItemClickInternal()
-    {
-      getActivity().closeFloatingPanels();
-      getActivity().showBookmarks();
-    }
-  }
-
-  public static class HelpDelegate extends AbstractClickMenuDelegate
-  {
-    public HelpDelegate(@NonNull MwmActivity activity, @NonNull MainMenu.Item item)
-    {
-      super(activity, item);
-    }
-
-    @Override
-    void onMenuItemClickInternal()
-    {
-      Intent intent = new Intent(getActivity(), HelpActivity.class);
-      getActivity().startActivity(intent);
-    }
-  }
-
   private class ToolbarLayoutChangeListener implements ViewTreeObserver.OnGlobalLayoutListener
   {
     @Override
diff --git a/android/src/com/mapswithme/maps/routing/NavigationController.java b/android/src/com/mapswithme/maps/routing/NavigationController.java
index a4e1abc08e..86f005e23f 100644
--- a/android/src/com/mapswithme/maps/routing/NavigationController.java
+++ b/android/src/com/mapswithme/maps/routing/NavigationController.java
@@ -6,13 +6,11 @@ import android.content.ComponentName;
 import android.content.Context;
 import android.content.Intent;
 import android.content.ServiceConnection;
-import android.location.Location;
 import android.media.MediaPlayer;
 import android.os.Bundle;
 import android.os.IBinder;
 import android.text.SpannableStringBuilder;
 import android.text.TextUtils;
-import android.util.Pair;
 import android.view.View;
 import android.view.ViewGroup;
 import android.widget.ImageView;
@@ -20,41 +18,29 @@ import android.widget.TextView;
 
 import androidx.annotation.NonNull;
 import androidx.annotation.Nullable;
+import androidx.appcompat.app.AppCompatActivity;
 
+import com.google.android.material.bottomsheet.BottomSheetBehavior;
 import com.mapswithme.maps.Framework;
 import com.mapswithme.maps.MwmActivity;
 import com.mapswithme.maps.R;
 import com.mapswithme.maps.base.MediaPlayerWrapper;
-import com.mapswithme.maps.bookmarks.BookmarkCategoriesActivity;
-import com.mapswithme.maps.location.LocationHelper;
 import com.mapswithme.maps.maplayer.traffic.TrafficManager;
-import com.mapswithme.maps.settings.SettingsActivity;
 import com.mapswithme.maps.sound.TtsPlayer;
-import com.mapswithme.maps.widget.FlatProgressView;
 import com.mapswithme.maps.widget.menu.NavMenu;
 import com.mapswithme.util.Graphics;
-import com.mapswithme.util.StringUtils;
 import com.mapswithme.util.UiUtils;
 import com.mapswithme.util.Utils;
 
-import java.text.DateFormat;
-import java.text.SimpleDateFormat;
-import java.util.Calendar;
-import java.util.Locale;
-import java.util.concurrent.TimeUnit;
-
 
 public class NavigationController implements Application.ActivityLifecycleCallbacks,
-                                             TrafficManager.TrafficCallback, View.OnClickListener
+    TrafficManager.TrafficCallback,
+    NavMenu.NavMenuListener
 {
-  private static final String STATE_SHOW_TIME_LEFT = "ShowTimeLeft";
   private static final String STATE_BOUND = "Bound";
 
   private final View mFrame;
-  private final View mBottomFrame;
   private final View mSearchButtonFrame;
-  @NonNull
-  private final NavMenu mNavMenu;
 
   private final ImageView mNextTurnImage;
   private final TextView mNextTurnDistance;
@@ -66,28 +52,15 @@ public class NavigationController implements Application.ActivityLifecycleCallba
   private final View mStreetFrame;
   private final TextView mNextStreet;
 
-  private final TextView mSpeedValue;
-  private final TextView mSpeedUnits;
-  private final TextView mTimeHourValue;
-  private final TextView mTimeHourUnits;
-  private final TextView mTimeMinuteValue;
-  private final TextView mTimeMinuteUnits;
-  private final ImageView mDotTimeLeft;
-  private final ImageView mDotTimeArrival;
-  private final TextView mDistanceValue;
-  private final TextView mDistanceUnits;
-  private final FlatProgressView mRouteProgress;
-
   @NonNull
   private final SearchWheel mSearchWheel;
-  @NonNull
-  private final View mSpeedViewContainer;
-
-  private boolean mShowTimeLeft = true;
 
   @NonNull
   private final MediaPlayer.OnCompletionListener mSpeedCamSignalCompletionListener;
 
+  private final NavMenu mNavMenu;
+  View.OnClickListener mOnSettingsClickListener;
+  View.OnClickListener mOnBookmarkClickListener;
   @Nullable
   private NavigationService mService = null;
   private boolean mBound = false;
@@ -99,7 +72,7 @@ public class NavigationController implements Application.ActivityLifecycleCallba
     {
       NavigationService.LocalBinder binder = (NavigationService.LocalBinder) service;
       mService = binder.getService();
-      mBound =  true;
+      mBound = true;
       doBackground();
     }
 
@@ -111,14 +84,13 @@ public class NavigationController implements Application.ActivityLifecycleCallba
     }
   };
 
-  // TODO (@velichkomarija) remove unnecessary casts.
-  public NavigationController(Activity activity)
+
+  public NavigationController(AppCompatActivity activity, View.OnClickListener onSettingsClickListener, View.OnClickListener onBookmarkClickListener)
   {
     mFrame = activity.findViewById(R.id.navigation_frame);
-    mBottomFrame = mFrame.findViewById(R.id.nav_bottom_frame);
-    mBottomFrame.setOnClickListener(v -> switchTimeFormat());
-    mNavMenu = createNavMenu();
-    mNavMenu.refresh();
+    mNavMenu = new NavMenu(activity, this);
+    mOnSettingsClickListener = onSettingsClickListener;
+    mOnBookmarkClickListener = onBookmarkClickListener;
 
     // Top frame
     View topFrame = mFrame.findViewById(R.id.nav_top_frame);
@@ -138,64 +110,17 @@ public class NavigationController implements Application.ActivityLifecycleCallba
     UiUtils.extendViewWithStatusBar(mStreetFrame);
     UiUtils.extendViewMarginWithStatusBar(turnFrame);
 
-    // Bottom frame
-    mSpeedViewContainer = mBottomFrame.findViewById(R.id.speed_view_container);
-    mSpeedValue = mBottomFrame.findViewById(R.id.speed_value);
-    mSpeedUnits = mBottomFrame.findViewById(R.id.speed_dimen);
-    mTimeHourValue = mBottomFrame.findViewById(R.id.time_hour_value);
-    mTimeHourUnits = mBottomFrame.findViewById(R.id.time_hour_dimen);
-    mTimeMinuteValue = mBottomFrame.findViewById(R.id.time_minute_value);
-    mTimeMinuteUnits = mBottomFrame.findViewById(R.id.time_minute_dimen);
-    mDotTimeArrival = mBottomFrame.findViewById(R.id.dot_estimate);
-    mDotTimeLeft = mBottomFrame.findViewById(R.id.dot_left);
-    mDistanceValue = mBottomFrame.findViewById(R.id.distance_value);
-    mDistanceUnits = mBottomFrame.findViewById(R.id.distance_dimen);
-    mRouteProgress = mBottomFrame.findViewById(R.id.navigation_progress);
-
     mSearchButtonFrame = activity.findViewById(R.id.search_button_frame);
     mSearchWheel = new SearchWheel(mSearchButtonFrame);
 
     ImageView bookmarkButton = mSearchButtonFrame.findViewById(R.id.btn_bookmarks);
     bookmarkButton.setImageDrawable(Graphics.tint(bookmarkButton.getContext(),
-                                                  R.drawable.ic_menu_bookmarks));
-    bookmarkButton.setOnClickListener(this);
+        R.drawable.ic_menu_bookmarks));
+    bookmarkButton.setOnClickListener(mOnBookmarkClickListener);
     Application app = (Application) bookmarkButton.getContext().getApplicationContext();
     mSpeedCamSignalCompletionListener = new CameraWarningSignalCompletionListener(app);
   }
 
-  private NavMenu createNavMenu()
-  {
-    return new NavMenu(mBottomFrame, this::onMenuItemClicked);
-  }
-
-  private void onMenuItemClicked(NavMenu.Item item)
-  {
-    final MwmActivity parent = ((MwmActivity) mFrame.getContext());
-    switch (item)
-    {
-    case STOP:
-      mNavMenu.close(false);
-      RoutingController.get().cancel();
-      stop(parent);
-      break;
-    case SETTINGS:
-      parent.closeFloatingPanels();
-      parent.startActivity(new Intent(parent, SettingsActivity.class));
-      break;
-    case TTS_VOLUME:
-      TtsPlayer.setEnabled(!TtsPlayer.isEnabled());
-      mNavMenu.refreshTts();
-      break;
-//    case TRAFFIC:
-//      TrafficManager.INSTANCE.toggle();
-//      parent.onTrafficLayerSelected();
-//      mNavMenu.refreshTraffic();
-//      break;
-    case TOGGLE:
-      mNavMenu.toggle(true);
-    }
-  }
-
   public void stop(MwmActivity parent)
   {
     mSearchWheel.reset();
@@ -262,7 +187,7 @@ public class NavigationController implements Application.ActivityLifecycleCallba
     info.pedestrianTurnDirection.setTurnDrawable(mNextTurnImage);
   }
 
-  public void updateNorth(double north)
+  public void updateNorth()
   {
     if (!RoutingController.get().isNavigating())
       return;
@@ -281,11 +206,7 @@ public class NavigationController implements Application.ActivityLifecycleCallba
       updateVehicle(info);
 
     updateStreetView(info);
-    updateSpeedView(info);
-    updateTime(info.totalTimeInSeconds);
-    mDistanceValue.setText(info.distToTarget);
-    mDistanceUnits.setText(info.targetUnits);
-    mRouteProgress.setProgress((int) info.completionPercent);
+    mNavMenu.update(info);
     playbackSpeedCamWarning(info);
   }
 
@@ -297,75 +218,17 @@ public class NavigationController implements Application.ActivityLifecycleCallba
       mNextStreet.setText(info.nextStreet);
   }
 
-  private void updateSpeedView(@NonNull RoutingInfo info)
-  {
-    final Location last = LocationHelper.INSTANCE.getSavedLocation();
-    if (last == null)
-      return;
-
-    Pair<String, String> speedAndUnits = StringUtils.nativeFormatSpeedAndUnits(last.getSpeed());
-
-    mSpeedUnits.setText(speedAndUnits.second);
-    mSpeedValue.setText(" " + speedAndUnits.first);
-    mSpeedViewContainer.setActivated(info.isSpeedLimitExceeded());
-  }
 
   private void playbackSpeedCamWarning(@NonNull RoutingInfo info)
   {
     if (!info.shouldPlayWarningSignal() || TtsPlayer.INSTANCE.isSpeaking())
       return;
 
-    Context context = mBottomFrame.getContext();
+    Context context = mFrame.getContext();
     MediaPlayerWrapper player = MediaPlayerWrapper.from(context);
     player.playback(R.raw.speed_cams_beep, mSpeedCamSignalCompletionListener);
   }
 
-  private void updateTime(int seconds)
-  {
-    if (mShowTimeLeft)
-      updateTimeLeft(seconds);
-    else
-      updateTimeEstimate(seconds);
-
-    mDotTimeLeft.setEnabled(mShowTimeLeft);
-    mDotTimeArrival.setEnabled(!mShowTimeLeft);
-  }
-
-  private void updateTimeLeft(int seconds)
-  {
-    final long hours = TimeUnit.SECONDS.toHours(seconds);
-    final long minutes = TimeUnit.SECONDS.toMinutes(seconds) % 60;
-    UiUtils.setTextAndShow(mTimeMinuteValue, String.valueOf(minutes));
-    String min = mFrame.getResources().getString(R.string.minute);
-    UiUtils.setTextAndShow(mTimeMinuteUnits, min);
-    if (hours == 0)
-    {
-      UiUtils.hide(mTimeHourUnits, mTimeHourValue);
-      return;
-    }
-    UiUtils.setTextAndShow(mTimeHourValue, String.valueOf(hours));
-    String hour = mFrame.getResources().getString(R.string.hour);
-    UiUtils.setTextAndShow(mTimeHourUnits, hour);
-  }
-
-  private void updateTimeEstimate(int seconds)
-  {
-    final Calendar currentTime = Calendar.getInstance();
-    currentTime.add(Calendar.SECOND, seconds);
-    final DateFormat timeFormat12 = new SimpleDateFormat("h:mm aa", Locale.getDefault());
-    final DateFormat timeFormat24 = new SimpleDateFormat("HH:mm", Locale.getDefault());
-    boolean is24Format = android.text.format.DateFormat.is24HourFormat(mTimeMinuteValue.getContext());
-    UiUtils.setTextAndShow(mTimeMinuteValue, is24Format ? timeFormat24.format(currentTime.getTime())
-                          : timeFormat12.format(currentTime.getTime()));
-    UiUtils.hide(mTimeHourUnits, mTimeHourValue, mTimeMinuteUnits);
-  }
-
-  private void switchTimeFormat()
-  {
-    mShowTimeLeft = !mShowTimeLeft;
-    update(Framework.nativeGetRouteFollowingInfo());
-  }
-
   public void showSearchButtons(boolean show)
   {
     UiUtils.showIf(show, mSearchButtonFrame);
@@ -393,11 +256,31 @@ public class NavigationController implements Application.ActivityLifecycleCallba
     UiUtils.invisible(mSearchButtonFrame);
   }
 
+
   public void show(boolean show)
   {
+    if (show && !UiUtils.isVisible(mFrame))
+      collapseNavMenu();
+    else if (!show && UiUtils.isVisible(mFrame))
+      mNavMenu.hideNavBottomSheet();
     UiUtils.showIf(show, mFrame);
     UiUtils.showIf(show, mSearchButtonFrame);
-    mNavMenu.show(show);
+  }
+
+
+  public boolean isNavMenuCollapsed()
+  {
+    return mNavMenu.getBottomSheetState() == BottomSheetBehavior.STATE_COLLAPSED;
+  }
+
+  public boolean isNavMenuHidden()
+  {
+    return mNavMenu.getBottomSheetState() == BottomSheetBehavior.STATE_HIDDEN;
+  }
+
+  public void collapseNavMenu()
+  {
+    mNavMenu.collapseNavBottomSheet();
   }
 
   public void resetSearchWheel()
@@ -405,12 +288,6 @@ public class NavigationController implements Application.ActivityLifecycleCallba
     mSearchWheel.reset();
   }
 
-  @NonNull
-  public NavMenu getNavMenu()
-  {
-    return mNavMenu;
-  }
-
   @Override
   public void onActivityCreated(@NonNull Activity activity, @Nullable Bundle savedInstanceState)
   {
@@ -426,7 +303,7 @@ public class NavigationController implements Application.ActivityLifecycleCallba
   @Override
   public void onActivityResumed(@NonNull Activity activity)
   {
-    mNavMenu.onResume(null);
+    mNavMenu.refreshTts();
     mSearchWheel.onResume();
     if (mBound)
       doBackground();
@@ -447,14 +324,12 @@ public class NavigationController implements Application.ActivityLifecycleCallba
   @Override
   public void onActivitySaveInstanceState(@NonNull Activity activity, @NonNull Bundle outState)
   {
-    outState.putBoolean(STATE_SHOW_TIME_LEFT, mShowTimeLeft);
     outState.putBoolean(STATE_BOUND, mBound);
     mSearchWheel.saveState(outState);
   }
 
   public void onRestoreState(@NonNull Bundle savedInstanceState, @NonNull MwmActivity parent)
   {
-    mShowTimeLeft = savedInstanceState.getBoolean(STATE_SHOW_TIME_LEFT);
     mBound = savedInstanceState.getBoolean(STATE_BOUND);
     if (mBound)
       start(parent);
@@ -470,13 +345,13 @@ public class NavigationController implements Application.ActivityLifecycleCallba
   @Override
   public void onEnabled()
   {
-   // mNavMenu.refreshTraffic();
+    // mNavMenu.refreshTraffic();
   }
 
   @Override
   public void onDisabled()
   {
-   // mNavMenu.refreshTraffic();
+    // mNavMenu.refreshTraffic();
   }
 
   @Override
@@ -515,20 +390,22 @@ public class NavigationController implements Application.ActivityLifecycleCallba
     // no op
   }
 
-  @Override
-  public void onClick(View v)
-  {
-    switch (v.getId())
-    {
-      case R.id.btn_bookmarks:
-        BookmarkCategoriesActivity.start(mFrame.getContext());
-        break;
-    }
-  }
-
   public void destroy()
   {
-    MediaPlayerWrapper.from(mBottomFrame.getContext()).release();
+    MediaPlayerWrapper.from(mFrame.getContext()).release();
+  }
+
+  @Override
+  public void onSettingsClicked()
+  {
+    mOnSettingsClickListener.onClick(null);
+  }
+
+  @Override
+  public void onStopClicked()
+  {
+    mNavMenu.hideNavBottomSheet();
+    RoutingController.get().cancel();
   }
 
   private static class CameraWarningSignalCompletionListener implements MediaPlayer.OnCompletionListener
diff --git a/android/src/com/mapswithme/maps/widget/menu/BaseMenu.java b/android/src/com/mapswithme/maps/widget/menu/BaseMenu.java
deleted file mode 100644
index 9858a2d769..0000000000
--- a/android/src/com/mapswithme/maps/widget/menu/BaseMenu.java
+++ /dev/null
@@ -1,100 +0,0 @@
-package com.mapswithme.maps.widget.menu;
-
-import android.view.View;
-
-import androidx.annotation.DimenRes;
-import androidx.annotation.IdRes;
-import androidx.annotation.NonNull;
-import androidx.annotation.Nullable;
-
-import com.mapswithme.maps.R;
-import com.mapswithme.util.ThemeUtils;
-import com.mapswithme.util.UiUtils;
-
-public abstract class BaseMenu
-{
-  final View mFrame;
-  final View mLineFrame;
-
-  private final ItemClickListener mItemClickListener;
-
-  public interface Item
-  {
-    @IdRes int getViewId();
-  }
-
-  public interface ItemClickListener<T extends Item>
-  {
-    void onItemClick(T item);
-  }
-
-  View mapItem(final Item item, View frame)
-  {
-    View res = frame.findViewById(item.getViewId());
-    if (res != null)
-    {
-      res.setOnClickListener(v -> {
-        //noinspection unchecked
-        mItemClickListener.onItemClick(item);
-      });
-    }
-    return res;
-  }
-
-  protected void adjustTransparency()
-  {
-    mFrame.setBackgroundColor(ThemeUtils.getColor(mFrame.getContext(), isOpen() ? R.attr.menuBackgroundOpen
-                                                                                : R.attr.menuBackground));
-  }
-
-  void afterLayoutMeasured(@Nullable Runnable procAfterCorrection)
-  {
-    if (procAfterCorrection != null)
-      procAfterCorrection.run();
-  }
-
-  public abstract void onResume(@Nullable Runnable procAfterMeasurement);
-
-  BaseMenu(@NonNull View frame, @NonNull ItemClickListener<? extends Item> itemClickListener)
-  {
-    mFrame = frame;
-    mItemClickListener = itemClickListener;
-
-    mLineFrame = mFrame.findViewById(R.id.line_frame);
-
-    adjustTransparency();
-  }
-
-  public abstract boolean isOpen();
-
-  public abstract boolean isAnimating();
-
-  public abstract boolean open(boolean animate);
-
-  public boolean close(boolean animate)
-  {
-    return close(animate, null);
-  }
-
-  public abstract boolean close(boolean animate, @Nullable final Runnable onCloseListener);
-
-  public abstract void toggle(boolean animate);
-
-  public void show(boolean show)
-  {
-    if (show && mFrame.isShown())
-      return;
-
-    UiUtils.showIf(show, mFrame);
-  }
-
-  public View getFrame()
-  {
-    return mFrame;
-  }
-
-  public void updateMarker() {}
-  protected void setToggleState(boolean open, boolean animate) {}
-
-  protected abstract @DimenRes int getHeightResId();
-}
diff --git a/android/src/com/mapswithme/maps/widget/menu/MainMenu.java b/android/src/com/mapswithme/maps/widget/menu/MainMenu.java
index 41b0277bd4..51cc75b2ce 100644
--- a/android/src/com/mapswithme/maps/widget/menu/MainMenu.java
+++ b/android/src/com/mapswithme/maps/widget/menu/MainMenu.java
@@ -1,254 +1,73 @@
 package com.mapswithme.maps.widget.menu;
 
 import android.view.View;
-import androidx.annotation.NonNull;
-import androidx.annotation.Nullable;
 
-import com.mapswithme.maps.ClickMenuDelegate;
-import com.mapswithme.maps.MwmActivity;
 import com.mapswithme.maps.R;
 import com.mapswithme.maps.downloader.MapManager;
 import com.mapswithme.maps.downloader.UpdateInfo;
-import com.mapswithme.maps.routing.RoutingController;
 import com.mapswithme.util.UiUtils;
 
-public class MainMenu extends BaseMenu
+public class MainMenu
 {
-  public enum State
-  {
-    MENU
-        {
-          @Override
-          boolean showToggle()
-          {
-            return true;
-          }
-        },
-    NAVIGATION,
-    ROUTE_PREPARE
-        {
-          @Override
-          boolean showToggle()
-          {
-            return false;
-          }
-        };
-
-    boolean showToggle()
-    {
-      return true;
-    }
-  }
-
+  private final View mFrame;
   private final View mButtonsFrame;
   private final View mRoutePlanFrame;
   private final View mNewsMarker;
+  private final ItemClickListener mItemClickListener;
 
-  private final MenuToggle mToggle;
-
-  public enum Item implements BaseMenu.Item
+  public MainMenu(View frame, ItemClickListener itemClickListener)
   {
-    MENU(R.id.toggle)
-        {
-          @NonNull
-          @Override
-          public ClickMenuDelegate createClickDelegate(@NonNull MwmActivity activity,
-                                                       @NonNull Item item)
-          {
-            return new MwmActivity.MenuClickDelegate(activity, item);
-          }
-        },
-    SEARCH(R.id.search)
-        {
-          @NonNull
-          @Override
-          public ClickMenuDelegate createClickDelegate(@NonNull MwmActivity activity,
-                                                       @NonNull Item item)
-          {
-            return new MwmActivity.SearchClickDelegate(activity, item);
-          }
-        },
-    HELP(R.id.help)
-        {
-          @NonNull
-          @Override
-          public ClickMenuDelegate createClickDelegate(@NonNull MwmActivity activity,
-                                                       @NonNull Item item)
-          {
-            return new MwmActivity.HelpDelegate(activity, item);
-          }
-        },
-    BOOKMARKS(R.id.bookmarks)
-        {
-          @NonNull
-          @Override
-          public ClickMenuDelegate createClickDelegate(@NonNull MwmActivity activity,
-                                                       @NonNull Item item)
-          {
-            return new MwmActivity.BookmarksDelegate(activity, item);
-          }
-        },
-    SETTINGS(R.id.settings)
-        {
-          @NonNull
-          @Override
-          public ClickMenuDelegate createClickDelegate(@NonNull MwmActivity activity,
-                                                       @NonNull Item item)
-          {
-            throw new UnsupportedOperationException("Main menu option doesn't support it!");
-          }
-        };
+    mFrame = frame;
+    mItemClickListener = itemClickListener;
 
-    private final int mViewId;
-
-    Item(int viewId)
-    {
-      mViewId = viewId;
-    }
-
-    @Override
-    public int getViewId()
-    {
-      return mViewId;
-    }
-
-    public void onClicked(@NonNull MwmActivity activity, @NonNull Item item)
-    {
-      ClickMenuDelegate delegate = createClickDelegate(activity, item);
-      delegate.onMenuItemClick();
-    }
-
-    @NonNull
-    public abstract ClickMenuDelegate createClickDelegate(@NonNull MwmActivity activity,
-                                                          @NonNull Item item);
+    mButtonsFrame = mFrame.findViewById(R.id.buttons_frame);
+    mRoutePlanFrame = mFrame.findViewById(R.id.routing_plan_frame);
+    mNewsMarker = mButtonsFrame.findViewById(R.id.marker);
+    init();
   }
 
-  private void mapItem(MainMenu.Item item)
+  void mapItem(Item item, int viewId)
   {
-    mapItem(item, mButtonsFrame);
+    View res = mButtonsFrame.findViewById(viewId);
+    if (res != null)
+      res.setOnClickListener(v -> mItemClickListener.onItemClick(item));
   }
 
-  @Override
-  void afterLayoutMeasured(Runnable procAfterCorrection)
-  {
-    UiUtils.showIf(!RoutingController.get().isNavigating(), mFrame);
-    super.afterLayoutMeasured(procAfterCorrection);
-  }
-
-  @Override
-  public void onResume(@Nullable Runnable procAfterMeasurement)
+  public void onResume()
   {
     updateMarker();
   }
 
-  @Override
-  public boolean isOpen()
-  {
-    return false;
-  }
-
-  @Override
-  public boolean isAnimating()
-  {
-    return false;
-  }
-
-  @Override
-  public boolean open(boolean animate)
-  {
-    return false;
-  }
-
-  @Override
-  public boolean close(boolean animate, @Nullable Runnable onCloseListener)
-  {
-    if (onCloseListener != null)
-      onCloseListener.run();
-    return false;
-  }
-
-  @Override
-  public void toggle(boolean animate)
-  {
-    // Do nothing.
-  }
-
-  @Override
   public void updateMarker()
   {
     final UpdateInfo info = MapManager.nativeGetUpdateInfo(null);
     final int count = (info == null ? 0 : info.filesCount);
-    final boolean show = (count > 0 && !isOpen());
+    final boolean show = count > 0;
 
     UiUtils.showIf(show, mNewsMarker);
-
-    // if (show)
-    //   return;
-
-    // for (Mode mode : Mode.values())
-    // {
-    //   show = SharedPropertiesUtils.shouldShowNewMarkerForLayerMode(mFrame.getContext(), mode);
-    //   if (show)
-    //     break;
-    // }
-
-    // UiUtils.showIf(show, mNewsMarker);
-  }
-
-  @Override
-  protected void setToggleState(boolean open, boolean animate)
-  {
-    // Do nothing.
   }
 
   private void init()
   {
-    mapItem(Item.SEARCH);
-    mapItem(Item.HELP);
-    mapItem(Item.BOOKMARKS);
-    mapItem(Item.SETTINGS);
+    mapItem(Item.HELP, R.id.help);
+    mapItem(Item.SEARCH, R.id.search);
+    mapItem(Item.BOOKMARKS, R.id.bookmarks);
+    mapItem(Item.MENU, R.id.toggle);
 
     setState(State.MENU, false);
   }
 
-  public MainMenu(View frame, ItemClickListener<Item> itemClickListener)
-  {
-    super(frame, itemClickListener);
-
-    mButtonsFrame = mLineFrame.findViewById(R.id.buttons_frame);
-    mRoutePlanFrame = mLineFrame.findViewById(R.id.routing_plan_frame);
-    mNewsMarker = mButtonsFrame.findViewById(R.id.marker);
-
-    mToggle = new MenuToggle(mLineFrame, getHeightResId());
-    mapItem(Item.MENU, mLineFrame);
-
-    init();
-  }
-
-  @Override
-  protected int getHeightResId()
-  {
-    return R.dimen.menu_line_height;
-  }
-
   public void setState(State state, boolean isFullScreen)
   {
     if (state != State.NAVIGATION)
     {
-      mToggle.show(state.showToggle());
-      mToggle.setOpen(false, false);
-
       boolean isRouting = state == State.ROUTE_PREPARE;
       if (mRoutePlanFrame == null)
-      {
         UiUtils.show(mButtonsFrame);
-      }
       else
       {
         UiUtils.showIf(state == State.MENU, mButtonsFrame);
         UiUtils.showIf(isRouting, mRoutePlanFrame);
-        if (isRouting)
-          mToggle.hide();
       }
     }
 
@@ -257,20 +76,36 @@ public class MainMenu extends BaseMenu
     UiUtils.showIf(state == State.ROUTE_PREPARE, mRoutePlanFrame);
   }
 
-  public void setEnabled(Item item, boolean enable)
+  public void show(boolean show)
   {
-    View button = mButtonsFrame.findViewById(item.mViewId);
-    if (button == null)
+    if (show && mFrame.isShown())
       return;
 
-    button.setAlpha(enable ? 1.0f : 0.4f);
-    button.setEnabled(enable);
+    UiUtils.showIf(show, mFrame);
   }
 
-  private void setVisible(@NonNull Item item, boolean show)
+  public View getFrame()
   {
-    final View itemInButtonsFrame = mButtonsFrame.findViewById(item.mViewId);
-    if (itemInButtonsFrame != null)
-      UiUtils.showIf(show, itemInButtonsFrame);
+    return mFrame;
+  }
+
+  public enum State
+  {
+    MENU,
+    NAVIGATION,
+    ROUTE_PREPARE
+  }
+
+  public enum Item
+  {
+    MENU,
+    SEARCH,
+    HELP,
+    BOOKMARKS
+  }
+
+  public interface ItemClickListener
+  {
+    void onItemClick(Item item);
   }
 }
diff --git a/android/src/com/mapswithme/maps/widget/menu/MenuToggle.java b/android/src/com/mapswithme/maps/widget/menu/MenuToggle.java
deleted file mode 100644
index 55c5716eb9..0000000000
--- a/android/src/com/mapswithme/maps/widget/menu/MenuToggle.java
+++ /dev/null
@@ -1,85 +0,0 @@
-package com.mapswithme.maps.widget.menu;
-
-import android.content.Context;
-import android.graphics.Rect;
-import android.graphics.drawable.Drawable;
-import android.graphics.drawable.TransitionDrawable;
-import android.view.View;
-import android.widget.ImageView;
-
-import androidx.annotation.DimenRes;
-import androidx.annotation.DrawableRes;
-import androidx.annotation.IntegerRes;
-
-import com.mapswithme.maps.R;
-import com.mapswithme.maps.widget.RotateByAlphaDrawable;
-import com.mapswithme.maps.widget.TrackedTransitionDrawable;
-import com.mapswithme.util.UiUtils;
-
-class MenuToggle
-{
-  @IntegerRes
-  private final int mAnimationDuration;
-  private final ImageView mButton;
-  private final TransitionDrawable mOpenImage;
-  private final TransitionDrawable mCollapseImage;
-
-  MenuToggle(View frame, @DimenRes int heightRes)
-  {
-    this(frame, heightRes, R.drawable.ic_menu_open, R.drawable.ic_menu_close);
-  }
-
-  private MenuToggle(View frame, @DimenRes int heightRes, @DrawableRes int src, @DrawableRes int dst)
-  {
-    mButton = frame.findViewById(R.id.toggle);
-    Context context = frame.getContext();
-    mAnimationDuration = context.getResources().getInteger(R.integer.anim_menu);
-    int sz = UiUtils.dimen(context, heightRes);
-    Rect bounds = new Rect(0, 0, sz, sz);
-
-    mOpenImage = new TrackedTransitionDrawable(new Drawable[]{
-        new RotateByAlphaDrawable(context, src, R.attr.iconTint, false)
-            .setInnerBounds(bounds),
-        new RotateByAlphaDrawable(context, dst, R.attr.iconTintLight, true)
-            .setInnerBounds(bounds)
-            .setBaseAngle(-90)});
-    mCollapseImage = new TrackedTransitionDrawable(new Drawable[]{
-        new RotateByAlphaDrawable(context, src, R.attr.iconTint, false)
-            .setInnerBounds(bounds),
-        new RotateByAlphaDrawable(context, dst, R.attr.iconTintLight, true)
-            .setInnerBounds(bounds)});
-    mOpenImage.setCrossFadeEnabled(true);
-    mCollapseImage.setCrossFadeEnabled(true);
-  }
-
-  private void transitImage(TransitionDrawable image, boolean forward, boolean animate)
-  {
-    if (!UiUtils.isVisible(mButton))
-      animate = false;
-
-    mButton.setImageDrawable(image);
-
-    if (forward)
-      image.startTransition(animate ? mAnimationDuration : 0);
-    else
-      image.reverseTransition(animate ? mAnimationDuration : 0);
-
-    if (!animate)
-      image.getDrawable(forward ? 1 : 0).setAlpha(0xFF);
-  }
-
-  void show(boolean show)
-  {
-    UiUtils.showIf(show, mButton);
-  }
-
-  void hide()
-  {
-    UiUtils.hide(mButton);
-  }
-
-  void setOpen(boolean open, boolean animate)
-  {
-    transitImage(mOpenImage, open, animate);
-  }
-}
diff --git a/android/src/com/mapswithme/maps/widget/menu/NavMenu.java b/android/src/com/mapswithme/maps/widget/menu/NavMenu.java
index 6b09f7c4b3..b29ffad2ee 100644
--- a/android/src/com/mapswithme/maps/widget/menu/NavMenu.java
+++ b/android/src/com/mapswithme/maps/widget/menu/NavMenu.java
@@ -1,276 +1,239 @@
 package com.mapswithme.maps.widget.menu;
 
-import android.animation.Animator;
-import android.animation.ValueAnimator;
-import android.graphics.drawable.Drawable;
+import android.location.Location;
+import android.util.Pair;
 import android.view.View;
 import android.widget.Button;
 import android.widget.ImageView;
+import android.widget.TextView;
 
-import androidx.annotation.IntegerRes;
 import androidx.annotation.NonNull;
-import androidx.annotation.Nullable;
+import androidx.appcompat.app.AppCompatActivity;
 
-import com.mapswithme.maps.MwmApplication;
+import com.google.android.material.bottomsheet.BottomSheetBehavior;
 import com.mapswithme.maps.R;
-import com.mapswithme.maps.maplayer.traffic.TrafficManager;
+import com.mapswithme.maps.location.LocationHelper;
+import com.mapswithme.maps.routing.RoutingInfo;
 import com.mapswithme.maps.sound.TtsPlayer;
+import com.mapswithme.maps.widget.FlatProgressView;
 import com.mapswithme.util.Graphics;
+import com.mapswithme.util.StringUtils;
 import com.mapswithme.util.UiUtils;
 
-public class NavMenu extends BaseMenu
+import java.text.DateFormat;
+import java.text.SimpleDateFormat;
+import java.util.Calendar;
+import java.util.Locale;
+import java.util.concurrent.TimeUnit;
+
+public class NavMenu
 {
-  @IntegerRes
-  private final int mAnimationDuration;
-  @NonNull
+  private final BottomSheetBehavior<View> mNavBottomSheetBehavior;
+  private final View mBottomSheetBackground;
+  private final View mHeaderFrame;
+
   private final ImageView mTts;
-//  @NonNull
-//  private final ImageView mTraffic;
+  private final View mSpeedViewContainer;
+  private final TextView mSpeedValue;
+  private final TextView mSpeedUnits;
+  private final TextView mTimeHourValue;
+  private final TextView mTimeHourUnits;
+  private final TextView mTimeMinuteValue;
+  private final TextView mTimeMinuteUnits;
+  private final TextView mTimeEstimate;
+  private final TextView mDistanceValue;
+  private final TextView mDistanceUnits;
+  private final FlatProgressView mRouteProgress;
 
-  ImageView mToggle;
+  private final AppCompatActivity mActivity;
+  private final NavMenuListener mNavMenuListener;
 
-  final View mContentFrame;
+  private int currentPeekHeight = 0;
 
-  int mContentHeight;
-
-  boolean mLayoutMeasured;
-
-  private boolean mIsOpen;
-
-  private boolean mAnimating;
-
-  public enum Item implements BaseMenu.Item
+  public NavMenu(AppCompatActivity activity, NavMenuListener navMenuListener)
   {
-    TOGGLE(R.id.toggle),
-    TTS_VOLUME(R.id.tts_volume),
-    STOP(R.id.stop),
-    SETTINGS(R.id.settings);
-//    TRAFFIC(R.id.traffic);
-
-    private final int mViewId;
-
-    Item(int viewId)
+    mActivity = activity;
+    mNavMenuListener = navMenuListener;
+    View mBottomFrame = mActivity.findViewById(R.id.nav_bottom_frame);
+    mHeaderFrame = mBottomFrame.findViewById(R.id.line_frame);
+    mHeaderFrame.setOnClickListener(v -> toggleNavMenu());
+    mHeaderFrame.addOnLayoutChangeListener((view, i, i1, i2, i3, i4, i5, i6, i7) -> setPeekHeight());
+    mNavBottomSheetBehavior = BottomSheetBehavior.from(mActivity.findViewById(R.id.nav_bottom_sheet));
+    mBottomSheetBackground = mActivity.findViewById(R.id.nav_bottom_sheet_background);
+    mBottomSheetBackground.setOnClickListener(v -> collapseNavBottomSheet());
+    mBottomSheetBackground.setVisibility(View.GONE);
+    mBottomSheetBackground.setAlpha(0);
+    mNavBottomSheetBehavior.addBottomSheetCallback(new BottomSheetBehavior.BottomSheetCallback()
     {
-      mViewId = viewId;
-    }
+      @Override
+      public void onStateChanged(@NonNull View bottomSheet, int newState)
+      {
+        if (newState == BottomSheetBehavior.STATE_COLLAPSED || newState == BottomSheetBehavior.STATE_HIDDEN)
+        {
+          mBottomSheetBackground.setVisibility(View.GONE);
+          mBottomSheetBackground.setAlpha(0);
+        } else
+        {
+          mBottomSheetBackground.setVisibility(View.VISIBLE);
+        }
+      }
 
-    @Override
-    public int getViewId()
-    {
-      return mViewId;
-    }
-  }
+      @Override
+      public void onSlide(@NonNull View bottomSheet, float slideOffset)
+      {
+        mBottomSheetBackground.setAlpha(slideOffset);
+      }
+    });
 
-  private class AnimationListener extends UiUtils.SimpleAnimatorListener
-  {
-    @Override
-    public void onAnimationStart(android.animation.Animator animation)
-    {
-      mAnimating = true;
-    }
+    // Bottom frame
+    mSpeedViewContainer = mBottomFrame.findViewById(R.id.speed_view_container);
+    mSpeedValue = mBottomFrame.findViewById(R.id.speed_value);
+    mSpeedUnits = mBottomFrame.findViewById(R.id.speed_dimen);
+    mTimeHourValue = mBottomFrame.findViewById(R.id.time_hour_value);
+    mTimeHourUnits = mBottomFrame.findViewById(R.id.time_hour_dimen);
+    mTimeMinuteValue = mBottomFrame.findViewById(R.id.time_minute_value);
+    mTimeMinuteUnits = mBottomFrame.findViewById(R.id.time_minute_dimen);
+    mTimeEstimate = mBottomFrame.findViewById(R.id.time_estimate);
+    mDistanceValue = mBottomFrame.findViewById(R.id.distance_value);
+    mDistanceUnits = mBottomFrame.findViewById(R.id.distance_dimen);
+    mRouteProgress = mBottomFrame.findViewById(R.id.navigation_progress);
 
-    @Override
-    public void onAnimationEnd(android.animation.Animator animation)
-    {
-      mAnimating = false;
-    }
-  }
-
-  public NavMenu(View frame, ItemClickListener<Item> listener)
-  {
-    super(frame, listener);
-    mAnimationDuration = MwmApplication.from(frame.getContext())
-                                       .getResources().getInteger(R.integer.anim_menu);
-    mContentFrame = mFrame.findViewById(R.id.content_frame);
-    mToggle = mLineFrame.findViewById(R.id.toggle);
-    mToggle.setImageDrawable(Graphics.tint(mFrame.getContext(), R.drawable.ic_menu_close, R.attr.iconTintLight));
-
-    setToggleState(false, false);
-
-    mapItem(Item.TOGGLE, mLineFrame);
-    Button stop = (Button) mapItem(Item.STOP, mFrame);
+    // Bottom frame buttons
+    ImageView mSettings = mBottomFrame.findViewById(R.id.settings);
+    mSettings.setOnClickListener(v -> onSettingsClicked());
+    mTts = mBottomFrame.findViewById(R.id.tts_volume);
+    mTts.setOnClickListener(v -> onTtsClicked());
+    Button stop = mBottomFrame.findViewById(R.id.stop);
+    stop.setOnClickListener(v -> onStopClicked());
     UiUtils.updateRedButton(stop);
 
-    mapItem(Item.SETTINGS, mFrame);
-
-    mTts = (ImageView) mapItem(Item.TTS_VOLUME, mFrame);
-//    mTraffic = (ImageView) mapItem(Item.TRAFFIC, mFrame);
+    hideNavBottomSheet();
   }
 
-  @Override
-  public void onResume(@Nullable Runnable procAfterMeasurement)
+  private void onStopClicked()
   {
-    measureContent(procAfterMeasurement);
-    refresh();
+    mNavMenuListener.onStopClicked();
   }
 
-  public boolean isOpen()
+  private void onSettingsClicked()
   {
-    return mIsOpen;
+    mNavMenuListener.onSettingsClicked();
   }
 
-  public boolean isAnimating()
-  {
-    return mAnimating;
-  }
-
-  public boolean open(boolean animate)
-  {
-    if ((animate && mAnimating) || isOpen())
-      return false;
-
-    mIsOpen = true;
-
-    UiUtils.show(mContentFrame);
-    adjustTransparency();
-    updateMarker();
-
-    setToggleState(mIsOpen, animate);
-    if (!animate)
-      return true;
-
-    mFrame.setTranslationY(mContentHeight);
-    mFrame.animate()
-          .setDuration(mAnimationDuration)
-          .translationY(0.0f)
-          .setListener(new AnimationListener())
-          .start();
-
-    return true;
-  }
-
-  public boolean close(boolean animate, @Nullable final Runnable onCloseListener)
-  {
-    if (mAnimating || !isOpen())
-    {
-      if (onCloseListener != null)
-        onCloseListener.run();
-
-      return false;
-    }
-
-    mIsOpen = false;
-    setToggleState(mIsOpen, animate);
-
-    if (!animate)
-    {
-      UiUtils.hide(mContentFrame);
-      adjustTransparency();
-      updateMarker();
-
-      if (onCloseListener != null)
-        onCloseListener.run();
-
-      return true;
-    }
-
-    mFrame.animate()
-          .setDuration(mAnimationDuration)
-          .translationY(mContentHeight)
-          .setListener(new AnimationListener()
-          {
-            @Override
-            public void onAnimationEnd(Animator animation)
-            {
-              super.onAnimationEnd(animation);
-              mFrame.setTranslationY(0.0f);
-              UiUtils.hide(mContentFrame);
-              adjustTransparency();
-              updateMarker();
-
-              if (onCloseListener != null)
-                onCloseListener.run();
-            }
-          }).start();
-
-    return true;
-  }
-
-  public void toggle(boolean animate)
-  {
-    if (mAnimating)
-      return;
-
-    boolean show = !isOpen();
-
-    if (show)
-      open(animate);
-    else
-      close(animate);
-  }
-
-
-  void measureContent(@Nullable final Runnable procAfterMeasurement)
-  {
-    if (mLayoutMeasured)
-      return;
-
-    UiUtils.measureView(mContentFrame, (width, height) ->
-    {
-      if (height != 0)
-      {
-        mContentHeight = height;
-        mLayoutMeasured = true;
-
-        UiUtils.hide(mContentFrame);
-      }
-      afterLayoutMeasured(procAfterMeasurement);
-    });
-  }
-
-  public void refresh()
+  private void onTtsClicked()
   {
+    TtsPlayer.setEnabled(!TtsPlayer.isEnabled());
     refreshTts();
   }
 
+  private void toggleNavMenu()
+  {
+    if (getBottomSheetState() == BottomSheetBehavior.STATE_EXPANDED)
+      collapseNavBottomSheet();
+    else
+      expandNavBottomSheet();
+  }
+
+  public void setPeekHeight()
+  {
+    int headerHeight = mHeaderFrame.getHeight();
+    if (currentPeekHeight != headerHeight)
+    {
+      currentPeekHeight = headerHeight;
+      mNavBottomSheetBehavior.setPeekHeight(currentPeekHeight);
+    }
+  }
+
+  public void collapseNavBottomSheet()
+  {
+    mNavBottomSheetBehavior.setState(BottomSheetBehavior.STATE_COLLAPSED);
+  }
+
+  public void expandNavBottomSheet()
+  {
+    mNavBottomSheetBehavior.setState(BottomSheetBehavior.STATE_EXPANDED);
+  }
+
+  public void hideNavBottomSheet()
+  {
+    mNavBottomSheetBehavior.setState(BottomSheetBehavior.STATE_HIDDEN);
+  }
+
+  public int getBottomSheetState()
+  {
+    return mNavBottomSheetBehavior.getState();
+  }
+
   public void refreshTts()
   {
-    mTts.setImageDrawable(TtsPlayer.isEnabled() ? Graphics.tint(mFrame.getContext(), R.drawable.ic_voice_on,
-                                                                R.attr.colorAccent)
-                                                : Graphics.tint(mFrame.getContext(), R.drawable.ic_voice_off));
+    mTts.setImageDrawable(TtsPlayer.isEnabled() ? Graphics.tint(mActivity, R.drawable.ic_voice_on,
+        R.attr.colorAccent)
+        : Graphics.tint(mActivity, R.drawable.ic_voice_off));
   }
 
-  public void refreshTraffic()
+
+  private void updateTime(int seconds)
   {
-    Drawable onIcon = Graphics.tint(mFrame.getContext(), R.drawable.ic_setting_traffic_on,
-                                    R.attr.colorAccent);
-    Drawable offIcon = Graphics.tint(mFrame.getContext(), R.drawable.ic_setting_traffic_off);
-//   mTraffic.setImageDrawable(TrafficManager.INSTANCE.isEnabled() ? onIcon : offIcon);
+    updateTimeLeft(seconds);
+    updateTimeEstimate(seconds);
   }
 
-  @Override
-  protected void setToggleState(boolean open, boolean animate)
+  private void updateTimeLeft(int seconds)
   {
-    final float to = open ? -90.0f : 90.0f;
-    if (!animate)
+    final long hours = TimeUnit.SECONDS.toHours(seconds);
+    final long minutes = TimeUnit.SECONDS.toMinutes(seconds) % 60;
+    mTimeMinuteValue.setText(String.valueOf(minutes));
+    String min = mActivity.getResources().getString(R.string.minute);
+    mTimeMinuteUnits.setText(min);
+    if (hours == 0)
     {
-      mToggle.setRotation(to);
-      mToggle.invalidate();
+      UiUtils.hide(mTimeHourUnits, mTimeHourValue);
       return;
     }
-
-    final float from = -to;
-    ValueAnimator animator = ValueAnimator.ofFloat(from, to);
-    animator.addUpdateListener(animation -> mToggle.setRotation((float) animation.getAnimatedValue()));
-
-    animator.setDuration(mAnimationDuration);
-    animator.start();
+    UiUtils.setTextAndShow(mTimeHourValue, String.valueOf(hours));
+    String hour = mActivity.getResources().getString(R.string.hour);
+    UiUtils.setTextAndShow(mTimeHourUnits, hour);
   }
 
-  @Override
-  protected int getHeightResId()
+  private void updateTimeEstimate(int seconds)
   {
-    return R.dimen.nav_menu_height;
+    final Calendar currentTime = Calendar.getInstance();
+    currentTime.add(Calendar.SECOND, seconds);
+    DateFormat timeFormat;
+    if (android.text.format.DateFormat.is24HourFormat(mTimeMinuteValue.getContext()))
+      timeFormat = new SimpleDateFormat("HH:mm", Locale.getDefault());
+    else
+      timeFormat = new SimpleDateFormat("h:mm aa", Locale.getDefault());
+    mTimeEstimate.setText(timeFormat.format(currentTime.getTime()));
   }
 
-  @Override
-  protected void adjustTransparency() {}
 
-  @Override
-  public void show(boolean show)
+  private void updateSpeedView(@NonNull RoutingInfo info)
   {
-    super.show(show);
-    measureContent(null);
-    UiUtils.showIf(show, mTts);
+    final Location last = LocationHelper.INSTANCE.getSavedLocation();
+    if (last == null)
+      return;
+
+    Pair<String, String> speedAndUnits = StringUtils.nativeFormatSpeedAndUnits(last.getSpeed());
+
+    mSpeedUnits.setText(speedAndUnits.second);
+    mSpeedValue.setText(speedAndUnits.first);
+    mSpeedViewContainer.setActivated(info.isSpeedLimitExceeded());
+  }
+
+  public void update(@NonNull RoutingInfo info)
+  {
+    updateSpeedView(info);
+    updateTime(info.totalTimeInSeconds);
+    mDistanceValue.setText(info.distToTarget);
+    mDistanceUnits.setText(info.targetUnits);
+    mRouteProgress.setProgress((int) info.completionPercent);
+  }
+
+  public interface NavMenuListener
+  {
+    void onStopClicked();
+
+    void onSettingsClicked();
   }
 }
diff --git a/android/src/com/mapswithme/util/bottomsheet/MenuBottomSheetFragment.java b/android/src/com/mapswithme/util/bottomsheet/MenuBottomSheetFragment.java
index 3c97dc83a0..d0fcf71a18 100644
--- a/android/src/com/mapswithme/util/bottomsheet/MenuBottomSheetFragment.java
+++ b/android/src/com/mapswithme/util/bottomsheet/MenuBottomSheetFragment.java
@@ -59,8 +59,8 @@ public class MenuBottomSheetFragment extends BottomSheetDialogFragment
   public int getTheme()
   {
     return ThemeUtils.isNightTheme(requireContext())
-        ? R.style.MwmTheme_Night_BottomSheetDialog
-        : R.style.MwmTheme_BottomSheetDialog;
+        ? R.style.MwmWidget_Night_BottomSheetDialog
+        : R.style.MwmWidget_BottomSheetDialog;
   }
 
   @Override