Update UI for Browse Custom Actions

-Update location and spacing of toolbar actions
-Update background of toolbar
-Update default number of actions visible
-Update spacing of actions

Fixes: 268213647
Test: manual; TestMediaApp
Change-Id: I8d9749b17c9ef7a9d1c645830b65bcd7489068d2
(cherry picked from commit 1421d0b14f70b1043c95755fb8bf00a952f02b35)
Merged-In: I8d9749b17c9ef7a9d1c645830b65bcd7489068d2

14 files changed, 118 insertions, 154 deletions

diff --git a/res/drawable/ic_more_vert.xml b/res/drawable/ic_more_vert.xml
deleted file mode 100644
index 1dcee35..0000000
--- a/res/drawable/ic_more_vert.xml
+++ /dev/null
@@ -1,10 +0,0 @@
-<vector xmlns:android="http://schemas.android.com/apk/res/android"
-    android:width="48dp"
-    android:height="48dp"
-    android:viewportWidth="48"
-    android:viewportHeight="48"
-    android:tint="?attr/colorControlNormal">
-  <path
-      android:fillColor="@android:color/white"
-      android:pathData="M24,40Q23,40 22.3,39.3Q21.6,38.6 21.6,37.6Q21.6,36.6 22.3,35.9Q23,35.2 24,35.2Q25,35.2 25.7,35.9Q26.4,36.6 26.4,37.6Q26.4,38.6 25.7,39.3Q25,40 24,40ZM24,26.4Q23,26.4 22.3,25.7Q21.6,25 21.6,24Q21.6,23 22.3,22.3Q23,21.6 24,21.6Q25,21.6 25.7,22.3Q26.4,23 26.4,24Q26.4,25 25.7,25.7Q25,26.4 24,26.4ZM24,12.8Q23,12.8 22.3,12.1Q21.6,11.4 21.6,10.4Q21.6,9.4 22.3,8.7Q23,8 24,8Q25,8 25.7,8.7Q26.4,9.4 26.4,10.4Q26.4,11.4 25.7,12.1Q25,12.8 24,12.8Z"/>
-</vector>
diff --git a/res/layout/browse_custom_action.xml b/res/layout/browse_custom_action.xml
index 3b68925..3753b40 100644
--- a/res/layout/browse_custom_action.xml
+++ b/res/layout/browse_custom_action.xml
@@ -17,26 +17,29 @@
 <androidx.constraintlayout.widget.ConstraintLayout
     xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:app="http://schemas.android.com/apk/res-auto"
-    android:layout_width="@dimen/media_browse_list_item_action_width"
+    android:layout_width="wrap_content"
     android:layout_height="match_parent">
 
   <ImageView
       android:id="@+id/browse_item_custom_action_divider"
       android:layout_width="1dp"
       android:layout_height="@dimen/media_browse_list_item_icons_size"
-      app:layout_constraintEnd_toStartOf="@+id/browse_item_custom_action"
-      app:layout_constraintTop_toTopOf="parent"
+      android:src="@drawable/media_item_divider"
+      android:layout_marginStart="@dimen/media_browse_list_item_icon_margin"
+      android:layout_marginEnd="@dimen/media_browse_list_item_icon_margin"
       app:layout_constraintBottom_toBottomOf="parent"
-      android:src="@drawable/media_item_divider"/>
+      app:layout_constraintEnd_toStartOf="@+id/browse_item_custom_action"
+      app:layout_constraintTop_toTopOf="parent" />
 
   <ImageView
       android:id="@+id/browse_item_custom_action"
       android:layout_width="@dimen/media_browse_list_item_icons_size"
       android:layout_height="@dimen/media_browse_list_item_icons_size"
-      android:padding="@dimen/media_browse_list_item_action_padding"
-      android:scaleType="centerInside"
+      android:scaleType="fitCenter"
+      android:layout_marginStart="@dimen/media_browse_list_item_icon_margin"
+      android:layout_marginEnd="@dimen/media_browse_list_item_icon_margin"
+      app:layout_constraintBottom_toBottomOf="parent"
       app:layout_constraintEnd_toEndOf="parent"
