From 1bca6f83ee99ea2fc69a7de47039a526bdf5fa1a Mon Sep 17 00:00:00 2001
From: ericdecanini <eddecanini@gmail.com>
Date: Tue, 10 May 2022 13:00:18 +0200
Subject: [PATCH] Adds shadows and max list size to modal

---
 .../features/home/SpaceListModalFragment.kt   |   7 +-
 .../res/drawable/bg_modal_ripple_grey.xml     |  12 ++
 vector/src/main/res/drawable/top_shadow.xml   |   7 +
 .../main/res/layout/fragment_home_detail.xml  |  10 +-
 .../res/layout/fragment_space_list_modal.xml  | 135 ++++++++++--------
 5 files changed, 105 insertions(+), 66 deletions(-)
 create mode 100644 vector/src/main/res/drawable/bg_modal_ripple_grey.xml
 create mode 100644 vector/src/main/res/drawable/top_shadow.xml

diff --git a/vector/src/main/java/im/vector/app/features/home/SpaceListModalFragment.kt b/vector/src/main/java/im/vector/app/features/home/SpaceListModalFragment.kt
index 9fd85dcfb2..f5e556aa90 100644
--- a/vector/src/main/java/im/vector/app/features/home/SpaceListModalFragment.kt
+++ b/vector/src/main/java/im/vector/app/features/home/SpaceListModalFragment.kt
@@ -69,7 +69,7 @@ class SpaceListModalFragment : VectorBaseFragment<FragmentSpaceListModalBinding>
     }
 
     private fun setupAddSpace() {
-        binding.addSpaceClickbox.setOnClickListener {
+        binding.addSpaceLayout.setOnClickListener {
             val currentSpace = sharedActionViewModel.space.value
             if (currentSpace != null) {
                 startActivity(SpaceManageActivity.newIntent(requireActivity(), currentSpace.roomId, ManageType.AddRoomsOnlySpaces))
@@ -82,14 +82,13 @@ class SpaceListModalFragment : VectorBaseFragment<FragmentSpaceListModalBinding>
     private fun observeSpaceChange() = sharedActionViewModel.space.observe(viewLifecycleOwner) {
         viewModel.setSpace(it)
         binding.headerText.isVisible = it == null
-
-        binding.bottomDivider.isVisible = !it?.spaceChildren.isNullOrEmpty()
+        binding.headerTextLayout.isVisible = it == null
     }
 
     override fun invalidate() {
         withState(viewModel) { state ->
             state.rootSpacesOrdered?.let {
-                (binding.roomList.adapter as SpaceListAdapter).replaceList(it)
+                (binding.roomList.adapter as SpaceListAdapter).replaceList(it + it)
             }
         }
     }
diff --git a/vector/src/main/res/drawable/bg_modal_ripple_grey.xml b/vector/src/main/res/drawable/bg_modal_ripple_grey.xml
new file mode 100644
index 0000000000..951317b695
--- /dev/null
+++ b/vector/src/main/res/drawable/bg_modal_ripple_grey.xml
@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="utf-8"?>
+<ripple xmlns:android="http://schemas.android.com/apk/res/android"
+    android:color="?attr/vctr_content_secondary">
+
+    <item android:drawable="@color/modal_background_color"/>
+
+    <!--this creates the mask with the ripple effect-->
+    <item
+        android:id="@+id/mask"
+        android:drawable="@android:color/white" />
+
+</ripple>
diff --git a/vector/src/main/res/drawable/top_shadow.xml b/vector/src/main/res/drawable/top_shadow.xml
new file mode 100644
index 0000000000..d033b67b34
--- /dev/null
+++ b/vector/src/main/res/drawable/top_shadow.xml
@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="utf-8"?>
+<shape xmlns:android="http://schemas.android.com/apk/res/android">
+    <gradient
+        android:startColor="#10000000"
+        android:endColor="@android:color/transparent"
+        android:angle="90" />
+</shape>
diff --git a/vector/src/main/res/layout/fragment_home_detail.xml b/vector/src/main/res/layout/fragment_home_detail.xml
index 6535375dbf..2da7a28c6f 100644
--- a/vector/src/main/res/layout/fragment_home_detail.xml
+++ b/vector/src/main/res/layout/fragment_home_detail.xml
@@ -267,9 +267,17 @@
         android:id="@+id/space_modal_fragment"
         android:name="im.vector.app.features.home.SpaceListModalFragment"
         android:layout_width="match_parent"
-        android:layout_height="wrap_content"
+        android:layout_height="0dp"
+        app:layout_constraintBottom_toBottomOf="@id/bottom_guideline"
         android:elevation="0dp"
         android:visibility="gone"
         app:layout_constraintTop_toBottomOf="@id/appBarLayout" />
 
+    <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/bottom_guideline"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        android:orientation="horizontal"
+        app:layout_constraintGuide_percent="0.75" />
+
 </androidx.constraintlayout.widget.ConstraintLayout>
diff --git a/vector/src/main/res/layout/fragment_space_list_modal.xml b/vector/src/main/res/layout/fragment_space_list_modal.xml
index 0877279c83..7d8f24619f 100644
--- a/vector/src/main/res/layout/fragment_space_list_modal.xml
+++ b/vector/src/main/res/layout/fragment_space_list_modal.xml
@@ -3,82 +3,95 @@
     xmlns:app="http://schemas.android.com/apk/res-auto"
     xmlns:tools="http://schemas.android.com/tools"
     android:layout_width="match_parent"
-    android:layout_height="wrap_content"
+    android:layout_height="match_parent"
     android:background="@drawable/bg_space_modal">
 
-    <TextView
-        android:id="@+id/header_text"
-        android:layout_width="wrap_content"
+    <FrameLayout
+        android:id="@+id/header_text_layout"
+        android:layout_width="match_parent"
         android:layout_height="wrap_content"
-        android:paddingTop="16dp"
-        android:textSize="13sp"
-        android:textColor="?attr/vctr_content_tertiary"
         app:layout_constraintTop_toTopOf="parent"
-        app:layout_constraintStart_toStartOf="parent"
-        android:layout_marginStart="16dp"
-        android:text="@string/choose_a_space"
-        android:textAllCaps="true" />
+        android:background="@color/modal_background_color"
+        android:elevation="4dp"
+        android:paddingBottom="8dp">
+
+        <TextView
+            android:id="@+id/header_text"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:paddingTop="16dp"
+            android:textSize="13sp"
+            android:textColor="?attr/vctr_content_tertiary"
+            app:layout_constraintTop_toTopOf="parent"
+            app:layout_constraintStart_toStartOf="parent"
+            android:layout_marginStart="16dp"
+            android:text="@string/choose_a_space"
+            android:textAllCaps="true" />
+
+    </FrameLayout>
 
     <androidx.recyclerview.widget.RecyclerView
         android:id="@+id/room_list"
         android:layout_width="match_parent"
-        android:layout_height="wrap_content"
-        android:layout_marginTop="8dp"
-        app:layout_constraintTop_toBottomOf="@id/header_text"
+        android:layout_height="0dp"
+        android:background="@color/modal_background_color"
+        app:layout_constraintTop_toBottomOf="@id/header_text_layout"
+        app:layout_constraintBottom_toTopOf="@id/add_space_layout"
         tools:itemCount="3"
         tools:listitem="@layout/item_modal_space" />
 
-    <com.google.android.material.divider.MaterialDivider
-        android:id="@+id/bottom_divider"
-        android:layout_width="match_parent"
-        android:layout_height="1dp"
-        android:layout_marginTop="8dp"
-        app:layout_constraintTop_toBottomOf="@id/room_list" />
-
     <View
-        android:id="@+id/add_space_clickbox"
         android:layout_width="match_parent"
-        android:layout_height="0dp"
-        android:background="@drawable/ripple_grey"
-        app:layout_constraintTop_toBottomOf="@id/bottom_divider"
-        app:layout_constraintBottom_toBottomOf="parent" />
+        android:layout_height="4dp"
+        android:background="@drawable/top_shadow"
+        app:layout_constraintBottom_toTopOf="@id/add_space_layout" />
 
-    <com.google.android.material.imageview.ShapeableImageView
-        android:id="@+id/add_space_icon_background"
-        android:layout_width="42dp"
-        android:layout_height="42dp"
-        android:layout_marginStart="16dp"
-        android:layout_marginTop="16dp"
-        android:background="#4D8D97A5"
-        app:layout_constraintStart_toStartOf="parent"
-        app:layout_constraintTop_toBottomOf="@id/bottom_divider"
-        app:shapeAppearanceOverlay="@style/SpaceListModalImageShapeOverlay" />
-
-    <ImageView
-        android:layout_width="24dp"
-        android:layout_height="24dp"
-        android:importantForAccessibility="no"
-        android:src="@drawable/ic_plus"
-        app:layout_constraintBottom_toBottomOf="@id/add_space_icon_background"
-        app:layout_constraintEnd_toEndOf="@id/add_space_icon_background"
-        app:layout_constraintStart_toStartOf="@id/add_space_icon_background"
-        app:layout_constraintTop_toTopOf="@id/add_space_icon_background"
-        app:tint="?attr/vctr_spoiler_background_color" />
-
-    <TextView
-        style="@style/Widget.Vector.TextView.Body.Medium"
-        android:layout_width="wrap_content"
+    <androidx.constraintlayout.widget.ConstraintLayout
+        android:id="@+id/add_space_layout"
+        android:layout_width="match_parent"
         android:layout_height="wrap_content"
-        android:layout_marginStart="16dp"
-        android:text="@string/add_space"
-        android:textSize="17sp"
-        app:layout_constraintBottom_toBottomOf="@id/add_space_icon_background"
-        app:layout_constraintStart_toEndOf="@id/add_space_icon_background"
-        app:layout_constraintTop_toTopOf="@id/add_space_icon_background" />
+        android:background="@drawable/bg_modal_ripple_grey"
+        android:elevation="3dp"
+        app:layout_constraintBottom_toBottomOf="parent">
 
-    <Space
-        android:layout_width="match_parent"
-        android:layout_height="16dp"
-        app:layout_constraintTop_toBottomOf="@id/add_space_icon_background" />
+        <com.google.android.material.imageview.ShapeableImageView
+            android:id="@+id/add_space_icon_background"
+            android:layout_width="42dp"
+            android:layout_height="42dp"
+            android:layout_marginStart="16dp"
+            android:background="#4D8D97A5"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintTop_toTopOf="parent"
+            app:layout_constraintBottom_toBottomOf="parent"
+            app:shapeAppearanceOverlay="@style/SpaceListModalImageShapeOverlay" />
+
+        <ImageView
+            android:layout_width="24dp"
+            android:layout_height="24dp"
+            android:importantForAccessibility="no"
+            android:src="@drawable/ic_plus"
+            app:layout_constraintBottom_toBottomOf="@id/add_space_icon_background"
+            app:layout_constraintEnd_toEndOf="@id/add_space_icon_background"
+            app:layout_constraintStart_toStartOf="@id/add_space_icon_background"
+            app:layout_constraintTop_toTopOf="@id/add_space_icon_background"
+            app:tint="?attr/vctr_spoiler_background_color" />
+
+        <TextView
+            style="@style/Widget.Vector.TextView.Body.Medium"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_marginStart="16dp"
+            android:text="@string/add_space"
+            android:textSize="17sp"
+            app:layout_constraintBottom_toBottomOf="@id/add_space_icon_background"
+            app:layout_constraintStart_toEndOf="@id/add_space_icon_background"
+            app:layout_constraintTop_toTopOf="@id/add_space_icon_background" />
+
+        <Space
+            android:layout_width="match_parent"
+            android:layout_height="16dp"
+            app:layout_constraintTop_toBottomOf="@id/add_space_icon_background" />
+
+    </androidx.constraintlayout.widget.ConstraintLayout>
 
 </androidx.constraintlayout.widget.ConstraintLayout>