* Implement Graphic note brush erasers

* Fix some Graphic UI issues
ARK-Builders · Jul 14, 2024 · eb976f4 · eb976f4
1 parent 8d17323
commit eb976f4
Show file tree

Hide file tree

Showing 12 changed files with 64 additions and 43 deletions.
diff --git a/app/src/main/java/dev/arkbuilders/arkmemo/graphics/Color.kt b/app/src/main/java/dev/arkbuilders/arkmemo/graphics/Color.kt
@@ -14,5 +14,7 @@ enum class Color(val code: Int, val value: String) {
 
     BLUE(ColorCode.blue, "blue"),
 
-    PURPLE(ColorCode.purple, "purple")
+    PURPLE(ColorCode.purple, "purple"),
+
+    WHITE(ColorCode.white, "white")
 }
diff --git a/app/src/main/java/dev/arkbuilders/arkmemo/graphics/ColorCode.kt b/app/src/main/java/dev/arkbuilders/arkmemo/graphics/ColorCode.kt
@@ -8,4 +8,5 @@ object ColorCode {
     val green by lazy { android.graphics.Color.parseColor("#17B26A") }
     val blue by lazy { android.graphics.Color.parseColor("#0BA5EC") }
     val purple by lazy { android.graphics.Color.parseColor("#7A5AF8") }
+    val white by lazy { android.graphics.Color.parseColor("#FFFFFF") }
 }
diff --git a/app/src/main/java/dev/arkbuilders/arkmemo/graphics/SVG.kt b/app/src/main/java/dev/arkbuilders/arkmemo/graphics/SVG.kt
@@ -38,14 +38,6 @@ class SVG {
         paths.addLast(path)
     }
 
