Update the gesture nav tutorial to use a mock transient taskbar

These are temporary UI updates until the redesigned gesture nav tutorial is ready.

Fixes: 265857697
Test: ran tutorial on large screen device
Change-Id: I3e50de1b0f5cd9e84dccea17c7ac07d3668e1168
diff --git a/quickstep/res/drawable/mock_app_icon.xml b/quickstep/res/drawable/mock_app_icon.xml
new file mode 100644
index 0000000..92cdea3
--- /dev/null
+++ b/quickstep/res/drawable/mock_app_icon.xml
@@ -0,0 +1,21 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Copyright (C) 2023 The Android Open Source Project
+
+     Licensed under the Apache License, Version 2.0 (the "License");
+     you may not use this file except in compliance with the License.
+     You may obtain a copy of the License at
+
+          http://www.apache.org/licenses/LICENSE-2.0
+
+     Unless required by applicable law or agreed to in writing, software
+     distributed under the License is distributed on an "AS IS" BASIS,
+     WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+     See the License for the specific language governing permissions and
+     limitations under the License.
+-->
+<shape
+    xmlns:android="http://schemas.android.com/apk/res/android"
+    android:shape="rectangle">
+    <solid android:color="@color/mock_app_icon" />
+    <corners android:radius="@dimen/gesture_tutorial_taskbar_icon_corner_radius" />
+</shape>
\ No newline at end of file
diff --git a/quickstep/res/drawable/mock_taskbar_background.xml b/quickstep/res/drawable/mock_taskbar_background.xml
new file mode 100644
index 0000000..8ac9080
--- /dev/null
+++ b/quickstep/res/drawable/mock_taskbar_background.xml
@@ -0,0 +1,21 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Copyright (C) 2023 The Android Open Source Project
+
+     Licensed under the Apache License, Version 2.0 (the "License");
+     you may not use this file except in compliance with the License.
+     You may obtain a copy of the License at
+
+          http://www.apache.org/licenses/LICENSE-2.0
+
+     Unless required by applicable law or agreed to in writing, software
+     distributed under the License is distributed on an "AS IS" BASIS,
+     WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+     See the License for the specific language governing permissions and
+     limitations under the License.
+-->
+<shape
+    xmlns:android="http://schemas.android.com/apk/res/android"
+    android:shape="rectangle">
+    <solid android:color="@color/gesture_tutorial_taskbar_color" />
+    <corners android:radius="@dimen/gesture_tutorial_taskbar_corner_radius" />
+</shape>
\ No newline at end of file
diff --git a/quickstep/res/layout-land/gesture_tutorial_mock_hotseat.xml b/quickstep/res/layout-land/gesture_tutorial_mock_hotseat.xml
index 20d2ecc..1e2e014 100644
--- a/quickstep/res/layout-land/gesture_tutorial_mock_hotseat.xml
+++ b/quickstep/res/layout-land/gesture_tutorial_mock_hotseat.xml
@@ -31,7 +31,7 @@
 
         app:cardElevation="0dp"
         app:cardCornerRadius="@dimen/gesture_tutorial_hotseat_icon_corner_radius"
-        app:cardBackgroundColor="@color/mock_app_icon_1"
+        app:cardBackgroundColor="@color/mock_app_icon"
         app:layout_constraintDimensionRatio="1:1"
         app:layout_constraintVertical_chainStyle="spread_inside"
         app:layout_constraintTop_toTopOf="parent"
@@ -45,7 +45,7 @@
 
         app:cardElevation="0dp"
         app:cardCornerRadius="@dimen/gesture_tutorial_hotseat_icon_corner_radius"
-        app:cardBackgroundColor="@color/mock_app_icon_2"
+        app:cardBackgroundColor="@color/mock_app_icon"
         app:layout_constraintDimensionRatio="1:1"
         app:layout_constraintTop_toBottomOf="@id/hotseat_icon_1"
         app:layout_constraintBottom_toTopOf="@id/hotseat_icon_3"
@@ -58,7 +58,7 @@
 
         app:cardElevation="0dp"
         app:cardCornerRadius="@dimen/gesture_tutorial_hotseat_icon_corner_radius"
-        app:cardBackgroundColor="@color/mock_app_icon_3"
+        app:cardBackgroundColor="@color/mock_app_icon"
         app:layout_constraintDimensionRatio="1:1"
         app:layout_constraintTop_toBottomOf="@id/hotseat_icon_2"
         app:layout_constraintBottom_toTopOf="@id/hotseat_icon_4"
@@ -71,7 +71,7 @@
 
         app:cardElevation="0dp"
         app:cardCornerRadius="@dimen/gesture_tutorial_hotseat_icon_corner_radius"
-        app:cardBackgroundColor="@color/mock_app_icon_4"
+        app:cardBackgroundColor="@color/mock_app_icon"
         app:layout_constraintDimensionRatio="1:1"
         app:layout_constraintTop_toBottomOf="@id/hotseat_icon_3"
         app:layout_constraintBottom_toBottomOf="parent"
diff --git a/quickstep/res/layout-land/gesture_tutorial_tablet_mock_hotseat.xml b/quickstep/res/layout-land/gesture_tutorial_tablet_mock_hotseat.xml
index 6877b89..f04fbb6 100644
--- a/quickstep/res/layout-land/gesture_tutorial_tablet_mock_hotseat.xml
+++ b/quickstep/res/layout-land/gesture_tutorial_tablet_mock_hotseat.xml
@@ -43,7 +43,7 @@
 
         app:cardElevation="0dp"
         app:cardCornerRadius="@dimen/gesture_tutorial_hotseat_icon_corner_radius"
-        app:cardBackgroundColor="@color/mock_app_icon_1"
+        app:cardBackgroundColor="@color/mock_app_icon"
         app:layout_constraintDimensionRatio="1:1"
         app:layout_constraintTop_toTopOf="parent"
         app:layout_constraintBottom_toBottomOf="parent"
@@ -57,7 +57,7 @@
 
         app:cardElevation="0dp"
         app:cardCornerRadius="@dimen/gesture_tutorial_hotseat_icon_corner_radius"
-        app:cardBackgroundColor="@color/mock_app_icon_2"
+        app:cardBackgroundColor="@color/mock_app_icon"
         app:layout_constraintDimensionRatio="1:1"
         app:layout_constraintTop_toTopOf="parent"
         app:layout_constraintBottom_toBottomOf="parent"
@@ -71,7 +71,7 @@
 
         app:cardElevation="0dp"
         app:cardCornerRadius="@dimen/gesture_tutorial_hotseat_icon_corner_radius"
-        app:cardBackgroundColor="@color/mock_app_icon_3"
+        app:cardBackgroundColor="@color/mock_app_icon"
         app:layout_constraintDimensionRatio="1:1"
         app:layout_constraintTop_toTopOf="parent"
         app:layout_constraintBottom_toBottomOf="parent"