-      app:layout_constraintTop_toTopOf="parent"
-      app:layout_constraintBottom_toBottomOf="parent"/>
+      app:layout_constraintTop_toTopOf="parent" />
 
 </androidx.constraintlayout.widget.ConstraintLayout>
diff --git a/res/layout/browse_node.xml b/res/layout/browse_node.xml
index bc2a6ad..36ab251 100644
--- a/res/layout/browse_node.xml
+++ b/res/layout/browse_node.xml
@@ -33,11 +33,12 @@
 
     <com.android.car.media.browse.actionbar.BrowseActionsHeader
         android:id="@+id/toolbar_container"
-        android:layout_width="wrap_content"
+        android:layout_width="match_parent"
         android:layout_height="@dimen/car_ui_toolbar_first_row_height"
+        android:layout_marginEnd="@dimen/media_browse_header_action_margin"
+        android:elevation="2dp"
         app:layout_constraintTop_toBottomOf="@+id/ui_content_top_guideline2"
         app:layout_constraintEnd_toEndOf="parent"
-        android:layout_marginEnd="@dimen/media_browse_header_action_margin"
         android:visibility="gone" />
 
     <ImageView
diff --git a/res/layout/media_browse_grid_icons_item.xml b/res/layout/media_browse_grid_icons_item.xml
index 64dd250..079215e 100644
--- a/res/layout/media_browse_grid_icons_item.xml
+++ b/res/layout/media_browse_grid_icons_item.xml
@@ -126,29 +126,6 @@
         app:layout_constraintTop_toBottomOf="@+id/subtitle"
         app:layout_constraintBottom_toBottomOf="parent"
         app:layout_constraintStart_toStartOf="parent"
-        app:layout_constraintEnd_toStartOf="@+id/browse_item_actions_container"
-        android:visibility="gone"/>
-
-    <LinearLayout
-        android:id="@+id/browse_item_actions_container"
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        app:layout_constraintHorizontal_chainStyle="spread_inside"
-        app:layout_constraintStart_toEndOf="@+id/browse_item_progress_bar"
-        app:layout_constraintTop_toBottomOf="@+id/subtitle"
-        app:layout_constraintBottom_toBottomOf="parent"
-        app:layout_constraintEnd_toStartOf="@+id/browse_item_actions_overflow"
-        android:visibility="gone"/>
-
-    <ImageView
-        android:id="@+id/browse_item_actions_overflow"
-        android:src="@drawable/car_ui_icon_overflow_menu"
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        app:layout_constraintHorizontal_chainStyle="spread_inside"
-        app:layout_constraintStart_toEndOf="@+id/browse_item_actions_container"
-        app:layout_constraintTop_toBottomOf="@+id/subtitle"
-        app:layout_constraintBottom_toBottomOf="parent"
         app:layout_constraintEnd_toStartOf="@+id/browse_item_progress_new"
         android:visibility="gone"/>
 
diff --git a/res/layout/media_browse_grid_item.xml b/res/layout/media_browse_grid_item.xml
index b8fd628..79c8850 100644
--- a/res/layout/media_browse_grid_item.xml
+++ b/res/layout/media_browse_grid_item.xml
@@ -125,29 +125,6 @@
         app:layout_constraintTop_toBottomOf="@+id/subtitle"
         app:layout_constraintBottom_toBottomOf="parent"
         app:layout_constraintStart_toStartOf="parent"
-        app:layout_constraintEnd_toStartOf="@+id/browse_item_actions_container"
-        android:visibility="gone"/>
-
-    <LinearLayout
-        android:id="@+id/browse_item_actions_container"
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        app:layout_constraintHorizontal_chainStyle="spread_inside"
-        app:layout_constraintStart_toEndOf="@+id/browse_item_progress_bar"
-        app:layout_constraintTop_toBottomOf="@+id/subtitle"
-        app:layout_constraintBottom_toBottomOf="parent"
-        app:layout_constraintEnd_toStartOf="@+id/browse_item_actions_overflow"
-        android:visibility="gone"/>
-
-    <ImageView
-        android:id="@+id/browse_item_actions_overflow"
-        android:src="@drawable/car_ui_icon_overflow_menu"
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        app:layout_constraintHorizontal_chainStyle="spread_inside"
-        app:layout_constraintStart_toEndOf="@+id/browse_item_actions_container"
-        app:layout_constraintTop_toBottomOf="@+id/subtitle"
-        app:layout_constraintBottom_toBottomOf="parent"
         app:layout_constraintEnd_toStartOf="@+id/browse_item_progress_new"
         android:visibility="gone"/>
 
