For #11324 - Adds trash icon to swipe to delete

app/src/main/java/org/mozilla/fenix/browser/BrowserFragment.kt

@@ -275,9 +275,4 @@ class BrowserFragment : BaseBrowserFragment(), UserInteractionHandler {
         ) + ContextMenuCandidate.createOpenInExternalAppCandidate(requireContext(),
             contextMenuCandidateAppLinksUseCases)
     }
-
-    companion object {
-        private const val SHARED_TRANSITION_MS = 200L
-        private const val TAB_ITEM_TRANSITION_NAME = "tab_item"
-    }
 }

app/src/main/java/org/mozilla/fenix/tabtray/TabsTouchHelper.kt

@@ -4,14 +4,86 @@
 
 package org.mozilla.fenix.tabtray
 
+import android.graphics.Canvas
+import android.graphics.drawable.Drawable
+import androidx.appcompat.content.res.AppCompatResources
 import androidx.recyclerview.widget.ItemTouchHelper
+import androidx.recyclerview.widget.RecyclerView
 import mozilla.components.browser.tabstray.TabTouchCallback
 import mozilla.components.concept.tabstray.TabsTray
 import mozilla.components.support.base.observer.Observable
+import mozilla.components.support.ktx.android.content.getColorFromAttr
+import mozilla.components.support.ktx.android.content.getDrawableWithTint
+import mozilla.components.support.ktx.android.util.dpToPx
+import org.mozilla.fenix.R
+import org.mozilla.fenix.home.sessioncontrol.SwipeToDeleteCallback
 
 class TabsTouchHelper(observable: Observable<TabsTray.Observer>) :
     ItemTouchHelper(object : TabTouchCallback(observable) {
-        override fun alphaForItemSwipe(dX: Float, distanceToAlphaMin: Int): Float {
-            return 1f - 2f * Math.abs(dX) / distanceToAlphaMin
+        override fun onChildDraw(
+            c: Canvas,
+            recyclerView: RecyclerView,
+            viewHolder: RecyclerView.ViewHolder,
+            dX: Float,
+            dY: Float,
+            actionState: Int,
+            isCurrentlyActive: Boolean
+        ) {
+            super.onChildDraw(c, recyclerView, viewHolder, dX, dY, actionState, isCurrentlyActive)
+            val icon = recyclerView.context.getDrawableWithTint(
+                R.drawable.ic_delete,
+                recyclerView.context.getColorFromAttr(R.attr.destructive)
+            )!!
+            val background = AppCompatResources.getDrawable(
+                recyclerView.context,
+                R.drawable.tab_tray_background
+            )!!
+            val itemView = viewHolder.itemView
+            val iconLeft: Int
+            val iconRight: Int
+            val margin =
+                SwipeToDeleteCallback.MARGIN.dpToPx(recyclerView.context.resources.displayMetrics)
+            val iconWidth = icon.intrinsicWidth
+            val iconHeight = icon.intrinsicHeight
+            val cellHeight = itemView.bottom - itemView.top
+            val iconTop = itemView.top + (cellHeight - iconHeight) / 2
+            val iconBottom = iconTop + iconHeight
+
+            when {
+                dX > 0 -> { // Swiping to the right
+                    iconLeft = itemView.left + margin
+                    iconRight = itemView.left + margin + iconWidth
+                    background.setBounds(
+                        itemView.left, itemView.top,
+                        (itemView.left + dX).toInt() + SwipeToDeleteCallback.BACKGROUND_CORNER_OFFSET,
+                        itemView.bottom
+                    )
+                    icon.setBounds(iconLeft, iconTop, iconRight, iconBottom)
+                    draw(background, icon, c)
+                }
+                dX < 0 -> { // Swiping to the left
+                    iconLeft = itemView.right - margin - iconWidth
+                    iconRight = itemView.right - margin
+                    background.setBounds(
+                        (itemView.right + dX).toInt() - SwipeToDeleteCallback.BACKGROUND_CORNER_OFFSET,
+                        itemView.top, itemView.right, itemView.bottom
+                    )
+                    icon.setBounds(iconLeft, iconTop, iconRight, iconBottom)
+                    draw(background, icon, c)
+                }
+                else -> { // View not swiped
+                    background.setBounds(0, 0, 0, 0)
+                    icon.setBounds(0, 0, 0, 0)
+                }
+            }
+        }
+
+        private fun draw(
+            background: Drawable,
+            icon: Drawable,
+            c: Canvas
+        ) {
+            background.draw(c)
+            icon.draw(c)
         }
     })

app/src/main/res/drawable/tab_tray_background.xml

@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!-- This Source Code Form is subject to the terms of the Mozilla Public
+   - License, v. 2.0. If a copy of the MPL was not distributed with this
+   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
+<shape xmlns:android="http://schemas.android.com/apk/res/android"
+    android:shape="rectangle">
+    <solid android:color="@color/swipe_delete_background_normal_theme" />
+</shape>

app/src/main/res/values/attrs.xml

@@ -54,14 +54,15 @@
     <attr name="syncedTabsSeparator" format="reference"/>
 
     <!-- Tab tray -->
-    <attr name="tabTrayItemBackground" format="reference" />
-    <attr name="tabTrayItemSelectedBackground" format="reference" />
-    <attr name="tabTrayToolbarBackground" format="reference" />
     <attr name="tabTrayItemMediaBackground" format="reference" />
     <attr name="tabTrayHeadingIcon" format="reference" />
     <attr name="tabTrayHeadingIconInactive" format="reference" />
     <attr name="tabTrayThumbnailItemBackground" format="reference" />
     <attr name="tabTrayThumbnailIcon" format="reference" />
+    <!-- Note - these are currently unused, but they are for if/when we add private UI to tabs tray -->
+    <attr name="tabTrayItemBackground" format="reference" />
+    <attr name="tabTrayItemSelectedBackground" format="reference" />
+    <attr name="tabTrayToolbarBackground" format="reference" />
 
     <declare-styleable name="TrackingProtectionCategory">
         <attr name="categoryItemTitle" format="reference" />

app/src/main/res/values/colors.xml

@@ -76,7 +76,7 @@
     <color name="tab_tray_item_text_light_theme">@color/ink_80</color>
     <color name="tab_tray_item_url_light_theme">@color/dark_grey_05</color>
     <color name="tab_tray_item_background_light_theme">@color/light_grey_10</color>
-    <color name="tab_tray_item_selected_background_light_theme">@color/violet_70_12a</color>
+    <color name="tab_tray_item_selected_background_light_theme">#E5DFF4</color>
     <color name="tab_tray_toolbar_background_light_theme">@color/light_grey_10</color>
     <color name="tab_tray_item_divider_light_theme">@color/light_grey_30</color>
     <color name="tab_tray_item_media_stroke">#ffffff</color>
@@ -136,7 +136,7 @@
     <color name="tab_tray_item_text_dark_theme">@color/light_grey_05</color>
     <color name="tab_tray_item_url_dark_theme">@color/light_grey_60</color>
     <color name="tab_tray_item_background_dark_theme">@color/dark_grey_80</color>
-    <color name="tab_tray_item_selected_background_dark_theme">@color/violet_50_32a</color>
+    <color name="tab_tray_item_selected_background_dark_theme">#412E69</color>
     <color name="tab_tray_toolbar_background_dark_theme">@color/dark_grey_50</color>
     <color name="tab_tray_item_divider_dark_theme">@color/dark_grey_10</color>
     <color name="tab_tray_item_media_background_dark_theme">#9059FF</color>
@@ -190,7 +190,7 @@
     <color name="tab_tray_item_text_private_theme">@color/light_grey_05</color>
     <color name="tab_tray_item_url_private_theme">@color/light_grey_60</color>
     <color name="tab_tray_item_background_private_theme">@color/ink_90</color>
-    <color name="tab_tray_item_selected_background_private_theme">@color/violet_50_32a</color>
+    <color name="tab_tray_item_selected_background_private_theme">#422875</color>
     <color name="tab_tray_toolbar_background_private_theme">@color/ink_50</color>
     <color name="tab_tray_item_divider_private_theme">@color/dark_grey_10</color>
     <color name="tab_tray_item_media_background_private_theme">#9059FF</color>