This code demonstrates how to create a specific image with an erased circular area on an Android app using Kotlin. It achieves this by creating a bitmap, drawing a rectangle on it, and then erasing a circular region in the center. Finally, the resulting image is displayed on an ImageView.
Code Breakdown:
MainActivity.kt:
- This file defines the main Activity class responsible for the app's functionality.
- In the
onCreate
method, it retrieves the reference to the ImageView from the activity layout using its ID (imageView
). - It then calls the
eraseDrawing
function to generate the image with the erased area and sets it on the ImageView usingsetImageBitmap
.
eraseDrawing() function:
- This function creates a new bitmap with a specific size (1500x850 pixels) and desired configuration (ARGB_8888).
- A canvas is created from the bitmap. The canvas is then filled with a light blue background color.
- A rectangle is drawn on the canvas with a dark blue color, most likely representing the base drawing.
- A Paint object is created specifically for erasing. It enables anti-aliasing for smoother edges and sets the
xfermode
property toPorterDuff.Mode.CLEAR
. This transparency mode ensures pixels drawn with this paint are cleared to fully transparent (0 alpha). - Finally, a circle is drawn in the center of the canvas using the erasing paint. This erases the previously drawn rectangle within the circle's area.
- The function returns the resulting bitmap with the erased circle.
activity_main.xml:
- This file defines the layout of the main activity screen.
- It uses a ConstraintLayout as the root element and includes an ImageView with the ID
imageView
. The ImageView will display the image generated by theeraseDrawing
function.
Summary
This code snippet showcases a basic approach to erasing a specific area on a canvas in an Android application using Kotlin. The eraseDrawing
function demonstrates how to create a bitmap, draw on it, and then selectively erase a portion using a PorterDuffXfermode with the CLEAR
mode. This technique offers a way to create custom images with specific transparency effects.
MainActivity.kt
package com.cfsuman.kotlintutorials
import android.app.Activity
import android.graphics.*
import android.os.Bundle
import android.widget.ImageView
import kotlin.math.min
class MainActivity : Activity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
// get the widgets reference from XML layout
val imageView = findViewById<ImageView>(R.id.imageView)
// show drawing on image view
imageView.setImageBitmap(eraseDrawing())
}
}
// function to erase / clear drawing from canvas
fun eraseDrawing():Bitmap?{
val bitmap = Bitmap.createBitmap(
1500,
850,
Bitmap.Config.ARGB_8888
)
// canvas for drawing
val canvas = Canvas(bitmap).apply {
drawColor(Color.parseColor("#A2A2D0"))
}
// draw a rectangle on canvas
canvas.drawRect(
100F,
100F,
canvas.width - 100F,
canvas.height - 100F,
Paint().apply { color = Color.parseColor("#333399") }
)
// paint to erase / clear drawing from canvas
val paint = Paint().apply {
isAntiAlias = true
// destination pixels covered by
// the source are cleared to 0
xfermode = PorterDuffXfermode(PorterDuff.Mode.CLEAR)
}
// draw circle to erase / clear circular
// area drawing from canvas
canvas.drawCircle(
canvas.width / 2F,
canvas.height / 2F,
min(canvas.width,canvas.height) / 2F - 25F,
paint
)
return bitmap
}
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/rootLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#DCDCDC"
android:padding="24dp">
<ImageView
android:id="@+id/imageView"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
- android kotlin - Coroutines async await all
- android kotlin - Coroutines start undispatched
- android kotlin - Coroutines delay
- android kotlin - Canvas draw dotted line
- android kotlin - Canvas draw dashed line
- android kotlin - Canvas draw point
- android kotlin - Canvas draw text shadow
- android kotlin - Canvas draw text on path
- android kotlin - Canvas draw path
- android kotlin - Canvas draw arc
- android kotlin - Canvas draw text in rectangle
- android kotlin - Canvas draw text inside circle
- android kotlin - Canvas draw text wrap
- android kotlin - Canvas draw text
- android kotlin - Canvas draw circle