@@ -85,7 +85,7 @@
 
         app:cardElevation="0dp"
         app:cardCornerRadius="@dimen/gesture_tutorial_hotseat_icon_corner_radius"
-        app:cardBackgroundColor="@color/mock_app_icon_1"
+        app:cardBackgroundColor="@color/mock_app_icon"
         app:layout_constraintDimensionRatio="1:1"
         app:layout_constraintTop_toTopOf="parent"
         app:layout_constraintBottom_toBottomOf="parent"
@@ -99,25 +99,11 @@
 
         app:cardElevation="0dp"
         app:cardCornerRadius="@dimen/gesture_tutorial_hotseat_icon_corner_radius"
-        app:cardBackgroundColor="@color/mock_app_icon_4"
+        app:cardBackgroundColor="@color/mock_app_icon"
         app:layout_constraintDimensionRatio="1:1"
         app:layout_constraintTop_toTopOf="parent"
         app:layout_constraintBottom_toBottomOf="parent"
         app:layout_constraintStart_toEndOf="@id/hotseat_icon_4"
-        app:layout_constraintEnd_toStartOf="@id/hotseat_icon_6"/>
-
-    <androidx.cardview.widget.CardView
-        android:id="@+id/hotseat_icon_6"
-        android:layout_width="@dimen/gesture_tutorial_hotseat_icon_size"
-        android:layout_height="@dimen/gesture_tutorial_hotseat_icon_size"
-
-        app:cardElevation="0dp"
-        app:cardCornerRadius="@dimen/gesture_tutorial_hotseat_icon_corner_radius"
-        app:cardBackgroundColor="@color/mock_app_icon_2"
-        app:layout_constraintDimensionRatio="1:1"
-        app:layout_constraintTop_toTopOf="parent"
-        app:layout_constraintBottom_toBottomOf="parent"
-        app:layout_constraintStart_toEndOf="@id/hotseat_icon_5"
         app:layout_constraintEnd_toEndOf="parent"/>
 
 </androidx.constraintlayout.widget.ConstraintLayout>
\ No newline at end of file
diff --git a/quickstep/res/layout/gesture_tutorial_foldable_mock_hotseat.xml b/quickstep/res/layout/gesture_tutorial_foldable_mock_hotseat.xml
index 027e4a0..363f14e 100644
--- a/quickstep/res/layout/gesture_tutorial_foldable_mock_hotseat.xml
+++ b/quickstep/res/layout/gesture_tutorial_foldable_mock_hotseat.xml
@@ -42,7 +42,7 @@
 
         app:cardElevation="0dp"
         app:cardCornerRadius="@dimen/gesture_tutorial_hotseat_icon_corner_radius"
-        app:cardBackgroundColor="@color/mock_app_icon_1"
+        app:cardBackgroundColor="@color/mock_app_icon"
         app:layout_constraintDimensionRatio="1:1"
         app:layout_constraintHorizontal_chainStyle="spread_inside"
         app:layout_constraintTop_toBottomOf="@id/hotseat_search_bar"
@@ -57,7 +57,7 @@
 
         app:cardElevation="0dp"
         app:cardCornerRadius="@dimen/gesture_tutorial_hotseat_icon_corner_radius"
-        app:cardBackgroundColor="@color/mock_app_icon_2"
+        app:cardBackgroundColor="@color/mock_app_icon"
         app:layout_constraintDimensionRatio="1:1"
         app:layout_constraintTop_toBottomOf="@id/hotseat_search_bar"
         app:layout_constraintStart_toEndOf="@id/hotseat_icon_1"
@@ -71,7 +71,7 @@
 
         app:cardElevation="0dp"
         app:cardCornerRadius="@dimen/gesture_tutorial_hotseat_icon_corner_radius"
-        app:cardBackgroundColor="@color/mock_app_icon_3"
+        app:cardBackgroundColor="@color/mock_app_icon"
         app:layout_constraintDimensionRatio="1:1"
         app:layout_constraintTop_toBottomOf="@id/hotseat_search_bar"
         app:layout_constraintStart_toEndOf="@id/hotseat_icon_2"
@@ -85,7 +85,7 @@
 
         app:cardElevation="0dp"
         app:cardCornerRadius="@dimen/gesture_tutorial_hotseat_icon_corner_radius"
-        app:cardBackgroundColor="@color/mock_app_icon_1"
+        app:cardBackgroundColor="@color/mock_app_icon"
         app:layout_constraintDimensionRatio="1:1"
         app:layout_constraintTop_toBottomOf="@id/hotseat_search_bar"
         app:layout_constraintStart_toEndOf="@id/hotseat_icon_3"
@@ -99,24 +99,10 @@
 
         app:cardElevation="0dp"
         app:cardCornerRadius="@dimen/gesture_tutorial_hotseat_icon_corner_radius"
-        app:cardBackgroundColor="@color/mock_app_icon_4"
+        app:cardBackgroundColor="@color/mock_app_icon"
         app:layout_constraintDimensionRatio="1:1"
         app:layout_constraintTop_toBottomOf="@id/hotseat_search_bar"
         app:layout_constraintStart_toEndOf="@id/hotseat_icon_4"
-        app:layout_constraintEnd_toStartOf="@id/hotseat_icon_6"/>
-
-    <androidx.cardview.widget.CardView
-        android:id="@+id/hotseat_icon_6"
-        android:layout_width="@dimen/gesture_tutorial_hotseat_icon_size"
-        android:layout_height="@dimen/gesture_tutorial_hotseat_icon_size"
-        android:layout_marginTop="@dimen/gesture_tutorial_hotseat_icon_search_margin"
-
-        app:cardElevation="0dp"
-        app:cardCornerRadius="@dimen/gesture_tutorial_hotseat_icon_corner_radius"
-        app:cardBackgroundColor="@color/mock_app_icon_2"
-        app:layout_constraintDimensionRatio="1:1"
-        app:layout_constraintTop_toBottomOf="@id/hotseat_search_bar"
-        app:layout_constraintStart_toEndOf="@id/hotseat_icon_5"
         app:layout_constraintEnd_toEndOf="parent"/>
 
 </androidx.constraintlayout.widget.ConstraintLayout>
\ No newline at end of file
diff --git a/quickstep/res/layout/gesture_tutorial_fragment.xml b/quickstep/res/layout/gesture_tutorial_fragment.xml
index b3ca297..8eeef67 100644
--- a/quickstep/res/layout/gesture_tutorial_fragment.xml
+++ b/quickstep/res/layout/gesture_tutorial_fragment.xml
@@ -102,11 +102,11 @@
     <include
         layout="@layout/gesture_tutorial_tablet_mock_taskbar"
         android:id="@+id/gesture_tutorial_fake_taskbar_view"
-        android:layout_width="match_parent"
-        android:layout_height="@dimen/gesture_tutorial_mock_taskbar_height"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
         android:layout_alignParentBottom="true"
