Fix clock edit button cropped when overscroll

Fixed by leaving top space for the edit button

Test: Manually tested see bug
Fixes: 377528523
Flag: com.android.systemui.shared.new_customization_picker_ui
Change-Id: Ib3bfd8460e40382f0615603ad9e6b8883f6f5ed3
diff --git a/res/layout/clock_style_option.xml b/res/layout/clock_style_option.xml
index 27fe597..e251c4a 100644
--- a/res/layout/clock_style_option.xml
+++ b/res/layout/clock_style_option.xml
@@ -14,47 +14,43 @@
      limitations under the License.
 -->
 <!-- Content description is set programmatically on the parent FrameLayout -->
-<FrameLayout
-    xmlns:android="http://schemas.android.com/apk/res/android"
-    android:layout_width="@dimen/floating_sheet_clock_style_option_size"
-    android:layout_height="@dimen/floating_sheet_clock_style_option_size"
+<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    android:layout_width="@dimen/floating_sheet_clock_style_option_width"
+    android:layout_height="@dimen/floating_sheet_clock_style_option_height"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    android:clipToPadding="false"
     android:clipChildren="false">
 
-    <ImageView
-        android:id="@id/selection_border"
-        android:layout_width="match_parent"
-        android:layout_height="match_parent"
-        android:background="@drawable/option_item_border"
-        android:alpha="0"
-        android:importantForAccessibility="no" />
-
-    <ImageView
+    <com.android.wallpaper.picker.option.ui.view.OptionItemBackground
         android:id="@id/background"
-        android:layout_width="match_parent"
-        android:layout_height="match_parent"
-        android:background="@drawable/option_item_background"
-        android:importantForAccessibility="no" />
+        android:layout_width="@dimen/floating_sheet_clock_style_option_background_size"
+        android:layout_height="@dimen/floating_sheet_clock_style_option_background_size"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintBottom_toBottomOf="parent"
+        android:importantForAccessibility="no"
+        android:layout_gravity="bottom" />
 
-    <FrameLayout
+
+    <ImageView
         android:id="@+id/foreground"
-        android:layout_width="match_parent"
-        android:layout_height="match_parent">
+        android:layout_width="@dimen/floating_sheet_clock_style_option_thumbnail_size"
+        android:layout_height="@dimen/floating_sheet_clock_style_option_thumbnail_size"
+        android:layout_marginBottom="@dimen/floating_sheet_clock_style_thumbnail_margin_bottom"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintBottom_toBottomOf="parent"
+        android:src="@drawable/ic_clock_24px" />
 
-        <ImageView
-            android:id="@+id/clock_icon"
-            android:layout_width="match_parent"
-            android:layout_height="match_parent"
-            android:layout_margin="@dimen/floating_sheet_clock_style_thumbnail_margin"
-            android:src="@drawable/ic_clock_24px" />
-
-        <ImageView
-            android:id="@+id/edit_icon"
-            android:layout_width="@dimen/floating_sheet_clock_edit_icon_size"
-            android:layout_height="@dimen/floating_sheet_clock_edit_icon_size"
-            android:layout_marginTop="-16dp"
-            android:layout_marginLeft="50dp"
-            android:src="@drawable/edit_icon"/>
-
-    </FrameLayout>
-</FrameLayout>
+    <ImageView
+        android:id="@+id/edit_icon"
+        android:layout_width="@dimen/floating_sheet_clock_edit_icon_size"
+        android:layout_height="@dimen/floating_sheet_clock_edit_icon_size"
+        android:layout_marginTop="@dimen/floating_sheet_clock_edit_icon_margin"
+        android:layout_marginEnd="@dimen/floating_sheet_clock_edit_icon_margin"
+        android:src="@drawable/edit_icon"
+        app:layout_constraintEnd_toEndOf="@+id/background"
+        app:layout_constraintTop_toTopOf="@+id/background"
+        android:importantForAccessibility="no" />
+</androidx.constraintlayout.widget.ConstraintLayout>
 