diff --git a/res/layout/media_browse_header_item.xml b/res/layout/media_browse_header_item.xml
index 0d40347..166b075 100644
--- a/res/layout/media_browse_header_item.xml
+++ b/res/layout/media_browse_header_item.xml
@@ -20,8 +20,17 @@
     android:id="@+id/item_container"
     android:layout_width="match_parent"
     android:layout_height="@dimen/media_browse_header_item_height"
-    android:layout_marginHorizontal="@dimen/media_browse_header_item_margin_x"
+    android:layout_marginStart="@dimen/media_browse_header_action_margin"
+    android:background="@drawable/car_ui_toolbar_background"
     android:orientation="horizontal">
+
+    <LinearLayout
+        android:id="@+id/browse_item_actions_container"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_gravity="center_vertical|left"
+        android:layout_marginStart="@dimen/media_browse_header_action_margin" />
+
     <TextView
         android:id="@+id/title"
         style="@style/BrowseSubheaderStyle"
@@ -29,11 +38,6 @@
         android:layout_height="wrap_content"
         android:singleLine="true"
         android:includeFontPadding="false"
-        android:layout_gravity="center_vertical|left"/>
-
-    <LinearLayout
-            android:id="@+id/browse_item_actions_container"
-            android:layout_width="wrap_content"
-            android:layout_height="wrap_content"
-            android:layout_gravity="center_vertical|right"/>
+        android:layout_gravity="center_vertical|center_horizontal"
+        android:visibility="gone"/>
 </LinearLayout>
diff --git a/res/layout/media_browse_list_icons_item.xml b/res/layout/media_browse_list_icons_item.xml
index 4926c8f..7216ffb 100644
--- a/res/layout/media_browse_list_icons_item.xml
+++ b/res/layout/media_browse_list_icons_item.xml
@@ -135,22 +135,25 @@
         app:layout_constraintTop_toTopOf="parent"
         app:layout_constraintBottom_toBottomOf="parent"/>
 
-    <LinearLayout
-        android:id="@+id/browse_item_actions_container"
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        app:layout_constraintHorizontal_chainStyle="packed"
-        app:layout_constraintTop_toTopOf="parent"
-        app:layout_constraintBottom_toBottomOf="parent"
-        app:layout_constraintEnd_toStartOf="@+id/browse_item_progress_new"
-        android:visibility="gone"/>
-
     <ImageView
         android:id="@+id/browse_item_progress_new"
         android:src="@drawable/browser_progress_new_indicator"
         android:layout_width="@dimen/media_browse_list_item_icons_size"
         android:layout_height="@dimen/media_browse_list_item_icons_size"
-        android:scaleType="centerInside"
+        android:layout_marginStart="@dimen/media_browse_list_item_icon_margin"
+        android:layout_marginEnd="@dimen/media_browse_list_item_icon_margin"
+        android:padding="@dimen/media_browse_list_item_icons_no_touch_padding"
+        android:scaleType="fitCenter"
+        app:layout_constraintHorizontal_chainStyle="packed"
+        app:layout_constraintTop_toTopOf="parent"
+        app:layout_constraintBottom_toBottomOf="parent"
+        app:layout_constraintEnd_toStartOf="@+id/browse_item_actions_container"
+        android:visibility="gone"/>
+
+    <LinearLayout
+        android:id="@+id/browse_item_actions_container"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
         app:layout_constraintHorizontal_chainStyle="packed"
         app:layout_constraintTop_toTopOf="parent"
         app:layout_constraintBottom_toBottomOf="parent"
@@ -163,7 +166,9 @@
         android:layout_width="@dimen/media_browse_list_item_icons_size"
         android:layout_height="@dimen/media_browse_list_item_icons_size"
         android:layout_marginTop="@dimen/media_browse_subtitle_margin_top"