-        android:layout_alignParentStart="true"
-        android:layout_alignParentEnd="true" />
+        android:layout_centerHorizontal="true"
+        android:layout_marginBottom="@dimen/gesture_tutorial_taskbar_margin_bottom"/>
 
     <ImageView
         android:id="@+id/gesture_tutorial_edge_gesture_video"
diff --git a/quickstep/res/layout/gesture_tutorial_mock_hotseat.xml b/quickstep/res/layout/gesture_tutorial_mock_hotseat.xml
index b3e86cf..8513dcf 100644
--- a/quickstep/res/layout/gesture_tutorial_mock_hotseat.xml
+++ b/quickstep/res/layout/gesture_tutorial_mock_hotseat.xml
@@ -15,7 +15,7 @@
 
         app:cardElevation="0dp"
         app:cardCornerRadius="@dimen/gesture_tutorial_hotseat_icon_corner_radius"
-        app:cardBackgroundColor="@color/mock_app_icon_1"
+        app:cardBackgroundColor="@color/mock_app_icon"
         app:layout_constraintDimensionRatio="1:1"
         app:layout_constraintHorizontal_chainStyle="spread_inside"
         app:layout_constraintTop_toTopOf="parent"
@@ -29,7 +29,7 @@
 
         app:cardElevation="0dp"
         app:cardCornerRadius="@dimen/gesture_tutorial_hotseat_icon_corner_radius"
-        app:cardBackgroundColor="@color/mock_app_icon_2"
+        app:cardBackgroundColor="@color/mock_app_icon"
         app:layout_constraintDimensionRatio="1:1"
         app:layout_constraintTop_toTopOf="parent"
         app:layout_constraintStart_toEndOf="@id/hotseat_icon_1"
@@ -42,7 +42,7 @@
 
         app:cardElevation="0dp"
         app:cardCornerRadius="@dimen/gesture_tutorial_hotseat_icon_corner_radius"
-        app:cardBackgroundColor="@color/mock_app_icon_3"
+        app:cardBackgroundColor="@color/mock_app_icon"
         app:layout_constraintDimensionRatio="1:1"
         app:layout_constraintTop_toTopOf="parent"
         app:layout_constraintStart_toEndOf="@id/hotseat_icon_2"
@@ -55,7 +55,7 @@
 
         app:cardElevation="0dp"
         app:cardCornerRadius="@dimen/gesture_tutorial_hotseat_icon_corner_radius"
-        app:cardBackgroundColor="@color/mock_app_icon_4"
+        app:cardBackgroundColor="@color/mock_app_icon"
         app:layout_constraintDimensionRatio="1:1"
         app:layout_constraintTop_toTopOf="parent"
         app:layout_constraintStart_toEndOf="@id/hotseat_icon_3"
diff --git a/quickstep/res/layout/gesture_tutorial_tablet_mock_hotseat.xml b/quickstep/res/layout/gesture_tutorial_tablet_mock_hotseat.xml
index 027e4a0..363f14e 100644
--- a/quickstep/res/layout/gesture_tutorial_tablet_mock_hotseat.xml
+++ b/quickstep/res/layout/gesture_tutorial_tablet_mock_hotseat.xml
@@ -42,7 +42,7 @@
 
         app:cardElevation="0dp"
         app:cardCornerRadius="@dimen/gesture_tutorial_hotseat_icon_corner_radius"
-        app:cardBackgroundColor="@color/mock_app_icon_1"
+        app:cardBackgroundColor="@color/mock_app_icon"
         app:layout_constraintDimensionRatio="1:1"
         app:layout_constraintHorizontal_chainStyle="spread_inside"
         app:layout_constraintTop_toBottomOf="@id/hotseat_search_bar"
@@ -57,7 +57,7 @@
 
         app:cardElevation="0dp"
         app:cardCornerRadius="@dimen/gesture_tutorial_hotseat_icon_corner_radius"
-        app:cardBackgroundColor="@color/mock_app_icon_2"
+        app:cardBackgroundColor="@color/mock_app_icon"
         app:layout_constraintDimensionRatio="1:1"
         app:layout_constraintTop_toBottomOf="@id/hotseat_search_bar"
         app:layout_constraintStart_toEndOf="@id/hotseat_icon_1"
@@ -71,7 +71,7 @@
 
         app:cardElevation="0dp"
         app:cardCornerRadius="@dimen/gesture_tutorial_hotseat_icon_corner_radius"
-        app:cardBackgroundColor="@color/mock_app_icon_3"
+        app:cardBackgroundColor="@color/mock_app_icon"
         app:layout_constraintDimensionRatio="1:1"
         app:layout_constraintTop_toBottomOf="@id/hotseat_search_bar"
         app:layout_constraintStart_toEndOf="@id/hotseat_icon_2"
@@ -85,7 +85,7 @@
 
         app:cardElevation="0dp"
         app:cardCornerRadius="@dimen/gesture_tutorial_hotseat_icon_corner_radius"
-        app:cardBackgroundColor="@color/mock_app_icon_1"
+        app:cardBackgroundColor="@color/mock_app_icon"
         app:layout_constraintDimensionRatio="1:1"
         app:layout_constraintTop_toBottomOf="@id/hotseat_search_bar"
         app:layout_constraintStart_toEndOf="@id/hotseat_icon_3"
@@ -99,24 +99,10 @@
 
         app:cardElevation="0dp"
         app:cardCornerRadius="@dimen/gesture_tutorial_hotseat_icon_corner_radius"
-        app:cardBackgroundColor="@color/mock_app_icon_4"
+        app:cardBackgroundColor="@color/mock_app_icon"
         app:layout_constraintDimensionRatio="1:1"
         app:layout_constraintTop_toBottomOf="@id/hotseat_search_bar"
         app:layout_constraintStart_toEndOf="@id/hotseat_icon_4"
-        app:layout_constraintEnd_toStartOf="@id/hotseat_icon_6"/>
-
-    <androidx.cardview.widget.CardView
-        android:id="@+id/hotseat_icon_6"
-        android:layout_width="@dimen/gesture_tutorial_hotseat_icon_size"
-        android:layout_height="@dimen/gesture_tutorial_hotseat_icon_size"
-        android:layout_marginTop="@dimen/gesture_tutorial_hotseat_icon_search_margin"
-
-        app:cardElevation="0dp"
-        app:cardCornerRadius="@dimen/gesture_tutorial_hotseat_icon_corner_radius"
-        app:cardBackgroundColor="@color/mock_app_icon_2"
-        app:layout_constraintDimensionRatio="1:1"
-        app:layout_constraintTop_toBottomOf="@id/hotseat_search_bar"
-        app:layout_constraintStart_toEndOf="@id/hotseat_icon_5"
         app:layout_constraintEnd_toEndOf="parent"/>
 
 </androidx.constraintlayout.widget.ConstraintLayout>