diff --git a/res/layout/clock_style_option2.xml b/res/layout/clock_style_option2.xml
deleted file mode 100644
index 8bb60d1..0000000
--- a/res/layout/clock_style_option2.xml
+++ /dev/null
@@ -1,46 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?><!--
-     Copyright (C) 2024 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.
--->
-<!-- Content description is set programmatically on the parent FrameLayout -->
-<FrameLayout
-    xmlns:android="http://schemas.android.com/apk/res/android"
-    android:layout_width="80dp"
-    android:layout_height="80dp"
-    android:clipToPadding="false"
-    android:clipChildren="false">
-
-    <com.android.wallpaper.picker.option.ui.view.OptionItemBackground
-        android:id="@id/background"
-        android:layout_width="match_parent"
-        android:layout_height="match_parent"
-        android:importantForAccessibility="no" />
-
-    <ImageView
-        android:id="@+id/foreground"
-        android:layout_width="match_parent"
-        android:layout_height="match_parent"
-        android:layout_margin="@dimen/floating_sheet_clock_style_thumbnail_margin"
-        android:src="@drawable/ic_clock_24px" />
-
-    <ImageView
-        android:id="@+id/edit_icon"
-        android:layout_width="@dimen/floating_sheet_clock_edit_icon_size"
-        android:layout_height="@dimen/floating_sheet_clock_edit_icon_size"
-        android:layout_marginTop="-16dp"
-        android:layout_marginStart="50dp"
-        android:src="@drawable/edit_icon"
-        android:importantForAccessibility="no" />
-</FrameLayout>
-
diff --git a/res/layout/floating_sheet_clock.xml b/res/layout/floating_sheet_clock.xml
index 338cbf2..93cf24b 100644
--- a/res/layout/floating_sheet_clock.xml
+++ b/res/layout/floating_sheet_clock.xml
@@ -24,7 +24,6 @@
         android:id="@+id/clock_floating_sheet_content_container"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
-        android:paddingVertical="@dimen/floating_sheet_content_vertical_padding"
         android:background="@drawable/floating_sheet_content_background"
         android:clipToPadding="false"
         android:clipChildren="false">
diff --git a/res/layout/floating_sheet_clock_color_content.xml b/res/layout/floating_sheet_clock_color_content.xml
index 3f1ec8c..fd218c6 100644
--- a/res/layout/floating_sheet_clock_color_content.xml
+++ b/res/layout/floating_sheet_clock_color_content.xml
@@ -18,6 +18,7 @@
     xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
+    android:paddingVertical="@dimen/floating_sheet_content_vertical_padding"
     android:orientation="vertical"
     android:clipToPadding="false"
     android:clipChildren="false">
diff --git a/res/layout/floating_sheet_clock_font_content.xml b/res/layout/floating_sheet_clock_font_content.xml
index 9c223a5..3ce65e4 100644
--- a/res/layout/floating_sheet_clock_font_content.xml
+++ b/res/layout/floating_sheet_clock_font_content.xml
@@ -20,9 +20,10 @@
     android:id="@+id/clock_floating_sheet_font_content"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
+    android:paddingVertical="@dimen/floating_sheet_content_vertical_padding"
+    android:paddingHorizontal="@dimen/floating_sheet_content_horizontal_padding"
     android:clipChildren="false"
-    android:clipToPadding="false"
-    android:paddingHorizontal="@dimen/floating_sheet_content_horizontal_padding">
+    android:clipToPadding="false">
 
     <TextView
         android:id="@+id/clock_axis_slider_name1"
diff --git a/res/layout/floating_sheet_clock_style_content.xml b/res/layout/floating_sheet_clock_style_content.xml
index 9054ec3..5b39776 100644
--- a/res/layout/floating_sheet_clock_style_content.xml
+++ b/res/layout/floating_sheet_clock_style_content.xml
@@ -19,6 +19,8 @@
     xmlns:app="http://schemas.android.com/apk/res-auto"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
+    android:paddingTop="@dimen/floating_sheet_clock_style_content_top_padding"
+    android:paddingBottom="@dimen/floating_sheet_clock_style_content_bottom_padding"
     android:clipToPadding="false"
     android:clipChildren="false">
 
@@ -45,19 +47,14 @@
         -->
         <include
             layout="@layout/clock_style_option"
-            android:layout_width="@dimen/floating_sheet_clock_style_option_size"
-            android:layout_height="@dimen/floating_sheet_clock_style_option_size"
+            android:layout_width="@dimen/floating_sheet_clock_style_option_width"
+            android:layout_height="@dimen/floating_sheet_clock_style_option_height"
             android:visibility="invisible" />
 
