Show Delete indicator while note item is being swiped

Author: tuancoltech

app/src/main/java/dev/arkbuilders/arkmemo/graphics/ColorCode.kt

@@ -11,4 +11,5 @@ internal object ColorCode {
     val white by lazy { android.graphics.Color.parseColor("#FFFFFF") }
     val brown by lazy { android.graphics.Color.parseColor("#B54708") }
     val lightYellow by lazy { android.graphics.Color.parseColor("#f8f6ed") }
+    val borderPrimary by lazy { android.graphics.Color.parseColor("#D0D5DD") }
 }

app/src/main/java/dev/arkbuilders/arkmemo/ui/fragments/NotesFragment.kt

@@ -1,10 +1,15 @@
 package dev.arkbuilders.arkmemo.ui.fragments
 
 import android.content.res.ColorStateList
+import android.graphics.Canvas
+import android.graphics.Color
+import android.graphics.Paint
 import android.os.Bundle
+import android.util.TypedValue
 import android.view.LayoutInflater
 import android.view.View
 import android.view.ViewGroup
+import android.widget.TextView
 import android.widget.Toast
 import androidx.core.content.ContextCompat
 import androidx.core.widget.addTextChangedListener
@@ -20,6 +25,7 @@ import dagger.hilt.android.AndroidEntryPoint
 import dev.arkbuilders.arkmemo.BuildConfig
 import dev.arkbuilders.arkmemo.R
 import dev.arkbuilders.arkmemo.databinding.FragmentHomeBinding
+import dev.arkbuilders.arkmemo.graphics.ColorCode
 import dev.arkbuilders.arkmemo.models.Note
 import dev.arkbuilders.arkmemo.models.RootNotFound
 import dev.arkbuilders.arkmemo.models.VoiceNote
@@ -31,6 +37,7 @@ import dev.arkbuilders.arkmemo.ui.viewmodels.ArkMediaPlayerSideEffect
 import dev.arkbuilders.arkmemo.ui.viewmodels.ArkMediaPlayerViewModel
 import dev.arkbuilders.arkmemo.ui.viewmodels.NotesViewModel
 import dev.arkbuilders.arkmemo.ui.views.toast
+import dev.arkbuilders.arkmemo.utils.dpToPx
 import dev.arkbuilders.arkmemo.utils.getTextFromClipBoard
 import dev.arkbuilders.arkmemo.utils.gone
 import dev.arkbuilders.arkmemo.utils.replaceFragment
@@ -94,6 +101,88 @@ class NotesFragment : BaseFragment() {
                 return false
             }
 
+            override fun onChildDraw(
+                c: Canvas,
+                recyclerView: RecyclerView,
+                viewHolder: RecyclerView.ViewHolder,
+                dX: Float,
+                dY: Float,
+                actionState: Int,
+                isCurrentlyActive: Boolean,
+            ) {
+                if (actionState == ItemTouchHelper.ACTION_STATE_SWIPE) {
+                    val itemView = viewHolder.itemView
+                    val context = itemView.context
+                    val paint =
+                        Paint().apply {
+                            color = Color.RED
+                            isAntiAlias = true
+                        }
+
+                    val strokePaint =
+                        Paint().apply {
+                            style = Paint.Style.STROKE
+                            color = ColorCode.borderPrimary
+                            strokeWidth = 1.dpToPx().toFloat()
+                            isAntiAlias = true
+                        }
+
+                    val tvDelete =
+                        TextView(context).apply {
+                            // Size should be the same as R.dimen.text_size_delete
+                            setTextSize(TypedValue.COMPLEX_UNIT_SP, 14f)
+                        }
+
+                    val textPaint =
+                        Paint().apply {
+                            color = Color.WHITE
+                            textSize = tvDelete.textSize
+                            textAlign = Paint.Align.RIGHT
+                            typeface = tvDelete.typeface
+                            isAntiAlias = true
+                        }
+
+                    val cornerRadius = context.resources.getDimension(R.dimen.corner_radius_big)
+                    val endMargin = 16.dpToPx().toFloat()
+
+                    val x = itemView.right.toFloat() - endMargin
+                    val y =
+                        (itemView.top + itemView.bottom) / 2f +
+                            (textPaint.descent() - textPaint.ascent()) / 2f - textPaint.descent()
+
+                    c.drawRoundRect(
+                        itemView.left.toFloat(),
+                        itemView.top.toFloat(),
+                        itemView.right.toFloat(),
+                        itemView.bottom.toFloat(),
+                        cornerRadius,
+                        cornerRadius,
+                        paint,
+                    )
+
+                    c.drawRoundRect(
+                        itemView.left.toFloat(),
+                        itemView.top.toFloat(),
+                        itemView.right.toFloat(),
+                        itemView.bottom.toFloat(),
+                        cornerRadius,
+                        cornerRadius,
+                        strokePaint,
+                    )
+
+                    c.drawText(context.getString(R.string.action_delete), x, y, textPaint)
+                }
+                super.onChildDraw(
+                    c,
+                    recyclerView,
+                    viewHolder,
+                    dX,
+                    dY,
+                    actionState,
+                    isCurrentlyActive,
+                )
+            }
+
             override fun onSwiped(
                 viewHolder: RecyclerView.ViewHolder,
                 direction: Int,

app/src/main/res/drawable/bg_big_radius.xml

@@ -3,5 +3,6 @@
 
     <stroke android:width="@dimen/border_width_thin" android:color="@color/border_primary"/>
     <corners android:radius="@dimen/corner_radius_big"/>
+    <solid android:color="@color/white"/>
 
 </shape>

app/src/main/res/layout/adapter_text_note.xml

@@ -83,7 +83,7 @@
             android:id="@+id/iv_graphics_thumb"
             android:layout_width="@dimen/graphic_thumb_width"
             android:layout_height="match_parent"
-            app:layout_constraintEnd_toEndOf="parent"
+            app:layout_constraintEnd_toStartOf="@+id/tv_delete"
             android:layout_marginEnd="@dimen/border_width_thin"
             app:layout_constraintTop_toTopOf="parent"
             app:layout_constraintBottom_toBottomOf="parent"
@@ -116,7 +116,7 @@
             app:layout_constraintBottom_toBottomOf="parent"
             android:text="@string/action_delete"
             android:textColor="@color/white"
-            android:textSize="14sp"
+            android:textSize="@dimen/text_size_delete"
             android:id="@+id/tv_delete"
             android:visibility="gone"
             tools:visibility="visible"

app/src/main/res/values/dimens.xml

@@ -20,6 +20,7 @@
     <dimen name="radius_medium">12dp</dimen>
     <dimen name="radius_full">36dp</dimen>
     <dimen name="border_width_thin">1dp</dimen>
+    <dimen name="text_size_delete">14sp</dimen>
 
     <!-- Recording -->
     <dimen name="record_small_button_size">30dp</dimen>