\ No newline at end of file
diff --git a/quickstep/res/layout/gesture_tutorial_tablet_mock_taskbar.xml b/quickstep/res/layout/gesture_tutorial_tablet_mock_taskbar.xml
index ddfeeec..bc68928 100644
--- a/quickstep/res/layout/gesture_tutorial_tablet_mock_taskbar.xml
+++ b/quickstep/res/layout/gesture_tutorial_tablet_mock_taskbar.xml
@@ -2,115 +2,240 @@
 <com.android.quickstep.interaction.AnimatedTaskbarView
     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="@dimen/gesture_tutorial_mock_taskbar_height">
+    android:layout_width="wrap_content"
+    android:layout_height="wrap_content"
+    android:clipChildren="false">
 
+    <!-- Pill-shaped background -->
     <View
         android:id="@+id/taskbar_background"
-        android:layout_width="match_parent"
-        android:layout_height="match_parent"
-        android:background="@color/gesture_tutorial_taskbar_color"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        android:background="@drawable/mock_taskbar_background"
+        android:clipToOutline="true"
 
         app:layout_constraintTop_toTopOf="parent"
         app:layout_constraintBottom_toBottomOf="parent"
         app:layout_constraintStart_toStartOf="parent"
         app:layout_constraintEnd_toEndOf="parent"/>
 
+    <!-- Container for the all apps button and app icons -->
     <androidx.constraintlayout.widget.ConstraintLayout
         android:id="@+id/icon_container"
-        android:layout_width="match_parent"
-        android:layout_height="match_parent"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_margin="@dimen/gesture_tutorial_taskbar_padding"
 
         app:layout_constraintTop_toTopOf="parent"
         app:layout_constraintBottom_toBottomOf="parent"
         app:layout_constraintStart_toStartOf="parent"
         app:layout_constraintEnd_toEndOf="parent">
 
-        <androidx.cardview.widget.CardView
+        <!-- All apps button -->
+        <androidx.constraintlayout.widget.ConstraintLayout
+            android:id="@+id/taskbar_all_apps"
+            android:layout_width="@dimen/gesture_tutorial_taskbar_icon_size"
+            android:layout_height="@dimen/gesture_tutorial_taskbar_icon_size"
+            android:layout_marginEnd="@dimen/taskbar_icon_spacing"
+            android:padding="@dimen/gesture_tutorial_taskbar_padding"
+
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintEnd_toStartOf="@id/taskbar_icon_1"
+            app:layout_constraintTop_toTopOf="parent"
+            app:layout_constraintBottom_toBottomOf="parent">
+
+            <!-- 9 mini circles representing the all apps button icon -->
+            <View
+                android:id="@+id/all_apps_mini_1"
+                android:layout_width="@dimen/gesture_tutorial_taskbar_all_apps_mini_size"
+                android:layout_height="@dimen/gesture_tutorial_taskbar_all_apps_mini_size"
+                android:background="@drawable/mock_app_icon"
+                android:clipToOutline="true"
+
+                app:layout_constraintDimensionRatio="1:1"
+                app:layout_constraintHorizontal_chainStyle="spread_inside"
+                app:layout_constraintVertical_chainStyle="spread_inside"
+                app:layout_constraintTop_toTopOf="parent"
+                app:layout_constraintBottom_toTopOf="@id/all_apps_mini_4"
+                app:layout_constraintStart_toStartOf="parent"
+                app:layout_constraintEnd_toStartOf="@id/all_apps_mini_2"/>
+
+            <View
+                android:id="@+id/all_apps_mini_2"
+                android:layout_width="@dimen/gesture_tutorial_taskbar_all_apps_mini_size"
+                android:layout_height="@dimen/gesture_tutorial_taskbar_all_apps_mini_size"
+                android:background="@drawable/mock_app_icon"
+                android:clipToOutline="true"
+
+                app:layout_constraintDimensionRatio="1:1"
+                app:layout_constraintVertical_chainStyle="spread_inside"
+                app:layout_constraintTop_toTopOf="parent"
+                app:layout_constraintBottom_toTopOf="@id/all_apps_mini_5"
+                app:layout_constraintStart_toEndOf="@id/all_apps_mini_1"
+                app:layout_constraintEnd_toStartOf="@id/all_apps_mini_3"/>
+
+            <View
+                android:id="@+id/all_apps_mini_3"
+                android:layout_width="@dimen/gesture_tutorial_taskbar_all_apps_mini_size"
+                android:layout_height="@dimen/gesture_tutorial_taskbar_all_apps_mini_size"
+                android:background="@drawable/mock_app_icon"
+                android:clipToOutline="true"
+
+                app:layout_constraintDimensionRatio="1:1"
+                app:layout_constraintVertical_chainStyle="spread_inside"
+                app:layout_constraintTop_toTopOf="parent"
+                app:layout_constraintBottom_toTopOf="@id/all_apps_mini_6"
+                app:layout_constraintStart_toEndOf="@id/all_apps_mini_2"
+                app:layout_constraintEnd_toEndOf="parent"/>
+
+            <View
+                android:id="@+id/all_apps_mini_4"
+                android:layout_width="@dimen/gesture_tutorial_taskbar_all_apps_mini_size"
+                android:layout_height="@dimen/gesture_tutorial_taskbar_all_apps_mini_size"
+                android:background="@drawable/mock_app_icon"
+                android:clipToOutline="true"
+
+                app:layout_constraintHorizontal_chainStyle="spread_inside"
+                app:layout_constraintDimensionRatio="1:1"
+                app:layout_constraintTop_toBottomOf="@id/all_apps_mini_1"
+                app:layout_constraintBottom_toTopOf="@id/all_apps_mini_7"
+                app:layout_constraintStart_toStartOf="parent"
+                app:layout_constraintEnd_toStartOf="@id/all_apps_mini_5"/>
+
+            <View
+                android:id="@+id/all_apps_mini_5"
+                android:layout_width="@dimen/gesture_tutorial_taskbar_all_apps_mini_size"
+                android:layout_height="@dimen/gesture_tutorial_taskbar_all_apps_mini_size"
+                android:background="@drawable/mock_app_icon"
+                android:clipToOutline="true"
+
+                app:layout_constraintDimensionRatio="1:1"
+                app:layout_constraintTop_toBottomOf="@id/all_apps_mini_2"
+                app:layout_constraintBottom_toTopOf="@id/all_apps_mini_8"
+                app:layout_constraintStart_toEndOf="@id/all_apps_mini_4"
+                app:layout_constraintEnd_toStartOf="@id/all_apps_mini_6"/>
+
+            <View
+                android:id="@+id/all_apps_mini_6"
+                android:layout_width="@dimen/gesture_tutorial_taskbar_all_apps_mini_size"
+                android:layout_height="@dimen/gesture_tutorial_taskbar_all_apps_mini_size"
+                android:background="@drawable/mock_app_icon"
+                android:clipToOutline="true"
+
+                app:layout_constraintDimensionRatio="1:1"
+                app:layout_constraintTop_toBottomOf="@id/all_apps_mini_3"
+                app:layout_constraintBottom_toTopOf="@id/all_apps_mini_9"
+                app:layout_constraintStart_toEndOf="@id/all_apps_mini_5"
+                app:layout_constraintEnd_toEndOf="parent"/>
+
+            <View
+                android:id="@+id/all_apps_mini_7"
+                android:layout_width="@dimen/gesture_tutorial_taskbar_all_apps_mini_size"
+                android:layout_height="@dimen/gesture_tutorial_taskbar_all_apps_mini_size"
+                android:background="@drawable/mock_app_icon"
+                android:clipToOutline="true"
+
+                app:layout_constraintHorizontal_chainStyle="spread_inside"
+                app:layout_constraintTop_toBottomOf="@id/all_apps_mini_4"
+                app:layout_constraintBottom_toBottomOf="parent"
+                app:layout_constraintStart_toStartOf="parent"
+                app:layout_constraintEnd_toStartOf="@id/all_apps_mini_8"/>
+
+            <View
+                android:id="@+id/all_apps_mini_8"
+                android:layout_width="@dimen/gesture_tutorial_taskbar_all_apps_mini_size"
+                android:layout_height="@dimen/gesture_tutorial_taskbar_all_apps_mini_size"
+                android:background="@drawable/mock_app_icon"
+                android:clipToOutline="true"
+
+                app:layout_constraintTop_toBottomOf="@id/all_apps_mini_5"
+                app:layout_constraintBottom_toBottomOf="parent"
+                app:layout_constraintStart_toEndOf="@id/all_apps_mini_7"
+                app:layout_constraintEnd_toStartOf="@id/all_apps_mini_9"/>
+
+            <View
+                android:id="@+id/all_apps_mini_9"
+                android:layout_width="@dimen/gesture_tutorial_taskbar_all_apps_mini_size"
+                android:layout_height="@dimen/gesture_tutorial_taskbar_all_apps_mini_size"
+                android:background="@drawable/mock_app_icon"
+                android:clipToOutline="true"
+
+                app:layout_constraintTop_toBottomOf="@id/all_apps_mini_6"
+                app:layout_constraintBottom_toBottomOf="parent"
+                app:layout_constraintStart_toEndOf="@id/all_apps_mini_8"
+                app:layout_constraintEnd_toEndOf="parent"/>
+
+        </androidx.constraintlayout.widget.ConstraintLayout>
+
+        <!-- App icons -->
+        <View
             android:id="@+id/taskbar_icon_1"
             android:layout_width="@dimen/gesture_tutorial_taskbar_icon_size"
             android:layout_height="@dimen/gesture_tutorial_taskbar_icon_size"