-        android:scaleType="centerInside"
+        android:layout_marginStart="@dimen/media_browse_list_item_icon_margin"
+        android:layout_marginEnd="@dimen/media_browse_list_item_icon_margin"
+        android:scaleType="fitCenter"
         app:layout_constraintHorizontal_chainStyle="packed"
         app:layout_constraintEnd_toEndOf="parent"
         app:layout_constraintTop_toTopOf="parent"
diff --git a/res/layout/media_browse_list_item.xml b/res/layout/media_browse_list_item.xml
index 15c57ec..db2778d 100644
--- a/res/layout/media_browse_list_item.xml
+++ b/res/layout/media_browse_list_item.xml
@@ -129,26 +129,29 @@
         android:layout_width="0dp"
         android:layout_height="match_parent"
         android:orientation="vertical"
-        app:layout_constraintGuide_percent="0.65"
+        app:layout_constraintGuide_percent="0.75"
         app:layout_constraintTop_toTopOf="parent"
         app:layout_constraintBottom_toBottomOf="parent"/>
 
-    <LinearLayout
-        android:id="@+id/browse_item_actions_container"
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        app:layout_constraintHorizontal_chainStyle="packed"
-        app:layout_constraintTop_toTopOf="parent"
-        app:layout_constraintBottom_toBottomOf="parent"
-        app:layout_constraintEnd_toStartOf="@+id/browse_item_progress_new"
-        android:visibility="gone"/>
-
     <ImageView
         android:id="@+id/browse_item_progress_new"
         android:src="@drawable/browser_progress_new_indicator"
         android:layout_width="@dimen/media_browse_list_item_icons_size"
         android:layout_height="@dimen/media_browse_list_item_icons_size"
-        android:scaleType="centerInside"
+        android:layout_marginStart="@dimen/media_browse_list_item_icon_margin"
+        android:layout_marginEnd="@dimen/media_browse_list_item_icon_margin"
+        android:padding="@dimen/media_browse_list_item_icons_no_touch_padding"
+        android:scaleType="fitCenter"
+        app:layout_constraintHorizontal_chainStyle="packed"
+        app:layout_constraintTop_toTopOf="parent"
+        app:layout_constraintBottom_toBottomOf="parent"
+        app:layout_constraintEnd_toStartOf="@+id/browse_item_actions_container"
+        android:visibility="gone"/>
+
+    <LinearLayout
+        android:id="@+id/browse_item_actions_container"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
         app:layout_constraintHorizontal_chainStyle="packed"
         app:layout_constraintTop_toTopOf="parent"
         app:layout_constraintBottom_toBottomOf="parent"
@@ -161,7 +164,9 @@
         android:layout_width="@dimen/media_browse_list_item_icons_size"
         android:layout_height="@dimen/media_browse_list_item_icons_size"
         android:layout_marginTop="@dimen/media_browse_subtitle_margin_top"
-        android:scaleType="centerInside"
+        android:layout_marginStart="@dimen/media_browse_list_item_icon_margin"
+        android:layout_marginEnd="@dimen/media_browse_list_item_icon_margin"
+        android:scaleType="fitCenter"
         app:layout_constraintHorizontal_chainStyle="packed"
         app:layout_constraintEnd_toEndOf="parent"
         app:layout_constraintTop_toTopOf="parent"
diff --git a/res/values/dimens.xml b/res/values/dimens.xml
index 95b7309..aeb1af6 100644
--- a/res/values/dimens.xml
+++ b/res/values/dimens.xml
@@ -114,19 +114,18 @@
 
     <!-- media_browse_header_item.xml -->
     <dimen name="media_browse_header_item_height">76dp</dimen>
-    <dimen name="media_browse_header_item_margin_x">0dp</dimen>
-    <dimen name="media_browse_header_action_margin">76dp</dimen>
+    <dimen name="media_browse_header_action_margin">88dp</dimen>
 
     <!-- media_browse_list_[icons_]item.xml -->
     <dimen name="media_browse_list_item_height">116dp</dimen>
     <dimen name="media_browse_list_item_thumbnail_size">76dp</dimen>
     <dimen name="media_browse_list_item_text_margin_x">148dp</dimen>
     <dimen name="media_browse_list_item_icon_margin_start">0dp</dimen>
