From 58e41d99c934a87216713757f1d95168444732be Mon Sep 17 00:00:00 2001
From: Sylvain Berfini <sylvain.berfini@belledonne-communications.com>
Date: Thu, 1 Feb 2024 12:35:27 +0100
Subject: [PATCH] Animate caret to handle and back while in call

---
 .../ui/call/fragment/ActiveCallFragment.kt    | 28 +++++++++++++++++-
 .../ui/call/viewmodel/CurrentCallViewModel.kt |  2 --
 .../res/drawable/animated_caret_to_handle.xml | 29 +++++++++++++++++++
 .../res/drawable/animated_handle_to_caret.xml | 29 +++++++++++++++++++
 .../main/res/layout/call_actions_generic.xml  |  6 ++--
 5 files changed, 88 insertions(+), 6 deletions(-)
 create mode 100644 app/src/main/res/drawable/animated_caret_to_handle.xml
 create mode 100644 app/src/main/res/drawable/animated_handle_to_caret.xml

diff --git a/app/src/main/java/org/linphone/ui/call/fragment/ActiveCallFragment.kt b/app/src/main/java/org/linphone/ui/call/fragment/ActiveCallFragment.kt
index 6b8f52c93..1ceba113b 100644
--- a/app/src/main/java/org/linphone/ui/call/fragment/ActiveCallFragment.kt
+++ b/app/src/main/java/org/linphone/ui/call/fragment/ActiveCallFragment.kt
@@ -33,6 +33,7 @@ import androidx.annotation.UiThread
 import androidx.constraintlayout.widget.ConstraintSet
 import androidx.lifecycle.ViewModelProvider
 import androidx.navigation.fragment.findNavController
+import androidx.vectordrawable.graphics.drawable.AnimatedVectorDrawableCompat
 import androidx.window.layout.FoldingFeature
 import com.google.android.material.bottomsheet.BottomSheetBehavior
 import com.google.android.material.bottomsheet.BottomSheetDialogFragment
@@ -50,6 +51,7 @@ import org.linphone.utils.DialogUtils
 import org.linphone.utils.Event
 import org.linphone.utils.addCharacterAtPosition
 import org.linphone.utils.removeCharacterAtPosition