-            android:layout_marginStart="@dimen/gesture_tutorial_taskbar_padding_start_end"
+            android:layout_marginStart="@dimen/taskbar_icon_spacing"
+            android:layout_marginEnd="@dimen/taskbar_icon_spacing"
+            android:background="@drawable/mock_app_icon"
+            android:clipToOutline="true"
 
-            app:cardElevation="0dp"
-            app:cardCornerRadius="@dimen/gesture_tutorial_taskbar_icon_corner_radius"
-            app:cardBackgroundColor="@color/mock_app_icon_1"
-            app:layout_constraintDimensionRatio="1:1"
             app:layout_constraintHorizontal_chainStyle="spread_inside"
             app:layout_constraintTop_toTopOf="parent"
             app:layout_constraintBottom_toBottomOf="parent"
-            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintStart_toEndOf="@id/taskbar_all_apps"
             app:layout_constraintEnd_toStartOf="@id/taskbar_icon_2"/>
 
-        <androidx.cardview.widget.CardView
+        <View
             android:id="@+id/taskbar_icon_2"
             android:layout_width="@dimen/gesture_tutorial_taskbar_icon_size"
             android:layout_height="@dimen/gesture_tutorial_taskbar_icon_size"
+            android:layout_marginStart="@dimen/taskbar_icon_spacing"
+            android:layout_marginEnd="@dimen/taskbar_icon_spacing"
+            android:background="@drawable/mock_app_icon"
+            android:clipToOutline="true"
 
-            app:cardElevation="0dp"
-            app:cardCornerRadius="@dimen/gesture_tutorial_taskbar_icon_corner_radius"
-            app:cardBackgroundColor="@color/mock_app_icon_2"
-            app:layout_constraintDimensionRatio="1:1"
             app:layout_constraintTop_toTopOf="parent"
             app:layout_constraintBottom_toBottomOf="parent"
             app:layout_constraintStart_toEndOf="@id/taskbar_icon_1"
             app:layout_constraintEnd_toStartOf="@id/taskbar_icon_3"/>
 
-        <androidx.cardview.widget.CardView
+        <View
             android:id="@+id/taskbar_icon_3"
             android:layout_width="@dimen/gesture_tutorial_taskbar_icon_size"
             android:layout_height="@dimen/gesture_tutorial_taskbar_icon_size"
+            android:layout_marginStart="@dimen/taskbar_icon_spacing"
+            android:layout_marginEnd="@dimen/taskbar_icon_spacing"
+            android:background="@drawable/mock_app_icon"
+            android:clipToOutline="true"
 
-            app:cardElevation="0dp"
-            app:cardCornerRadius="@dimen/gesture_tutorial_taskbar_icon_corner_radius"
-            app:cardBackgroundColor="@color/mock_app_icon_3"
-            app:layout_constraintDimensionRatio="1:1"
             app:layout_constraintTop_toTopOf="parent"
             app:layout_constraintBottom_toBottomOf="parent"
             app:layout_constraintStart_toEndOf="@id/taskbar_icon_2"
             app:layout_constraintEnd_toStartOf="@id/taskbar_icon_4"/>
 
-        <androidx.cardview.widget.CardView
+        <View
             android:id="@+id/taskbar_icon_4"
             android:layout_width="@dimen/gesture_tutorial_taskbar_icon_size"
             android:layout_height="@dimen/gesture_tutorial_taskbar_icon_size"
+            android:layout_marginStart="@dimen/taskbar_icon_spacing"
+            android:layout_marginEnd="@dimen/taskbar_icon_spacing"
+            android:background="@drawable/mock_app_icon"
+            android:clipToOutline="true"
 
-            app:cardElevation="0dp"
-            app:cardCornerRadius="@dimen/gesture_tutorial_taskbar_icon_corner_radius"
-            app:cardBackgroundColor="@color/mock_app_icon_1"
-            app:layout_constraintDimensionRatio="1:1"
             app:layout_constraintTop_toTopOf="parent"
             app:layout_constraintBottom_toBottomOf="parent"
             app:layout_constraintStart_toEndOf="@id/taskbar_icon_3"
             app:layout_constraintEnd_toStartOf="@id/taskbar_icon_5"/>
 