-        <!--
-        TODO (b/377528523): We intentionally disable over scroll mode since it will clip the
-          edit icon when in over scroll.
-        -->
         <androidx.recyclerview.widget.RecyclerView
             android:id="@+id/clock_style_list"
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
-            android:overScrollMode="never"
             android:clipChildren="false"
             android:clipToPadding="false"/>
     </FrameLayout>
diff --git a/res/values/dimens.xml b/res/values/dimens.xml
index 229815e..ce27004 100644
--- a/res/values/dimens.xml
+++ b/res/values/dimens.xml
@@ -181,6 +181,8 @@
     <!-- Floating sheet dimensions -->
     <dimen name="floating_sheet_content_vertical_padding">20dp</dimen>
     <dimen name="floating_sheet_content_horizontal_padding">20dp</dimen>
+    <dimen name="floating_sheet_clock_style_content_top_padding">2dp</dimen>
+    <dimen name="floating_sheet_clock_style_content_bottom_padding">20dp</dimen>
     <dimen name="floating_sheet_horizontal_padding">16dp</dimen>
     <dimen name="floating_sheet_tab_toolbar_vertical_margin">8dp</dimen>
     <dimen name="floating_sheet_tab_clock_font_toolbar_top_margin">16dp</dimen>
@@ -188,9 +190,13 @@
     <dimen name="floating_sheet_list_item_horizontal_space">4dp</dimen>
     <dimen name="floating_sheet_list_item_vertical_space">4dp</dimen>
     <dimen name="floating_sheet_clock_style_option_list_margin_bottom">8dp</dimen>
-    <dimen name="floating_sheet_clock_style_option_size">82dp</dimen>
+    <dimen name="floating_sheet_clock_style_option_width">80dp</dimen>
+    <dimen name="floating_sheet_clock_style_option_height">98dp</dimen>
+    <dimen name="floating_sheet_clock_style_option_background_size">80dp</dimen>
+    <dimen name="floating_sheet_clock_style_option_thumbnail_size">56dp</dimen>
     <dimen name="floating_sheet_clock_edit_icon_size">48dp</dimen>
-    <dimen name="floating_sheet_clock_style_thumbnail_margin">12dp</dimen>
+    <dimen name="floating_sheet_clock_edit_icon_margin">-18dp</dimen>
+    <dimen name="floating_sheet_clock_style_thumbnail_margin_bottom">12dp</dimen>
     <dimen name="floating_sheet_clock_style_clock_size_text_margin_end">16dp</dimen>
     <dimen name="floating_sheet_clock_color_option_list_bottom_margin">12dp</dimen>
     <dimen name="floating_sheet_color_option_size">54dp</dimen>
diff --git a/src/com/android/wallpaper/customization/ui/binder/ClockFloatingSheetBinder.kt b/src/com/android/wallpaper/customization/ui/binder/ClockFloatingSheetBinder.kt
index e2b6217..86b2d78 100644
--- a/src/com/android/wallpaper/customization/ui/binder/ClockFloatingSheetBinder.kt
+++ b/src/com/android/wallpaper/customization/ui/binder/ClockFloatingSheetBinder.kt
@@ -214,10 +214,7 @@
                                 Tab.STYLE -> clockStyleContentHeight
                                 Tab.COLOR -> clockColorContentHeight
                                 Tab.FONT -> clockFontContentHeight
-                            } +
-                                view.resources.getDimensionPixelSize(
-                                    R.dimen.floating_sheet_content_vertical_padding
-                                ) * 2
+                            }
                         // Start to animate the content height
                         ValueAnimator.ofInt(fromHeight, toHeight)
                             .apply {
@@ -402,7 +399,7 @@
         lifecycleOwner: LifecycleOwner
     ): OptionItemAdapter2<ClockStyleModel> =
         OptionItemAdapter2(
-            layoutResourceId = R.layout.clock_style_option2,
+            layoutResourceId = R.layout.clock_style_option,
             lifecycleOwner = lifecycleOwner,
             bindPayload = { view: View, styleModel: ClockStyleModel ->
                 view