Merge pull request #138 from code-payments/feat/improve-bill-rendering

feat: improve bill rendering (images)

Author: bmc08gt

app/src/main/java/com/getcode/util/ModifierExt.kt

@@ -14,17 +14,22 @@ import androidx.compose.runtime.remember
 import androidx.compose.ui.ExperimentalComposeUiApi
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.composed
+import androidx.compose.ui.draw.drawBehind
+import androidx.compose.ui.draw.drawWithContent
+import androidx.compose.ui.geometry.Offset
+import androidx.compose.ui.graphics.BlendMode
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.RectangleShape
 import androidx.compose.ui.graphics.Shape
-import androidx.compose.ui.input.pointer.pointerInput
 import androidx.compose.ui.input.pointer.pointerInteropFilter
+import androidx.compose.ui.layout.layout
 import androidx.compose.ui.layout.onPlaced
 import androidx.compose.ui.platform.LocalDensity
 import androidx.compose.ui.semantics.Role
 import androidx.compose.ui.unit.Dp
 import androidx.compose.ui.unit.DpSize
 import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.offset
 
 inline fun Modifier.addIf(
     predicate: Boolean,
@@ -56,7 +61,8 @@ fun Modifier.unboundedClickable(
 }
 
 
-fun Modifier.debugBounds(color: Color = Color.Magenta, shape: Shape = RectangleShape) = this.border(1.dp, color, shape)
+fun Modifier.debugBounds(color: Color = Color.Magenta, shape: Shape = RectangleShape) =
+    this.border(1.dp, color, shape)
 
 fun Modifier.rememberedClickable(
     enabled: Boolean = true,
@@ -122,4 +128,61 @@ fun Modifier.swallowClicks(onClick: () -> Unit = { }): Modifier =
             onClick()
         }
         true
-    }
+    }
+
+/**
+ * Draws circle with a solid [color] behind the content.
+ *
+ * @param color The color of the circle.
+ * @param padding The padding to be applied externally to the circular shape. It determines the spacing between
+ * the edge of the circle and the content inside.
+ *
+ * @return Combined [Modifier] that first draws the background circle and then centers the layout.
+ */
+fun Modifier.circleBackground(color: Color, padding: Dp): Modifier {
+    val backgroundModifier = drawBehind {
+        drawCircle(color, size.width / 2f, center = Offset(size.width / 2f, size.height / 2f))
+    }
+
+    val layoutModifier = layout { measurable, constraints ->
+        // Adjust the constraints by the padding amount
+        val adjustedConstraints = constraints.offset(-padding.roundToPx())
+
+        // Measure the composable with the adjusted constraints
+        val placeable = measurable.measure(adjustedConstraints)
+
+        // Get the current max dimension to assign width=height
+        val currentHeight = placeable.height
+        val currentWidth = placeable.width
+        val newDiameter = maxOf(currentHeight, currentWidth) + padding.roundToPx() * 2
+
+        // Assign the dimension and the center position
+        layout(newDiameter, newDiameter) {
+            // Place the composable at the calculated position
+            placeable.placeRelative(
+                (newDiameter - currentWidth) / 2,
+                (newDiameter - currentHeight) / 2
+            )
+        }
+    }
+
+    return this then backgroundModifier then layoutModifier
+}
+
+fun Modifier.punchRectangle(color: Color) = this.drawWithContent {
+    drawRect(
+        color,
+        blendMode = BlendMode.Src
+    )
+
+    drawContent()
+}
+
+fun Modifier.punchCircle(color: Color) = this.drawWithContent {
+    drawCircle(
+        color,
+        blendMode = BlendMode.Src
+    )
+
+    drawContent()
+}