-        <androidx.cardview.widget.CardView
+        <View
             android:id="@+id/taskbar_icon_5"
             android:layout_width="@dimen/gesture_tutorial_taskbar_icon_size"
             android:layout_height="@dimen/gesture_tutorial_taskbar_icon_size"
+            android:layout_marginStart="@dimen/taskbar_icon_spacing"
+            android:background="@drawable/mock_app_icon"
+            android:clipToOutline="true"
 
-            app:cardElevation="0dp"
-            app:cardCornerRadius="@dimen/gesture_tutorial_taskbar_icon_corner_radius"
-            app:cardBackgroundColor="@color/mock_app_icon_4"
-            app:layout_constraintDimensionRatio="1:1"
             app:layout_constraintTop_toTopOf="parent"
             app:layout_constraintBottom_toBottomOf="parent"
             app:layout_constraintStart_toEndOf="@id/taskbar_icon_4"
-            app:layout_constraintEnd_toStartOf="@id/taskbar_icon_6"/>
-
-        <androidx.cardview.widget.CardView
-            android:id="@+id/taskbar_icon_6"
-            android:layout_width="@dimen/gesture_tutorial_taskbar_icon_size"
-            android:layout_height="@dimen/gesture_tutorial_taskbar_icon_size"
-            android:layout_marginEnd="@dimen/gesture_tutorial_taskbar_padding_start_end"
-
-            app:cardElevation="0dp"
-            app:cardCornerRadius="@dimen/gesture_tutorial_taskbar_icon_corner_radius"
-            app:cardBackgroundColor="@color/mock_app_icon_2"
-            app:layout_constraintDimensionRatio="1:1"
-            app:layout_constraintTop_toTopOf="parent"
-            app:layout_constraintBottom_toBottomOf="parent"
-            app:layout_constraintStart_toEndOf="@id/taskbar_icon_5"
             app:layout_constraintEnd_toEndOf="parent"/>
 
     </androidx.constraintlayout.widget.ConstraintLayout>
diff --git a/quickstep/res/values/colors.xml b/quickstep/res/values/colors.xml
index 262e418..86244b9 100644
--- a/quickstep/res/values/colors.xml
+++ b/quickstep/res/values/colors.xml
@@ -40,13 +40,10 @@
     <color name="gesture_tutorial_fake_task_view_color">#6DA1FF</color> <!-- Light Blue -->
     <!-- Must contrast gesture_tutorial_fake_wallpaper_color -->
     <color name="gesture_tutorial_fake_previous_task_view_color">#3C4043</color> <!-- Gray -->
-    <color name="gesture_tutorial_taskbar_color">#202124</color>
+    <color name="gesture_tutorial_taskbar_color">#E8EAED</color>
 
     <!-- Mock hotseat -->
-    <color name="mock_app_icon_1">#8AB4F8</color>
-    <color name="mock_app_icon_2">#F28B82</color>
-    <color name="mock_app_icon_3">#FDD663</color>
-    <color name="mock_app_icon_4">#81C995</color>
+    <color name="mock_app_icon">#BDC1C6</color>
     <color name="mock_search_bar">#3C4043</color>
 
     <!-- Mock conversation -->
diff --git a/quickstep/res/values/dimens.xml b/quickstep/res/values/dimens.xml
index d97e435..d339d28 100644
--- a/quickstep/res/values/dimens.xml
+++ b/quickstep/res/values/dimens.xml
@@ -196,9 +196,13 @@
     <integer name="gesture_tutorial_webpage_extra_lines_visibility">0</integer> <!-- VISIBLE -->
 
     <!-- Gesture Tutorial mock taskbar -->
-    <dimen name="gesture_tutorial_taskbar_icon_size">44dp</dimen>
+    <dimen name="gesture_tutorial_taskbar_icon_size">52dp</dimen>
+    <dimen name="gesture_tutorial_taskbar_all_apps_mini_size">7dp</dimen>
     <dimen name="gesture_tutorial_taskbar_icon_corner_radius">100dp</dimen>
-    <dimen name="gesture_tutorial_taskbar_padding_start_end">52dp</dimen>
+    <dimen name="gesture_tutorial_taskbar_corner_radius">100dp</dimen>
+    <dimen name="gesture_tutorial_taskbar_padding">12dp</dimen>
+    <dimen name="gesture_tutorial_taskbar_icon_spacing">24dp</dimen>
+    <dimen name="gesture_tutorial_taskbar_margin_bottom">24dp</dimen>
 
     <!-- All Set page -->
     <dimen name="allset_page_margin_horizontal">40dp</dimen>
diff --git a/quickstep/src/com/android/quickstep/interaction/AnimatedTaskbarView.java b/quickstep/src/com/android/quickstep/interaction/AnimatedTaskbarView.java
index e8cc45b..d706711 100644
--- a/quickstep/src/com/android/quickstep/interaction/AnimatedTaskbarView.java
+++ b/quickstep/src/com/android/quickstep/interaction/AnimatedTaskbarView.java
@@ -43,12 +43,12 @@
 
     private View mBackground;
     private View mIconContainer;
+    private View mAllAppsButton;
     private View mIcon1;
     private View mIcon2;
     private View mIcon3;
     private View mIcon4;
     private View mIcon5;
-    private View mIcon6;
 
     @Nullable private Animator mRunningAnimator;
 
@@ -78,12 +78,12 @@
 
         mBackground = findViewById(R.id.taskbar_background);
         mIconContainer = findViewById(R.id.icon_container);
+        mAllAppsButton = findViewById(R.id.taskbar_all_apps);
         mIcon1 = findViewById(R.id.taskbar_icon_1);
         mIcon2 = findViewById(R.id.taskbar_icon_2);
         mIcon3 = findViewById(R.id.taskbar_icon_3);
         mIcon4 = findViewById(R.id.taskbar_icon_4);
         mIcon5 = findViewById(R.id.taskbar_icon_5);