-    fun setViewBox(width: Float, height: Float) {
-        viewBox = ViewBox(width = width, height = height)
-    }
-
-    fun getViewBox(): ViewBox {
-        return viewBox
-    }
-
     fun generate(path: Path) {
         if (commands.isNotEmpty()) {
             val xmlSerializer = Xml.newSerializer()

diff --git a/app/src/main/java/dev/arkbuilders/arkmemo/ui/adapters/BrushAdapter.kt b/app/src/main/java/dev/arkbuilders/arkmemo/ui/adapters/BrushAdapter.kt
@@ -24,7 +24,6 @@ class BrushAdapter(
         when (attribute) {
             is BrushSizeTiny -> {
                 holder.ivBrush.setImageResource(R.drawable.bg_brush_size)
-
                 val padding = holder.itemView.context.resources.getDimensionPixelSize(
                     R.dimen.brush_size_tiny_padding
                 )
@@ -57,7 +56,6 @@ class BrushAdapter(
 
             is BrushSizeHuge -> {
                 holder.ivBrush.setImageResource(R.drawable.bg_brush_size)
-
                 val padding = holder.itemView.context.resources.getDimensionPixelSize(
                     R.dimen.brush_size_huge_padding
                 )

diff --git a/app/src/main/java/dev/arkbuilders/arkmemo/ui/adapters/BrushAttribute.kt b/app/src/main/java/dev/arkbuilders/arkmemo/ui/adapters/BrushAttribute.kt
@@ -13,7 +13,6 @@ sealed class BrushColor : BrushAttribute {
 }
 
 data object BrushSizeTiny : BrushSize()
-
 data object BrushSizeSmall : BrushSize()
 data object BrushSizeMedium : BrushSize()
 data object BrushSizeLarge : BrushSize()

diff --git a/app/src/main/java/dev/arkbuilders/arkmemo/ui/fragments/EditGraphicNotesFragment.kt b/app/src/main/java/dev/arkbuilders/arkmemo/ui/fragments/EditGraphicNotesFragment.kt
@@ -30,6 +30,7 @@ import dev.arkbuilders.arkmemo.ui.adapters.BrushSizeSmall
 import dev.arkbuilders.arkmemo.ui.adapters.BrushSizeTiny
 import dev.arkbuilders.arkmemo.ui.adapters.EqualSpacingItemDecoration
 import dev.arkbuilders.arkmemo.ui.viewmodels.GraphicNotesViewModel
+import dev.arkbuilders.arkmemo.utils.getBrushSize
 import dev.arkbuilders.arkmemo.utils.getColorCode
 import dev.arkbuilders.arkmemo.utils.gone
 import dev.arkbuilders.arkmemo.utils.observeSaveResult
@@ -109,7 +110,7 @@ class EditGraphicNotesFragment: BaseEditNoteFragment() {
             }
 
             sizeBrushes.firstOrNull { it.isSelected }?.let {
-                setBrushSize(it)
+                setBrushSize(it.getBrushSize())
             }
         })
         btnSave.setOnClickListener {
@@ -167,6 +168,7 @@ class EditGraphicNotesFragment: BaseEditNoteFragment() {
                 binding.layoutGraphicsControl.layoutColorChooser.root.gone()
                 binding.layoutGraphicsControl.tvEraser.setSelectState(false)
                 binding.layoutGraphicsControl.tvBrushColor.setSelectState(false)
+                graphicNotesViewModel.setEraseMode(false)
             } else {
                 binding.layoutGraphicsControl.layoutSizeChooser.root.gone()
             }
@@ -177,13 +179,15 @@ class EditGraphicNotesFragment: BaseEditNoteFragment() {
             tvEraser.setSelectState(!tvEraser.isSelectedState)
             if (tvEraser.isSelectedState) {
                 binding.layoutGraphicsControl.layoutSizeChooser.root.visible()
-                showBrushSizeList()
+                showBrushSizeList(isEraseMode = true)
                 binding.layoutGraphicsControl.layoutColorChooser.root.gone()
                 binding.layoutGraphicsControl.tvBrushSize.setSelectState(false)
                 binding.layoutGraphicsControl.tvBrushColor.setSelectState(false)
             } else {
                 binding.layoutGraphicsControl.layoutSizeChooser.root.gone()
+                graphicNotesViewModel.setEraseMode(false)
             }
+            graphicNotesViewModel.setEraseMode(tvEraser.isSelectedState)
         }
 
         val tvColor = binding.layoutGraphicsControl.tvBrushColor
@@ -195,6 +199,7 @@ class EditGraphicNotesFragment: BaseEditNoteFragment() {
                 binding.layoutGraphicsControl.layoutSizeChooser.root.gone()
                 binding.layoutGraphicsControl.tvBrushSize.setSelectState(false)
                 binding.layoutGraphicsControl.tvEraser.setSelectState(false)
+                graphicNotesViewModel.setEraseMode(false)
             } else {
                 binding.layoutGraphicsControl.layoutColorChooser.root.gone()
             }
@@ -206,7 +211,7 @@ class EditGraphicNotesFragment: BaseEditNoteFragment() {
         hostActivity.fragment = this
     }
 
-    private fun showBrushSizeList() {
+    private fun showBrushSizeList(isEraseMode: Boolean = false) {
 
         val brushSizeAdapter = BrushAdapter(
             attributes = sizeBrushes.apply {
@@ -217,7 +222,8 @@ class EditGraphicNotesFragment: BaseEditNoteFragment() {
             },
             onItemClick = { attribute, pos ->
                 Log.v(TAG, "onSizeSelected: " + attribute)
-                graphicNotesViewModel.setBrushSize(attribute as BrushSize)
+                graphicNotesViewModel.setBrushSize((attribute as BrushSize).getBrushSize())
+                graphicNotesViewModel.setEraseMode(isEraseMode)
             }
         )
 

diff --git a/app/src/main/java/dev/arkbuilders/arkmemo/ui/viewmodels/GraphicNotesViewModel.kt b/app/src/main/java/dev/arkbuilders/arkmemo/ui/viewmodels/GraphicNotesViewModel.kt
@@ -7,22 +7,18 @@ import androidx.lifecycle.MutableLiveData
 import androidx.lifecycle.ViewModel
 import androidx.lifecycle.viewModelScope
 import dagger.hilt.android.lifecycle.HiltViewModel
+import dev.arkbuilders.arkmemo.graphics.Color
 import dev.arkbuilders.arkmemo.graphics.SVG
 import dev.arkbuilders.arkmemo.graphics.Size
 import dev.arkbuilders.arkmemo.models.GraphicNote
-import dev.arkbuilders.arkmemo.ui.adapters.BrushSize
-import dev.arkbuilders.arkmemo.ui.adapters.BrushSizeHuge
-import dev.arkbuilders.arkmemo.ui.adapters.BrushSizeLarge
-import dev.arkbuilders.arkmemo.ui.adapters.BrushSizeMedium
-import dev.arkbuilders.arkmemo.ui.adapters.BrushSizeSmall
-import dev.arkbuilders.arkmemo.ui.adapters.BrushSizeTiny
 import kotlinx.coroutines.launch
 import javax.inject.Inject
 
 @HiltViewModel
 class GraphicNotesViewModel @Inject constructor(): ViewModel() {
 
-    private var paintColor = dev.arkbuilders.arkmemo.graphics.Color.BLACK.code
+    private var paintColor = Color.BLACK.code
+    private var lastPaintColor = paintColor
     private var strokeWidth = Size.TINY.value
 
     val paint get() = Paint().also {
@@ -60,20 +56,23 @@ class GraphicNotesViewModel @Inject constructor(): ViewModel() {
 
     fun setPaintColor(color: Int) {
         paintColor = color
+        lastPaintColor = paintColor
     }
 
-    fun setBrushSize(size: BrushSize) {
-        strokeWidth = when(size) {
-            is BrushSizeTiny -> Size.TINY.value
-            is BrushSizeSmall -> Size.SMALL.value
-            is BrushSizeMedium -> Size.MEDIUM.value
-            is BrushSizeLarge -> Size.LARGE.value
-            is BrushSizeHuge -> Size.HUGE.value
+    fun setBrushSize(size: Float) {
+        strokeWidth = size
+    }
+
+    fun setEraseMode(eraseMode: Boolean) {
+        paintColor = if (eraseMode) {
+            Color.WHITE.code
+        } else {
+            lastPaintColor
         }
     }
 }
 
 data class DrawPath(
     val path: Path,
-    val paint: Paint,
+    val paint: Paint
 )
diff --git a/app/src/main/java/dev/arkbuilders/arkmemo/ui/views/GraphicControlTextView.kt b/app/src/main/java/dev/arkbuilders/arkmemo/ui/views/GraphicControlTextView.kt
@@ -14,6 +14,7 @@ class GraphicControlTextView @JvmOverloads constructor(
 ) : androidx.appcompat.widget.AppCompatTextView(context, attrs) {
 
     var isSelectedState = false
+    private var iconTintColor: Int
 
     init {
         val typedArray: TypedArray =
@@ -22,6 +23,7 @@ class GraphicControlTextView @JvmOverloads constructor(
             typedArray.getResourceId(R.styleable.GraphicControlTextView_gct_drawable, 0)
         val isSelected =
             typedArray.getBoolean(R.styleable.GraphicControlTextView_gct_selected, false)
+        iconTintColor = typedArray.getColor(R.styleable.GraphicControlTextView_gct_icon_tint, -1)
 
         drawableResId.let {
             this.setCompoundDrawablesWithIntrinsicBounds(drawableResId, 0, 0, 0)
@@ -48,11 +50,12 @@ class GraphicControlTextView @JvmOverloads constructor(
                 context, R.drawable.bg_border_r8
             )
             val selectedColor = ContextCompat.getColor(context, R.color.text_tertiary)
+            val drawableColor = if (iconTintColor != -1) iconTintColor else selectedColor
 
             this.setTextColor(selectedColor)
             TextViewCompat.setCompoundDrawableTintList(
                 this,
-                ColorStateList.valueOf(selectedColor)
+                ColorStateList.valueOf(drawableColor)
             )
         }
 

diff --git a/app/src/main/java/dev/arkbuilders/arkmemo/ui/views/NotesCanvas.kt b/app/src/main/java/dev/arkbuilders/arkmemo/ui/views/NotesCanvas.kt
@@ -20,21 +20,19 @@ class NotesCanvas(context: Context, attrs: AttributeSet): View(context, attrs) {
     private var path = Path()
 
     override fun onDraw(canvas: Canvas) {
-        super.onDraw(canvas)
         val paths = viewModel.paths()
         if (paths.isNotEmpty()) {
-            paths.forEach {
-                canvas.drawPath(it.path, it.paint.apply {
-                    color = it.paint.color
-                    strokeWidth = it.paint.strokeWidth
-                })
+            paths.forEach { path ->
+                canvas.drawPath(path.path, path.paint)
             }
         }
     }
 
     override fun onTouchEvent(event: MotionEvent): Boolean {
         val x = event.x
         val y = event.y
+
+        var finishDrawing = false
         when(event.action) {
             MotionEvent.ACTION_DOWN -> {
                 path.moveTo(x, y)
@@ -62,13 +60,16 @@ class NotesCanvas(context: Context, attrs: AttributeSet): View(context, attrs) {
             }
             MotionEvent.ACTION_UP, MotionEvent.ACTION_CANCEL -> {
                 path = Path()
+                finishDrawing = true
             }
         }
-        val drawPath = DrawPath(path, viewModel.paint.apply {
-            color = viewModel.paint.color
-        })
-        viewModel.onDrawPath(drawPath)
-        invalidate()
+
+        if (!finishDrawing) {
+            val drawPath = DrawPath(path, viewModel.paint)
+            viewModel.onDrawPath(drawPath)
+            invalidate()
+        }
+
         return true
     }
 

diff --git a/app/src/main/java/dev/arkbuilders/arkmemo/utils/GraphicBrushExt.kt b/app/src/main/java/dev/arkbuilders/arkmemo/utils/GraphicBrushExt.kt
@@ -10,6 +10,12 @@ import dev.arkbuilders.arkmemo.ui.adapters.BrushColorGrey
 import dev.arkbuilders.arkmemo.ui.adapters.BrushColorOrange
 import dev.arkbuilders.arkmemo.ui.adapters.BrushColorPurple
 import dev.arkbuilders.arkmemo.ui.adapters.BrushColorRed
+import dev.arkbuilders.arkmemo.ui.adapters.BrushSize
+import dev.arkbuilders.arkmemo.ui.adapters.BrushSizeHuge
+import dev.arkbuilders.arkmemo.ui.adapters.BrushSizeLarge
+import dev.arkbuilders.arkmemo.ui.adapters.BrushSizeMedium
+import dev.arkbuilders.arkmemo.ui.adapters.BrushSizeSmall
+import dev.arkbuilders.arkmemo.ui.adapters.BrushSizeTiny
 
 fun Int.getStrokeSize(): Float {
     return when(this) {
@@ -42,6 +48,7 @@ fun Int.getStrokeColor(): String {
         Color.BLUE.code   -> Color.BLUE.value
         Color.PURPLE.code -> Color.PURPLE.value
         Color.ORANGE.code -> Color.ORANGE.value
+        Color.WHITE.code  -> Color.WHITE.value
         else              -> Color.BLACK.value
     }
 }
@@ -55,6 +62,7 @@ fun String.getColorCode(): Int {
         Color.BLUE.value   -> Color.BLUE.code
         Color.PURPLE.value -> Color.PURPLE.code
         Color.ORANGE.value -> Color.ORANGE.code
+        Color.WHITE.value  -> Color.WHITE.code
         else               -> Color.BLACK.code
     }
 }
@@ -69,4 +77,14 @@ fun BrushColor.getColorCode(): Int {
         is BrushColorBlue -> Color.BLUE.code
         is BrushColorPurple -> Color.PURPLE.code
     }
+}
+
+fun BrushSize.getBrushSize(): Float {
+    return when(this) {
+        is BrushSizeTiny -> Size.TINY.value
+        is BrushSizeSmall -> Size.SMALL.value
+        is BrushSizeMedium -> Size.MEDIUM.value
+        is BrushSizeLarge -> Size.LARGE.value
+        is BrushSizeHuge -> Size.HUGE.value
+    }
 }
diff --git a/app/src/main/res/layout/layout_graphic_bottom_control.xml b/app/src/main/res/layout/layout_graphic_bottom_control.xml
@@ -77,6 +77,7 @@
         style="@style/ActionTextView"
         android:drawableStart="@drawable/ic_selected_brush_type"
         app:gct_drawable="@drawable/ic_selected_brush_type"
+        app:gct_icon_tint="@color/black"
         android:drawablePadding="8dp"
         android:text="@string/graphic_control_color"
         android:textColor="@color/fg_secondary"

diff --git a/app/src/main/res/values/attrs.xml b/app/src/main/res/values/attrs.xml
@@ -10,6 +10,7 @@
     <declare-styleable name="GraphicControlTextView">
         <attr name="gct_drawable" format="reference|integer"/>
         <attr name="gct_selected" format="reference|boolean"/>
+        <attr name="gct_icon_tint" format="reference|integer"/>
     </declare-styleable>
 
     <declare-styleable name="SupportTextView">