+    <dimen name="media_browse_list_item_icon_margin">16dp</dimen>
+    <dimen name="media_browse_list_item_icons_no_touch_padding">12dp</dimen>
+    <dimen name="media_browse_list_item_icons_size">@dimen/car_ui_primary_icon_size</dimen>
     <dimen name="media_browse_list_item_thumbnail_margin_bottom">4dp</dimen>
-    <dimen name="media_browse_list_item_icons_size">76dp</dimen>
-    <dimen name="media_browse_list_item_action_padding">16dp</dimen>
-    <dimen name="media_browse_list_item_action_space">22dp</dimen>
-    <dimen name="media_browse_list_item_action_width">88dp</dimen>
+
 
     <dimen name="media_browse_list_icons_item_art_margin_start">@dimen/car_ui_padding_3</dimen>
     <dimen name="media_browse_list_icons_item_text_margin_x">112dp</dimen>
diff --git a/res/values/integers.xml b/res/values/integers.xml
index 4d6a8c2..e2d86d5 100644
--- a/res/values/integers.xml
+++ b/res/values/integers.xml
@@ -64,8 +64,8 @@
     <integer-array name="playback_views_to_show_immediately_when_queue_is_visible"/>
 
     <!-- The maximum number of actions to show per item in the browse list view
-    Items beyond this limit will be in the overflow. -->
-    <integer name="max_visible_actions">2</integer>
+    before all items are in overflow -->
+    <integer name="max_visible_actions">1</integer>
 
     <!-- The maximum number of actions to show in the actions header
     Items beyond this limit will be in the overflow. -->
diff --git a/res/values/overlayable.xml b/res/values/overlayable.xml
index 755a38a..211e368 100644
--- a/res/values/overlayable.xml
+++ b/res/values/overlayable.xml
@@ -56,7 +56,6 @@ REGENERATE USING packages/apps/Car/tests/tools/rro/generate-overlayable.py
       <item type="drawable" name="ic_expand_more"/>
       <item type="drawable" name="ic_explicit_black"/>
       <item type="drawable" name="ic_file_download_done_black"/>
-      <item type="drawable" name="ic_more_vert"/>
       <item type="drawable" name="ic_queue_button"/>
       <item type="drawable" name="ic_search"/>
       <item type="drawable" name="ic_settings"/>
@@ -72,7 +71,6 @@ REGENERATE USING packages/apps/Car/tests/tools/rro/generate-overlayable.py
       <item type="id" name="background_scrim"/>
       <item type="id" name="browse_content_area"/>
       <item type="id" name="browse_item_actions_container"/>
-      <item type="id" name="browse_item_actions_overflow"/>
       <item type="id" name="browse_item_custom_action"/>
       <item type="id" name="browse_item_custom_action_divider"/>
       <item type="id" name="browse_item_progress_bar"/>
