From 8b27a486355e45219c5f9e5d58b7c5274c193be3 Mon Sep 17 00:00:00 2001
From: David Walsh <davidwalsh83@gmail.com>
Date: Fri, 24 Apr 2020 11:42:24 -0500
Subject: [PATCH] For #10329 - Implement tab tray divider

---
 app/src/main/java/org/mozilla/fenix/HomeActivity.kt | 12 ++++++++++++
 app/src/main/res/drawable/tab_tray_divider.xml      | 12 ++++++++++++
 app/src/main/res/values-ldrtl/dimens.xml            |  4 ++++
 app/src/main/res/values-night/colors.xml            |  1 +
 app/src/main/res/values/attrs.xml                   |  1 +
 app/src/main/res/values/colors.xml                  |  4 ++++
 app/src/main/res/values/dimens.xml                  |  4 ++++
 app/src/main/res/values/styles.xml                  |  2 ++
 8 files changed, 40 insertions(+)
 create mode 100644 app/src/main/res/drawable/tab_tray_divider.xml

diff --git a/app/src/main/java/org/mozilla/fenix/HomeActivity.kt b/app/src/main/java/org/mozilla/fenix/HomeActivity.kt
index 013f79775..f5c390efe 100644
--- a/app/src/main/java/org/mozilla/fenix/HomeActivity.kt
+++ b/app/src/main/java/org/mozilla/fenix/HomeActivity.kt
@@ -15,6 +15,7 @@ import androidx.annotation.IdRes
 import androidx.annotation.VisibleForTesting
 import androidx.annotation.VisibleForTesting.PROTECTED
 import androidx.appcompat.app.ActionBar
+import androidx.appcompat.content.res.AppCompatResources
 import androidx.appcompat.widget.Toolbar
 import androidx.core.view.doOnPreDraw
 import androidx.lifecycle.lifecycleScope
@@ -23,6 +24,7 @@ import androidx.navigation.NavDirections
 import androidx.navigation.fragment.NavHostFragment
 import androidx.navigation.ui.AppBarConfiguration
 import androidx.navigation.ui.NavigationUI
+import androidx.recyclerview.widget.DividerItemDecoration
 import androidx.recyclerview.widget.LinearLayoutManager
 import kotlinx.android.synthetic.main.activity_home.*
 import kotlinx.coroutines.CoroutineScope