-        mIcon6 = findViewById(R.id.taskbar_icon_6);
     }
 
     /**
@@ -92,22 +92,20 @@
     public void animateDisappearanceToHotseat(ViewGroup hotseat) {
         ArrayList<Animator> animators = new ArrayList<>();
         int hotseatTop = hotseat.getTop();
+        int hotseatLeft = hotseat.getLeft();
 
-        animators.add(ObjectAnimator.ofFloat(
-                mBackground, View.TRANSLATION_Y, 0, mBackground.getHeight()));
         animators.add(ObjectAnimator.ofFloat(mBackground, View.ALPHA, 1f, 0f));
+        animators.add(ObjectAnimator.ofFloat(mAllAppsButton, View.ALPHA, 1f, 0f));
         animators.add(createIconDisappearanceToHotseatAnimator(
-                mIcon1, hotseat.findViewById(R.id.hotseat_icon_1), hotseatTop));
+                mIcon1, hotseat.findViewById(R.id.hotseat_icon_1), hotseatTop, hotseatLeft));
         animators.add(createIconDisappearanceToHotseatAnimator(
-                mIcon2, hotseat.findViewById(R.id.hotseat_icon_2), hotseatTop));
+                mIcon2, hotseat.findViewById(R.id.hotseat_icon_2), hotseatTop, hotseatLeft));
         animators.add(createIconDisappearanceToHotseatAnimator(
-                mIcon3, hotseat.findViewById(R.id.hotseat_icon_3), hotseatTop));
+                mIcon3, hotseat.findViewById(R.id.hotseat_icon_3), hotseatTop, hotseatLeft));
         animators.add(createIconDisappearanceToHotseatAnimator(
-                mIcon4, hotseat.findViewById(R.id.hotseat_icon_4), hotseatTop));
+                mIcon4, hotseat.findViewById(R.id.hotseat_icon_4), hotseatTop, hotseatLeft));
         animators.add(createIconDisappearanceToHotseatAnimator(
-                mIcon5, hotseat.findViewById(R.id.hotseat_icon_5), hotseatTop));
-        animators.add(createIconDisappearanceToHotseatAnimator(
-                mIcon6, hotseat.findViewById(R.id.hotseat_icon_6), hotseatTop));
+                mIcon5, hotseat.findViewById(R.id.hotseat_icon_5), hotseatTop, hotseatLeft));
 
         AnimatorSet animatorSet = new AnimatorSet();
 
@@ -135,22 +133,20 @@
     public void animateAppearanceFromHotseat(ViewGroup hotseat) {
         ArrayList<Animator> animators = new ArrayList<>();
         int hotseatTop = hotseat.getTop();
+        int hotseatLeft = hotseat.getLeft();
 
-        animators.add(ObjectAnimator.ofFloat(
-                mBackground, View.TRANSLATION_Y, mBackground.getHeight(), 0));
         animators.add(ObjectAnimator.ofFloat(mBackground, View.ALPHA, 0f, 1f));
+        animators.add(ObjectAnimator.ofFloat(mAllAppsButton, View.ALPHA, 0f, 1f));
         animators.add(createIconAppearanceFromHotseatAnimator(
-                mIcon1, hotseat.findViewById(R.id.hotseat_icon_1), hotseatTop));
+                mIcon1, hotseat.findViewById(R.id.hotseat_icon_1), hotseatTop, hotseatLeft));
         animators.add(createIconAppearanceFromHotseatAnimator(
-                mIcon2, hotseat.findViewById(R.id.hotseat_icon_2), hotseatTop));
+                mIcon2, hotseat.findViewById(R.id.hotseat_icon_2), hotseatTop, hotseatLeft));
         animators.add(createIconAppearanceFromHotseatAnimator(
-                mIcon3, hotseat.findViewById(R.id.hotseat_icon_3), hotseatTop));
+                mIcon3, hotseat.findViewById(R.id.hotseat_icon_3), hotseatTop, hotseatLeft));
         animators.add(createIconAppearanceFromHotseatAnimator(
-                mIcon4, hotseat.findViewById(R.id.hotseat_icon_4), hotseatTop));
+                mIcon4, hotseat.findViewById(R.id.hotseat_icon_4), hotseatTop, hotseatLeft));
         animators.add(createIconAppearanceFromHotseatAnimator(
-                mIcon5, hotseat.findViewById(R.id.hotseat_icon_5), hotseatTop));
-        animators.add(createIconAppearanceFromHotseatAnimator(
-                mIcon6, hotseat.findViewById(R.id.hotseat_icon_6), hotseatTop));
+                mIcon5, hotseat.findViewById(R.id.hotseat_icon_5), hotseatTop, hotseatLeft));
 
         AnimatorSet animatorSet = new AnimatorSet();
 
@@ -166,98 +162,6 @@
         start(animatorSet);
     }
 
-    /**
-     * Animates this fake taskbar's disappearance to the bottom of the screen.
-     */
-    public void animateDisappearanceToBottom() {
-        ArrayList<Animator> animators = new ArrayList<>();
-
-        animators.add(ObjectAnimator.ofFloat(
-                mBackground, View.TRANSLATION_Y, 0, mBackground.getHeight()));
-        animators.add(ObjectAnimator.ofFloat(mBackground, View.ALPHA, 1f, 0f));
-        animators.add(ObjectAnimator.ofFloat(mIconContainer, View.SCALE_X, 1f, 0f));
-        animators.add(ObjectAnimator.ofFloat(mIconContainer, View.SCALE_Y, 1f, 0f));
-
-        initializeIconContainerPivot();
-
-        AnimatorSet animatorSet = new AnimatorSet();
-
-        animatorSet.playTogether(animators);
-        animatorSet.addListener(new AnimatorListenerAdapter() {
-            @Override
-            public void onAnimationEnd(Animator animation) {
-                super.onAnimationEnd(animation);
-                setVisibility(INVISIBLE);
-                resetIconContainerPivot();
-            }
-
-            @Override
-            public void onAnimationCancel(Animator animation) {
-                super.onAnimationCancel(animation);
-                resetIconContainerPivot();
-            }
-
-            @Override
-            public void onAnimationStart(Animator animation) {
-                super.onAnimationStart(animation);
-                setVisibility(VISIBLE);
-            }
-        });
-
-        start(animatorSet);
-    }
-
-    /**
-     * Animates this fake taskbar's appearance from the bottom of the screen.
-     */
-    public void animateAppearanceFromBottom() {
-        ArrayList<Animator> animators = new ArrayList<>();
-
-        animators.add(ObjectAnimator.ofFloat(
-                mBackground, View.TRANSLATION_Y, mBackground.getHeight(), 0));
-        animators.add(ObjectAnimator.ofFloat(mBackground, View.ALPHA, 0f, 1f));
-        animators.add(ObjectAnimator.ofFloat(mIconContainer, View.SCALE_X, 0f, 1f));
-        animators.add(ObjectAnimator.ofFloat(mIconContainer, View.SCALE_Y, 0f, 1f));
-
-        initializeIconContainerPivot();
-
-        AnimatorSet animatorSet = new AnimatorSet();
-
-        animatorSet.playTogether(animators);
-        animatorSet.addListener(new AnimatorListenerAdapter() {
-            @Override
-            public void onAnimationStart(Animator animation) {
-                super.onAnimationStart(animation);
-                setVisibility(VISIBLE);
-            }
-
-            @Override
-            public void onAnimationEnd(Animator animation) {
-                super.onAnimationEnd(animation);
-                resetIconContainerPivot();
-            }
-
-            @Override
-            public void onAnimationCancel(Animator animation) {
-                super.onAnimationCancel(animation);
-                resetIconContainerPivot();
-            }
-        });
-
-        start(animatorSet);
-    }
-
-    private void initializeIconContainerPivot() {
-        mIconContainer.setPivotX(getWidth() / 2f);
-        mIconContainer.setPivotY(getHeight() * 0.8f);
-    }
-
-    private void resetIconContainerPivot() {
-        mIconContainer.resetPivot();
-        mIconContainer.setScaleX(1f);
-        mIconContainer.setScaleY(1f);
-    }
-
     private void start(Animator animator) {
         if (mRunningAnimator != null) {
             mRunningAnimator.cancel();
@@ -287,7 +191,7 @@
     }
 
     private Animator createIconDisappearanceToHotseatAnimator(
-            View taskbarIcon, View hotseatIcon, int hotseatTop) {
+            View taskbarIcon, View hotseatIcon, int hotseatTop, int hotseatLeft) {
         ArrayList<Animator> animators = new ArrayList<>();
 
         animators.add(ObjectAnimator.ofFloat(
@@ -296,7 +200,10 @@
                 0,
                 (hotseatTop + hotseatIcon.getTop()) - (getTop() + taskbarIcon.getTop())));
         animators.add(ObjectAnimator.ofFloat(
-                taskbarIcon, View.TRANSLATION_X, 0, hotseatIcon.getLeft() - taskbarIcon.getLeft()));
+                taskbarIcon,
+                View.TRANSLATION_X,
+                0,
+                (hotseatLeft + hotseatIcon.getLeft()) - (getLeft() + taskbarIcon.getLeft())));
         animators.add(ObjectAnimator.ofFloat(
                 taskbarIcon,
                 View.SCALE_X,
@@ -330,7 +237,7 @@
     }
 
     private Animator createIconAppearanceFromHotseatAnimator(
-            View taskbarIcon, View hotseatIcon, int hotseatTop) {
+            View taskbarIcon, View hotseatIcon, int hotseatTop, int hotseatLeft) {
         ArrayList<Animator> animators = new ArrayList<>();
 
         animators.add(ObjectAnimator.ofFloat(
@@ -339,7 +246,10 @@
                 (hotseatTop + hotseatIcon.getTop()) - (getTop() + taskbarIcon.getTop()),
                 0));
         animators.add(ObjectAnimator.ofFloat(
-                taskbarIcon, View.TRANSLATION_X, hotseatIcon.getLeft() - taskbarIcon.getLeft(), 0));
+                taskbarIcon,
+                View.TRANSLATION_X,
+                (hotseatLeft + hotseatIcon.getLeft()) - (getLeft() + taskbarIcon.getLeft()),
+                0));
         animators.add(ObjectAnimator.ofFloat(
                 taskbarIcon,
                 View.SCALE_X,
diff --git a/quickstep/src/com/android/quickstep/interaction/OverviewGestureTutorialController.java b/quickstep/src/com/android/quickstep/interaction/OverviewGestureTutorialController.java
index 05b246b..b00dc47 100644
--- a/quickstep/src/com/android/quickstep/interaction/OverviewGestureTutorialController.java
+++ b/quickstep/src/com/android/quickstep/interaction/OverviewGestureTutorialController.java
@@ -154,7 +154,6 @@
 
         AnimatorSet animset = new AnimatorSet();
         animset.playTogether(animators);
-        hideFakeTaskbar(/* animateToHotseat= */ false);
         animset.start();
         mRunningWindowAnim = SwipeUpAnimationLogic.RunningWindowAnim.wrap(animset);
     }
diff --git a/quickstep/src/com/android/quickstep/interaction/OverviewGestureTutorialFragment.java b/quickstep/src/com/android/quickstep/interaction/OverviewGestureTutorialFragment.java
index 4e1521f..1e8b48d0 100644
--- a/quickstep/src/com/android/quickstep/interaction/OverviewGestureTutorialFragment.java
+++ b/quickstep/src/com/android/quickstep/interaction/OverviewGestureTutorialFragment.java
@@ -76,7 +76,7 @@
             @Override
             public void onAnimationEnd(Animator animation) {
                 super.onAnimationEnd(animation);
-                controller.resetFakeTaskView(false);
+                controller.resetFakeTaskViewFromOverview();
             }
         });
         ArrayList<Animator> animators = new ArrayList<>();
