lesson 34 – Draw: ovals in Kotlin

Hello viewer, You can now have our Tutorial Lessons in your android mobile device and read it offline.
Download kotlin Programming APP on PlayStore
Download Website SEO Lessons APP on PlayStore

Issue:

Draw an oval that occupies the entire screen and a circle inside it.

1 – We created a project called: Proyecto038

We delete the TextView that automatically adds the Android Studio and define the ConstraintLayout id with the value: layout1:

 

lesson 34 - Draw: ovals in Kotlin - lesson 34 - Draw: ovals in Kotlin - lesson 34 - Draw: ovals in Kotlin -

Now we encode the class where the whole logic is:

package com.coding180.project0038


import android.content.Context
import android.graphics.Canvas
import android.graphics.Paint
import android.support.v7.app.AppCompatActivity
import android.os.Bundle
import android.view.Window
import android.view.WindowManager
import android.widget.RelativeLayout
import android.graphics.RectF
import android.view.View


class MainActivity: AppCompatActivity () {

    override fun onCreate (savedInstanceState: Bundle?) {
        requestWindowFeature (Window.FEATURE_NO_TITLE);
        getWindow().setFlags (WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN);
        super.onCreate (savedInstanceState)
        setContentView (R.layout.activity_main)

        val layout1 = findViewById (R.id.layout1) as android.support.constraint.ConstraintLayout
        val background = Canvass (this)
        layout1.addView (background)
        supportActionBar !!. hide ()
    }

    class Canvass (context: Context): View (context) {

        override fun onDraw (canvas: Canvas) {
            canvas.drawRGB (255, 255, 255)
            val width = getWidth()
            val hieght = getHeight()
// coding180.com
            val brush1 = Paint ()
            brush1.setARGB (255, 0, 0, 0)
            brush1.setStrokeWidth (5f)
            brush1.setStyle (Paint.Style.STROKE)
            val rectangle1 = RectF (0f, 0f, width.toFloat (), hieght.toFloat ())
            canvas.drawOval (rectangle1, brush1)

            val minor: Int
            if (width < hieght)
                minor = width
            else
                minor = hieght

            brush1.setStyle (Paint.Style.FILL)
            brush1.setARGB (255, 255, 255, 0)
            canvas.drawCircle ((width / 2) .toFloat (), (hieght / 2) .toFloat (), (minor / 2) .toFloat (), brush1)
        }
    }
}

To hide the title bar and the top bar we must do the following in the onCreate method:

    Override fun onCreate (savedInstanceState: Bundle?) {
        RequestWindowFeature (Window.FEATURE_NO_TITLE);
        GetWindow (). SetFlags (WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN);
        Super.onCreate (savedInstanceState)
        SetContentView (R.layout.activity_main)

In the onDraw method we paint the white background and get the width and height of the screen:

        Override fun onDraw (canvas: Canvas) {
            Canvas.drawRGB (255, 255, 255)
            Val width = getWidth ()
            High val = getHeight ()

Next, we create the object of the class Paint and we configure the color, thickness of line and style:

         
            Val brush1 = Paint ()
            brush1.setARGB (255, 0, 0, 0)
            brush1.setStrokeWidth (5f)
            brush1.setStyle (Paint.Style.STROKE)

We create an object of the RectT class by passing the upper left-hand coordinate of the oval and its lower right-hand coordinate (taking into account that the oval will be drawn in that imaginary rectangle we indicate with these coordinates):

            Val rectangle1 = RectF (0f, 0f, width.toFloat (), high.toFloat ())
            Canvas.drawOval (rectangle1, brush1)

We get the smallest width and height of the device:

            
            Val minor: Int
            If (width <high)
                Smaller = wide
            Else
                Lower = high

Now we set the brush to draw the circle and draw it:

           
            brush1.setStyle (Paint.Style.FILL)
            brush1.setARGB (255, 255, 255, 0)
            Canvas.drawCircle ((width / 2) .toFloat (), (high / 2) .toFloat (), (minor / 2) .toFloat (), brush1)

The preview of the application is:

lesson 34 - Draw: ovals in Kotlin - lesson 34 - Draw: ovals in Kotlin - lesson 34 - Draw: ovals in Kotlin -

 

……….

About The Author

Related posts

Leave a Reply