Add MediaBox hide/show animation

reader/src/main/java/com/kdanmobile/reader/screen/view/ViewerEditView.kt

@@ -1,11 +1,15 @@
 package com.kdanmobile.reader.screen.view
 
+import android.animation.*
 import android.content.Context
+import android.graphics.Color
 import android.support.constraint.ConstraintLayout
 import android.support.v4.content.ContextCompat
 import android.util.AttributeSet
 import android.view.LayoutInflater
 import android.view.View
+import android.view.View.OnClickListener
+import android.view.animation.AccelerateDecelerateInterpolator
 import android.widget.ImageButton
 import com.kdanmobile.reader.R
 import com.kdanmobile.reader.screen.view.edit.ShapeTabView
@@ -17,13 +21,22 @@ import kotlinx.android.synthetic.main.view_viewer_edit_tab.view.*
 
 class ViewerEditView : ConstraintLayout {
 
+    private companion object {
+        const val COLOR_DISMISS = Color.TRANSPARENT
+        val COLOR_SHOW = Color.parseColor("#42000000")
+        const val DEFAULT_DURATION_ANIMATION = 300L
+    }
+
     private enum class ViewerEditTabType {
         NONE, TEXT_BOX, SIGNATURE, STAMP, SHAPE, FORM
     }
 
     var onShowListener: Runnable? = null
     var onDismissListener: Runnable? = null
+    var animationDuration = DEFAULT_DURATION_ANIMATION
 
+    private var mediaBoxAnimator: ObjectAnimator? = null
+    private var maskAnimator: ValueAnimator? = null
     private var tabType = ViewerEditTabType.NONE
     private var selected: ImageButton? = null
     var onViewerEditTabAddButtonClickListener: OnViewerEditTabAddButtonClickListener? = null
@@ -42,21 +55,102 @@ class ViewerEditView : ConstraintLayout {
 
     private fun initView() {
         LayoutInflater.from(context).inflate(R.layout.view_viewer_edit, this)
-        visibility = View.GONE
+        visibility = View.INVISIBLE
         setupTabView()
-        setOnClickListener { dismiss() }
+
+        /** Move media box view to bottom of parent(hide it) **/
+        post {
+            val v = view_viewEdit_content
+            v.y = v.top + v.height.toFloat()
+        }
     }
 
     fun show() {
         visibility = View.VISIBLE
+        setOnClickListener { dismiss() }
+        post {
+            showMaskWithAnimation()
+            showMediaBoxWithAnimation()
+        }
         onShowListener?.run()
     }
 
     fun dismiss() {
-        visibility = View.GONE
+        setOnClickListener(null)
+        hideMaskWithAnimation()
+        hideMediaBoxWithAnimation()
         onDismissListener?.run()
     }
 
+    private fun showMaskWithAnimation() {
+        maskAnimator?.cancel()
+        val from = maskAnimator?.animatedValue ?: COLOR_DISMISS
+        val to = COLOR_SHOW
+        maskAnimator = ValueAnimator.ofObject(ArgbEvaluator(), from, to).apply {
+            duration = DEFAULT_DURATION_ANIMATION
+            interpolator = AccelerateDecelerateInterpolator()
+            addUpdateListener {
+                setBackgroundColor(it.animatedValue as Int)
+            }
+            start()
+        }
+    }
+
+    private fun hideMaskWithAnimation() {
+        maskAnimator?.cancel()
+        val from = maskAnimator?.animatedValue ?: COLOR_SHOW
+        val to = COLOR_DISMISS
+        maskAnimator = ValueAnimator.ofObject(ArgbEvaluator(), from, to).apply {
+            duration = DEFAULT_DURATION_ANIMATION
+            interpolator = AccelerateDecelerateInterpolator()
+            addUpdateListener {
+                setBackgroundColor(it.animatedValue as Int)
+            }
+            start()
+        }
+    }
+
+    private fun showMediaBoxWithAnimation() {
+        mediaBoxAnimator?.cancel()
+        val v = view_viewEdit_content
+        v.visibility = View.VISIBLE
+        val from = v.y
+        val to = v.top.toFloat()
+        val holder = PropertyValuesHolder.ofFloat("Y", from, to)
+        mediaBoxAnimator = ObjectAnimator.ofPropertyValuesHolder(v, holder).apply {
+            interpolator = AccelerateDecelerateInterpolator()
+            duration = animationDuration
+            addListener(object : AnimatorListenerAdapter() {
+                override fun onAnimationEnd(animation: Animator?) {
+                    super.onAnimationEnd(animation)
+                    removeListener(this)
+                }
+            })
+            start()
+        }
+    }
+
+    private fun hideMediaBoxWithAnimation() {
+        mediaBoxAnimator?.cancel()
+        val v = view_viewEdit_content
+        val from = v.y
+        val to = v.top.toFloat() + v.height
+        val holder = PropertyValuesHolder.ofFloat("Y", from, to)
+        mediaBoxAnimator = ObjectAnimator.ofPropertyValuesHolder(v, holder).apply {
+            interpolator = AccelerateDecelerateInterpolator()
+            duration = animationDuration
+            addListener(object : AnimatorListenerAdapter() {
+                override fun onAnimationEnd(animation: Animator?) {
+                    super.onAnimationEnd(animation)
+                    removeListener(this)
+                    v.visibility = View.INVISIBLE
+                    this@ViewerEditView.visibility = View.GONE
+                }
+            })
+            start()
+        }
+    }
+
     private fun setupTabView() {
         viewerEdit_tab.onClickListenerTabTextBox = OnClickListener(this::setupTextBoxView)
         viewerEdit_tab.onClickListenerTabSignature = OnClickListener(this::setupSignatureView)

reader/src/main/res/layout/view_viewer_edit.xml

@@ -3,10 +3,15 @@
     xmlns:app="http://schemas.android.com/apk/res-auto"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
-    android:background="#42000000">
+    xmlns:tools="http://schemas.android.com/tools"
+    android:background="@android:color/transparent">
 
     <android.support.constraint.ConstraintLayout
-        android:layout_width="360dp"
+        android:id="@+id/view_viewEdit_content"
+        tools:visibility="visible"
+        tools:background="#AA00CC"
+        android:visibility="invisible"
+        android:layout_width="0dp"
         android:layout_height="336dp"
         android:background="@drawable/shape_rec_w_up_rcorner"
         android:elevation="4dp"