@@ -221,6 +223,16 @@ open class HomeActivity : LocaleAwareAppCompatActivity() {
         TabsTray::class.java.name -> {
             val layout = LinearLayoutManager(context)
             val adapter = TabsAdapter { parentView, tabsTray ->
+                val decoration = DividerItemDecoration(
+                    context,
+                    DividerItemDecoration.VERTICAL
+                )
+                val drawable = AppCompatResources.getDrawable(context, R.drawable.tab_tray_divider)
+                drawable?.let {
+                    decoration.setDrawable(it)
+                    tabsTray.addItemDecoration(decoration)
+                }
+
                 DefaultTabViewHolder(
                     LayoutInflater.from(parentView.context).inflate(
                         R.layout.tab_tray_item,
diff --git a/app/src/main/res/drawable/tab_tray_divider.xml b/app/src/main/res/drawable/tab_tray_divider.xml
new file mode 100644
index 000000000..d9ec10609
--- /dev/null
+++ b/app/src/main/res/drawable/tab_tray_divider.xml
@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!-- Do this along with adding your values and values-ldrtl dimensions. -->
+<inset xmlns:android="http://schemas.android.com/apk/res/android"
+    android:insetLeft="@dimen/tab_tray_divider_margin_start"
+    android:insetRight="@dimen/tab_tray_divider_margin_end">
+
+    <shape>
+        <size android:height="1dp"/>
+        <solid android:color="?tabTrayItemDivider" />
+    </shape>
+
+</inset>
diff --git a/app/src/main/res/values-ldrtl/dimens.xml b/app/src/main/res/values-ldrtl/dimens.xml
index 1d4fc34d0..6c31150c2 100644
--- a/app/src/main/res/values-ldrtl/dimens.xml
+++ b/app/src/main/res/values-ldrtl/dimens.xml
@@ -5,4 +5,8 @@
 <resources>
     <!--  Onboarding  -->
     <dimen name="onboarding_dual_pane_radio_button_translation_x">7dp</dimen>
+
+    <!-- Tabs Tray -->
+    <dimen name="tab_tray_divider_margin_start">0dp</dimen>
+    <dimen name="tab_tray_divider_margin_end">124dp</dimen>
 </resources>
diff --git a/app/src/main/res/values-night/colors.xml b/app/src/main/res/values-night/colors.xml
index b43bb4459..14a261ca9 100644
--- a/app/src/main/res/values-night/colors.xml
+++ b/app/src/main/res/values-night/colors.xml
@@ -49,6 +49,7 @@
     <color name="tab_tray_item_background_normal_theme">@color/tab_tray_item_background_dark_theme</color>
     <color name="tab_tray_item_selected_background_normal_theme">@color/tab_tray_item_selected_background_dark_theme</color>
     <color name="tab_tray_toolbar_background_normal_theme">@color/tab_tray_toolbar_background_dark_theme</color>
+    <color name="tab_tray_item_divider_normal_theme">@color/tab_tray_item_divider_dark_theme</color>
 
     <!-- Collection icons-->
     <color name="collection_icon_color_violet">@color/collection_icon_color_violet_dark_theme</color>
diff --git a/app/src/main/res/values/attrs.xml b/app/src/main/res/values/attrs.xml
index 4efcac268..c72db81ae 100644
--- a/app/src/main/res/values/attrs.xml
+++ b/app/src/main/res/values/attrs.xml
@@ -57,6 +57,7 @@
     <attr name="tabTrayItemBackground" format="reference" />
     <attr name="tabTrayItemSelectedBackground" format="reference" />
     <attr name="tabTrayToolbarBackground" format="reference" />
+    <attr name="tabTrayItemDivider" format="reference" />
 
     <declare-styleable name="LibraryListItem">
         <attr name="listItemTitle" format="reference" />
diff --git a/app/src/main/res/values/colors.xml b/app/src/main/res/values/colors.xml
index b3813fbd3..089a86756 100644
--- a/app/src/main/res/values/colors.xml
+++ b/app/src/main/res/values/colors.xml
@@ -63,6 +63,7 @@
     <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_toolbar_background_light_theme">@color/light_grey_10</color>
+    <color name="tab_tray_item_divider_light_theme">@color/light_grey_30</color>
 
     <!-- Dark theme color palette -->
     <color name="primary_text_dark_theme">#FBFBFE</color>
@@ -109,6 +110,7 @@
     <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_toolbar_background_dark_theme">@color/dark_grey_50</color>
+    <color name="tab_tray_item_divider_dark_theme">@color/dark_grey_10</color>
 
     <!-- Private theme color palette -->
     <color name="primary_text_private_theme">#FBFBFE</color>
@@ -154,6 +156,7 @@
     <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_toolbar_background_private_theme">@color/ink_50</color>
+    <color name="tab_tray_item_divider_private_theme">@color/dark_grey_10</color>
 
     <!-- Normal theme colors for light mode -->
     <color name="primary_text_normal_theme">@color/primary_text_light_theme</color>
@@ -198,6 +201,7 @@
     <color name="tab_tray_item_background_normal_theme">@color/tab_tray_item_background_light_theme</color>
     <color name="tab_tray_item_selected_background_normal_theme">@color/tab_tray_item_selected_background_light_theme</color>
     <color name="tab_tray_toolbar_background_normal_theme">@color/tab_tray_toolbar_background_light_theme</color>
+    <color name="tab_tray_item_divider_normal_theme">@color/tab_tray_item_divider_light_theme</color>
 
     <!-- Bookmark buttons -->
     <color name="bookmark_favicon_background">#DFDFE3</color>
diff --git a/app/src/main/res/values/dimens.xml b/app/src/main/res/values/dimens.xml
index 3479c6632..b9b063c89 100644
--- a/app/src/main/res/values/dimens.xml
+++ b/app/src/main/res/values/dimens.xml
@@ -143,4 +143,8 @@
     <dimen name="addon_details_rating_view_margin_start">6dp</dimen>
     <dimen name="addon_details_rating_view_margin_end">6dp</dimen>
 
+    <!-- Tabs Tray -->
+    <dimen name="tab_tray_divider_margin_start">124dp</dimen>
+    <dimen name="tab_tray_divider_margin_end">0dp</dimen>
+
 </resources>
diff --git a/app/src/main/res/values/styles.xml b/app/src/main/res/values/styles.xml
index c60e3728e..d80f440fa 100644
--- a/app/src/main/res/values/styles.xml
+++ b/app/src/main/res/values/styles.xml
@@ -79,6 +79,7 @@
         <item name="tabTrayItemBackground">@color/tab_tray_item_background_normal_theme</item>
         <item name="tabTrayItemSelectedBackground">@color/tab_tray_item_selected_background_normal_theme</item>
         <item name="tabTrayToolbarBackground">@color/tab_tray_toolbar_background_normal_theme</item>
+        <item name="tabTrayItemDivider">@color/tab_tray_item_divider_normal_theme</item>
 
         <!-- Drawables -->
         <item name="fenixLogo">@drawable/ic_logo_wordmark_normal</item>
@@ -202,6 +203,7 @@
         <item name="tabTrayItemBackground">@color/tab_tray_item_background_private_theme</item>
         <item name="tabTrayItemSelectedBackground">@color/tab_tray_item_selected_background_private_theme</item>
         <item name="tabTrayToolbarBackground">@color/tab_tray_toolbar_background_private_theme</item>
+        <item name="tabTrayItemDivider">@color/tab_tray_item_divider_private_theme</item>
 
         <!-- Drawables -->
         <item name="fenixLogo">@drawable/ic_logo_wordmark_private</item>