diff --git a/quickstep/src/com/android/quickstep/interaction/SwipeUpGestureTutorialController.java b/quickstep/src/com/android/quickstep/interaction/SwipeUpGestureTutorialController.java
index 670ee9b..de93818 100644
--- a/quickstep/src/com/android/quickstep/interaction/SwipeUpGestureTutorialController.java
+++ b/quickstep/src/com/android/quickstep/interaction/SwipeUpGestureTutorialController.java
@@ -203,7 +203,15 @@
         mRunningWindowAnim = RunningWindowAnim.wrap(animset);
     }
 
+    void resetFakeTaskViewFromOverview() {
+        resetFakeTaskView(false, false);
+    }
+
     void resetFakeTaskView(boolean animateFromHome) {
+        resetFakeTaskView(animateFromHome, true);
+    }
+
+    void resetFakeTaskView(boolean animateFromHome, boolean animateTaskbar) {
         mFakeTaskView.setVisibility(View.VISIBLE);
         PendingAnimation anim = new PendingAnimation(300);
         anim.setFloat(mTaskViewSwipeUpAnimation
@@ -211,7 +219,9 @@
         anim.setViewAlpha(mFakeTaskView, 1, ACCEL);
         anim.addListener(mResetTaskView);
         AnimatorSet animset = anim.buildAnim();
-        showFakeTaskbar(animateFromHome);
+        if (animateTaskbar) {
+            showFakeTaskbar(animateFromHome);
+        }
         animset.start();
         mRunningWindowAnim = RunningWindowAnim.wrap(animset);
     }
diff --git a/quickstep/src/com/android/quickstep/interaction/TutorialController.java b/quickstep/src/com/android/quickstep/interaction/TutorialController.java
index fa7d848..e775ce3 100644
--- a/quickstep/src/com/android/quickstep/interaction/TutorialController.java
+++ b/quickstep/src/com/android/quickstep/interaction/TutorialController.java
@@ -478,8 +478,6 @@
         if (animateToHotseat) {
             mFakeTaskbarViewCallback = () ->
                     mFakeTaskbarView.animateDisappearanceToHotseat(mFakeHotseatView);
-        } else {
-            mFakeTaskbarViewCallback = mFakeTaskbarView::animateDisappearanceToBottom;
         }
         mFakeTaskbarView.post(mFakeTaskbarViewCallback);
     }
@@ -494,8 +492,6 @@
         if (animateFromHotseat) {
             mFakeTaskbarViewCallback = () ->
                     mFakeTaskbarView.animateAppearanceFromHotseat(mFakeHotseatView);
-        } else {
-            mFakeTaskbarViewCallback = mFakeTaskbarView::animateAppearanceFromBottom;
         }
         mFakeTaskbarView.post(mFakeTaskbarViewCallback);
     }