diff --git a/src/com/android/car/media/BrowseViewController.java b/src/com/android/car/media/BrowseViewController.java
index 839c442..43f97c0 100644
--- a/src/com/android/car/media/BrowseViewController.java
+++ b/src/com/android/car/media/BrowseViewController.java
@@ -667,12 +667,13 @@ public class BrowseViewController {
     public void onCarUiInsetsChanged(@NonNull Insets insets) {
         int actionHeaderOffset = 0;
         if (mActionBar != null && mActionBar.isShown()) {
-            actionHeaderOffset = mActionBar.getHeight();
+            Resources res = getActivity().getResources();
+            actionHeaderOffset = res.getDimensionPixelSize(R.dimen.media_browse_header_item_height);
         }
         int leftPadding = mBrowseList.getPaddingLeft();
         int rightPadding = mBrowseList.getPaddingRight();
-        int bottomPadding = mBrowseList.getPaddingBottom() + actionHeaderOffset / 2;
-        int topPadding = insets.getTop() + actionHeaderOffset / 2;
+        int bottomPadding = mBrowseList.getPaddingBottom() + actionHeaderOffset;
+        int topPadding = insets.getTop() + actionHeaderOffset;
         mBrowseList.setPadding(leftPadding, topPadding, rightPadding, bottomPadding);
         if (bottomPadding > mFocusAreaHighlightBottomPadding) {
             mFocusAreaHighlightBottomPadding = bottomPadding;
diff --git a/src/com/android/car/media/browse/BrowseViewHolder.java b/src/com/android/car/media/browse/BrowseViewHolder.java
index 3a1ce05..2ba79db 100644
--- a/src/com/android/car/media/browse/BrowseViewHolder.java
+++ b/src/com/android/car/media/browse/BrowseViewHolder.java
@@ -130,7 +130,7 @@ public class BrowseViewHolder extends RecyclerView.ViewHolder {
             bindProgressUI(metadata);
         }
 
-        if (hasBrowseCustomActions) {
+        if (hasBrowseCustomActions && !metadata.isBrowsable()) {
             ViewUtils.setVisible(mCustomActionsContainer, true);
             bindBrowseCustomActions(context, data);
         } else {
@@ -188,21 +188,23 @@ public class BrowseViewHolder extends RecyclerView.ViewHolder {
         mCustomActionsContainer.removeAllViews();
         mBrowseActionIcons.forEach((it) -> it.maybeCancelLoading(context));
         mBrowseActionIcons.clear();
-        int maxVisibleActions = context.getResources()
-                .getInteger(R.integer.max_visible_actions);
+
+        int maxVisibleActions = context.getResources().getInteger(R.integer.max_visible_actions);
+        int numActions = browseViewData.mCustomBrowseActions.size();
+        boolean willOverflow = numActions > maxVisibleActions;
+        int actionsToShow = willOverflow ? Math.max(0, maxVisibleActions - 1) : maxVisibleActions;
+
         for (CustomBrowseAction customBrowseAction :
-                browseViewData.mCustomBrowseActions.stream()
-                        .limit(maxVisibleActions)
-                        .collect(Collectors.toList())) {
+                        browseViewData.mCustomBrowseActions.stream()
+                            .limit(actionsToShow)
+                            .collect(Collectors.toList())) {
             View customActionView =
-                    LayoutInflater.from(context)
-                            .inflate(R.layout.browse_custom_action, null);
+                    LayoutInflater.from(context).inflate(R.layout.browse_custom_action, null);
             customActionView.setOnClickListener(
                     (v) ->
-                            browseViewData.mCallback.onBrowseActionClick(
-                                    customBrowseAction, browseViewData));
-            ImageView imageView =
-                    customActionView.findViewById(R.id.browse_item_custom_action);
+                    browseViewData.mCallback.onBrowseActionClick(
+                        customBrowseAction, browseViewData));
+            ImageView imageView = customActionView.findViewById(R.id.browse_item_custom_action);
             ImageViewBinder<CustomBrowseAction.BrowseActionArtRef> viewBinder =
                     new ImageViewBinder(mMaxArtSize, imageView);
             viewBinder.setImage(context, customBrowseAction.getArtRef());
@@ -210,20 +212,16 @@ public class BrowseViewHolder extends RecyclerView.ViewHolder {
             mCustomActionsContainer.addView(customActionView);
         }
 
-        if (browseViewData.mCustomBrowseActions.size() > maxVisibleActions) {
+        if (willOverflow) {
             View customActionView =
                     LayoutInflater.from(context)
-                            .inflate(R.layout.browse_custom_action, null);
-            customActionView.setOnClickListener(
-                    v ->
-                            browseViewData.mCallback.onOverflowClicked(
-                                    browseViewData.mCustomBrowseActions
-                                            .subList(maxVisibleActions,
-                                                    browseViewData.mCustomBrowseActions.size()),
-                                    browseViewData));
+                    .inflate(R.layout.browse_custom_action, null);
+            customActionView.setOnClickListener(v -> browseViewData.mCallback.onOverflowClicked(
+                    browseViewData.mCustomBrowseActions.subList(actionsToShow, numActions),
+                    browseViewData));
             ImageView imageView =
                     customActionView.findViewById(R.id.browse_item_custom_action);
-            imageView.setImageResource(com.android.car.media.R.drawable.ic_more_vert);
+            imageView.setImageResource(R.drawable.car_ui_icon_overflow_menu);
             mCustomActionsContainer.addView(customActionView);
         }
     }
diff --git a/src/com/android/car/media/browse/actionbar/BrowseActionsHeader.java b/src/com/android/car/media/browse/actionbar/BrowseActionsHeader.java
index 1e3a2e5..044e661 100644
--- a/src/com/android/car/media/browse/actionbar/BrowseActionsHeader.java
+++ b/src/com/android/car/media/browse/actionbar/BrowseActionsHeader.java
@@ -31,7 +31,6 @@ import com.android.car.media.common.CustomBrowseAction;
 
 import java.util.ArrayList;
 import java.util.List;
-import java.util.stream.Collectors;
 
 /**
  * Implementation of {@link ActionsHeader}
@@ -43,8 +42,16 @@ public class BrowseActionsHeader extends LinearLayout implements ActionsHeader {
     private OverflowClickListener mOverflowClickListener;
     private List<CustomBrowseAction> mActions = new ArrayList<>();
 
+    private LinearLayout mActionsContainer;
+
     public BrowseActionsHeader(Context context, AttributeSet attributeSet) {
         super(context, attributeSet);
+        initView();
+    }
+
+    private void initView() {
+        inflate(getContext(), R.layout.media_browse_header_item, this);
+        mActionsContainer = (LinearLayout) findViewById(R.id.browse_item_actions_container);
     }
 
     @Override
@@ -64,28 +71,27 @@ public class BrowseActionsHeader extends LinearLayout implements ActionsHeader {
     }
 
     private void setHeaderActions(List<CustomBrowseAction> actions) {
-        removeAllViews();
+        mActionsContainer.removeAllViews();
         final int maxVisibleActions = getResources()
                 .getInteger(R.integer.max_visible_actions_header);
         final Size mMaxArtSize = MediaAppConfig
                 .getMediaItemsBitmapMaxSize(getContext());
-        actions.stream()
-                .limit(maxVisibleActions)
-                .collect(Collectors.toList())
-                .forEach(
-                        action -> {
-                            View actionView =
-                                    LayoutInflater.from(getContext())
-                                            .inflate(R.layout.browse_custom_action, null);
-                            ImageView icon =
-                                    actionView.findViewById(R.id.browse_item_custom_action);
-                            actionView.setOnClickListener(
-                                    item -> mActionClickListener.onActionClicked(action));
-                            ImageViewBinder<CustomBrowseAction.BrowseActionArtRef> imageBinder =
-                                    new ImageViewBinder<>(mMaxArtSize, icon);
-                            imageBinder.setImage(getContext(), action.getArtRef());
-                            addView(actionView);
-                        });
+        for (int i = 0; i < Math.min(maxVisibleActions, actions.size()); i++) {
+            CustomBrowseAction action = actions.get(i);
+            View actionView =
+                    LayoutInflater.from(getContext()).inflate(R.layout.browse_custom_action, null);
+            if (i == 0) {
+                actionView.findViewById(R.id.browse_item_custom_action_divider)
+                    .setVisibility(View.GONE);
+            }
+            ImageView icon = actionView.findViewById(R.id.browse_item_custom_action);
+            actionView.setOnClickListener(
+                    item -> mActionClickListener.onActionClicked(action));
+            ImageViewBinder<CustomBrowseAction.BrowseActionArtRef> imageBinder =
+                    new ImageViewBinder<>(mMaxArtSize, icon);
+            imageBinder.setImage(getContext(), action.getArtRef());
+            mActionsContainer.addView(actionView);
+        }
 
         if (actions.size() > maxVisibleActions) {
             View actionView =
@@ -96,7 +102,7 @@ public class BrowseActionsHeader extends LinearLayout implements ActionsHeader {
                             mOverflowClickListener.onOverFlowCLicked(
                                     actions.subList(maxVisibleActions, actions.size())));
             icon.setImageResource(R.drawable.car_ui_icon_overflow_menu);
-            addView(actionView);
+            mActionsContainer.addView(actionView);
         }
     }