+import org.linphone.utils.startAnimatedDrawable
 
 @UiThread
 class ActiveCallFragment : GenericCallFragment() {
@@ -107,7 +109,19 @@ class ActiveCallFragment : GenericCallFragment() {
 
     private val actionsBottomSheetCallback = object : BottomSheetBehavior.BottomSheetCallback() {
         override fun onStateChanged(bottomSheet: View, newState: Int) {
-            callViewModel.extraActionsBottomSheetVisible.value = newState != BottomSheetBehavior.STATE_COLLAPSED
+            if (newState == BottomSheetBehavior.STATE_EXPANDED) {
+                val drawable = AnimatedVectorDrawableCompat.create(
+                    requireContext(),
+                    R.drawable.animated_handle_to_caret
+                )
+                binding.bottomBar.mainActions.handle.setImageDrawable(drawable)
+            } else if (newState == BottomSheetBehavior.STATE_COLLAPSED) {
+                val drawable = AnimatedVectorDrawableCompat.create(
+                    requireContext(),
+                    R.drawable.animated_caret_to_handle
+                )
+                binding.bottomBar.mainActions.handle.setImageDrawable(drawable)
+            }
         }
 
         override fun onSlide(bottomSheet: View, slideOffset: Float) { }
@@ -235,8 +249,20 @@ class ActiveCallFragment : GenericCallFragment() {
             it.consume {
                 val state = actionsBottomSheetBehavior.state
                 if (state == BottomSheetBehavior.STATE_COLLAPSED) {
+                    val drawable = AnimatedVectorDrawableCompat.create(
+                        requireContext(),
+                        R.drawable.animated_caret_to_handle
+                    )
+                    binding.bottomBar.mainActions.handle.setImageDrawable(drawable)
+                    binding.bottomBar.mainActions.handle.startAnimatedDrawable()
                     actionsBottomSheetBehavior.state = BottomSheetBehavior.STATE_EXPANDED
                 } else if (state == BottomSheetBehavior.STATE_EXPANDED) {
+                    val drawable = AnimatedVectorDrawableCompat.create(
+                        requireContext(),
+                        R.drawable.animated_handle_to_caret
+                    )
+                    binding.bottomBar.mainActions.handle.setImageDrawable(drawable)
+                    binding.bottomBar.mainActions.handle.startAnimatedDrawable()
                     actionsBottomSheetBehavior.state = BottomSheetBehavior.STATE_COLLAPSED
                 }
             }
diff --git a/app/src/main/java/org/linphone/ui/call/viewmodel/CurrentCallViewModel.kt b/app/src/main/java/org/linphone/ui/call/viewmodel/CurrentCallViewModel.kt
index 5fc997717..dd00f4488 100644
--- a/app/src/main/java/org/linphone/ui/call/viewmodel/CurrentCallViewModel.kt
+++ b/app/src/main/java/org/linphone/ui/call/viewmodel/CurrentCallViewModel.kt
@@ -151,8 +151,6 @@ class CurrentCallViewModel @UiThread constructor() : ViewModel() {
 
     // Extras actions
 
-    val extraActionsBottomSheetVisible = MutableLiveData<Boolean>()
-
     val toggleExtraActionsBottomSheetEvent: MutableLiveData<Event<Boolean>> by lazy {
         MutableLiveData<Event<Boolean>>()
     }
diff --git a/app/src/main/res/drawable/animated_caret_to_handle.xml b/app/src/main/res/drawable/animated_caret_to_handle.xml
new file mode 100644
index 000000000..f5e1d0161
--- /dev/null
+++ b/app/src/main/res/drawable/animated_caret_to_handle.xml
@@ -0,0 +1,29 @@
+<animated-vector
+    xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:aapt="http://schemas.android.com/aapt">
+    <aapt:attr name="android:drawable">
+        <vector
+            android:name="vector"
+            android:width="38dp"
+            android:height="9dp"
+            android:viewportWidth="38"
+            android:viewportHeight="9">
+            <path
+                android:name="path"
+                android:pathData="M 0 6.907 C 0 6 1 5 2 5 L 19 0 L 36 5 C 37 5 38 6 38 6.907 C 38 7.944 37 9 36 9 L 19 4 L 2 9 C 1 9 0 7.944 0 6.907 Z"
+                android:fillColor="#ffffff"
+                android:strokeWidth="1"/>
+        </vector>
+    </aapt:attr>
+    <target android:name="path">
+        <aapt:attr name="android:animation">
+            <objectAnimator
+                android:propertyName="pathData"
+                android:duration="500"
+                android:valueFrom="M 0 6.907 C 0 6 1 5 2 5 L 19 0 L 36 5 C 37 5 38 6 38 6.907 C 38 7.944 37 9 36 9 L 19 4 L 2 9 C 1 9 0 7.944 0 6.907 Z"
+                android:valueTo="M 0 6.907 C 0 6 1 5 2 5 L 19 5 L 36 5 C 37 5 38 6 38 6.907 C 38 7.944 37 9 36 9 L 19 9 L 2 9 C 1 9 0 7.944 0 6.907 Z"
+                android:valueType="pathType"
+                android:interpolator="@android:interpolator/fast_out_slow_in"/>
+        </aapt:attr>
+    </target>
+</animated-vector>
diff --git a/app/src/main/res/drawable/animated_handle_to_caret.xml b/app/src/main/res/drawable/animated_handle_to_caret.xml
new file mode 100644
index 000000000..54b52c05d
--- /dev/null
+++ b/app/src/main/res/drawable/animated_handle_to_caret.xml
@@ -0,0 +1,29 @@
+<animated-vector
+    xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:aapt="http://schemas.android.com/aapt">
+    <aapt:attr name="android:drawable">
+        <vector
+            android:name="vector"
+            android:width="38dp"
+            android:height="9dp"
+            android:viewportWidth="38"
+            android:viewportHeight="9">
+            <path
+                android:name="path"
+                android:pathData="M 0 6.907 C 0 6 1 5 2 5 L 19 5 L 36 5 C 37 5 38 6 38 6.907 C 38 7.944 37 9 36 9 L 19 9 L 2 9 C 1 9 0 7.944 0 6.907 Z"
+                android:fillColor="#ffffff"
+                android:strokeWidth="1"/>
+        </vector>
+    </aapt:attr>
+    <target android:name="path">
+        <aapt:attr name="android:animation">
+            <objectAnimator
+                android:propertyName="pathData"
+                android:duration="500"
+                android:valueFrom="M 0 6.907 C 0 6 1 5 2 5 L 19 5 L 36 5 C 37 5 38 6 38 6.907 C 38 7.944 37 9 36 9 L 19 9 L 2 9 C 1 9 0 7.944 0 6.907 Z"
+                android:valueTo="M 0 6.907 C 0 6 1 5 2 5 L 19 0 L 36 5 C 37 5 38 6 38 6.907 C 38 7.944 37 9 36 9 L 19 4 L 2 9 C 1 9 0 7.944 0 6.907 Z"
+                android:valueType="pathType"
+                android:interpolator="@android:interpolator/fast_out_slow_in"/>
+        </aapt:attr>
+    </target>
+</animated-vector>
diff --git a/app/src/main/res/layout/call_actions_generic.xml b/app/src/main/res/layout/call_actions_generic.xml
index 92f915da3..63d955a5b 100644
--- a/app/src/main/res/layout/call_actions_generic.xml
+++ b/app/src/main/res/layout/call_actions_generic.xml
@@ -15,13 +15,13 @@
         android:paddingBottom="5dp"
         android:background="@drawable/shape_call_bottom_sheet_background">
 
-        <com.google.android.material.bottomsheet.BottomSheetDragHandleView
+        <ImageView
             android:onClick="@{() -> viewModel.toggleExpandActionsMenu()}"
-            android:id="@+id/toggle_expand"
+            android:id="@+id/handle"
             android:layout_width="0dp"
             android:layout_height="wrap_content"
             android:padding="11dp"
-            android:src="@{viewModel.extraActionsBottomSheetVisible ? @drawable/caret_down : @drawable/handle, default=@drawable/handle}"
+            android:src="@drawable/animated_caret_to_handle"
             app:tint="@color/white"
             app:layout_constraintStart_toStartOf="parent"
             app:layout_constraintEnd_toEndOf="parent"