Android Tutorial Drawing a selection window

Erel

Administrator
Staff member
Licensed User
The following code draws a "selection" window when you move the finger:
B4X:
Sub Globals
    Dim Canvas1 As Canvas
    Dim Rect1 As Rect
    Dim sx, sy As Int
End Sub

Sub Activity_Create(FirstTime As Boolean)
    Canvas1.Initialize(Activity)
    Rect1.Initialize(0, 0, 0, 0)
End Sub

Sub Activity_Touch (Action As Int, X As Float, Y As Float)
    If Action = Activity.ACTION_DOWN Then
        sx = X
        sy = Y
    Else
        'Erase previous rectangle
        Canvas1.DrawRect(Rect1, Colors.Black, False, 5dip)
        If Action = Activity.ACTION_MOVE Then
            'Draw the new rectangle
            Rect1.Left = Min(sx, X)
            Rect1.Right = Max(sx, X)
            Rect1.Top = Min(sy, Y)
            Rect1.Bottom = Max(sy, Y)
            Canvas1.DrawRect(Rect1, Colors.White, False, 5dip)
        End If
        Activity.Invalidate
    End If
End Sub
sx and sy saves the box origin.
Each time the user moves his finger we first erase the previous box and then draw the new one.
Eventually we call Activity.Invalidate to make the activity redraw itself.

 

Croïd

Active Member
Licensed User
Please, i'm confused, how to make with a circle ?

B4X:
Sub Activity_Touch (Action As Int, x As Float, y As Float)
    If Action = Activity.ACTION_DOWN Then
      sx = x
      sy = y    
    cvsMain.DrawCircle(sx,sy,100dip,Colors.Red,False,1dip)
    Else
        If Action = Activity.ACTION_UP Then
        cvsMain.DrawCircle(sx,sy,100dip,Colors.Transparent, False, 1dip)
        End If
      Activity.Invalidate
    End If
End Sub
I search the possibility draw circle for move enlarge shrink
 
Last edited:

klaus

Expert
Licensed User
Here you are:
B4X:
Sub Process_Globals
    Dim x0 = 50%x As Int                            ' original center x coordinate
    Dim y0 = 50%y As Int                            ' original center y coordinate
    Dim r0 = 50dip As Int                            ' original radius
    Dim sx, sy, x1, y1, r1 As Int      
    Dim flgMove As String                            ' flag used to define Move or Resize
    Dim MinRadius = 30dip As Int           ' limit for the radius
    Dim SelectionWidth = 10dip As Int    ' width for detection of resize
    Dim CircleStroke = 3dip As Int        ' circle line thickness
    Dim rectCircle As Rect                        ' rectangle used for Invalidate2
End Sub

Sub Globals
    Dim cvsActivity As Canvas
    Dim CircleColor As Int
End Sub

Sub Activity_Create(FirstTime As Boolean)
    Activity.Color = Colors.Black
    cvsActivity.Initialize(Activity)
    rectCircle.Initialize(x0 - r0 - CircleStroke, y0 - r0 - CircleStroke, x0 + r0 + CircleStroke, y0 + r0 + CircleStroke)
End Sub

Sub Activity_Resume
    ' draw initial circle
    cvsActivity.DrawCircle(x0, y0, r0, Colors.Red, False, CircleStroke)
End Sub

Sub Activity_Pause (UserClosed As Boolean)

End Sub

Sub Activity_Touch (Action As Int, X As Float, Y As Float)
    Select Action
    Case Activity.ACTION_DOWN
        flgMove = 0
        x1 = x0
        y1 = y0
        sx = X
        sy = Y
        r1 = Sqrt(Power(X - x0, 2) + Power(Y - y0, 2))
        If Abs(r1 - r0) < SelectionWidth Then
            flgMove = "Resize"
            CircleColor = Colors.Green
            Activity.Title = "Resize"        'draws a green cicle for Resize
            cvsActivity.DrawCircle(x1, y1, r0, CircleColor, False, CircleStroke)
            Activity.Invalidate2(rectCircle)
        Else If r1 < r0 - SelectionWidth Then
            flgMove = "Move"
            CircleColor = Colors.Blue        'draws a blue cicle for Move
            Activity.Title = "Move"
            cvsActivity.DrawCircle(x1, y1, r0, CircleColor, False, CircleStroke)
            Activity.Invalidate2(rectCircle)
        End If
    Case Activity.ACTION_MOVE
        If flgMove.Length > 0 Then
            ' erase old circle
            cvsActivity.DrawCircle(x1, y1, r0, Colors.Black, False, CircleStroke)
            Activity.Invalidate2(rectCircle)
            If flgMove = "Move" Then
                ' calculate new center coordinates
                x1 = x0 + X - sx
                y1 = y0 + Y - sy
            Else    ' Resize
                ' calculate new radius
                r0 = Max(MinRadius, Sqrt(Power(X - x0, 2) + Power(Y - y0, 2)))
            End If
            ' draw new circle
            rectCircle.Initialize(x1 - r0 - CircleStroke, y1 - r0 - CircleStroke, x1 + r0 + CircleStroke, y1 + r0 + CircleStroke)
            cvsActivity.DrawCircle(x1, y1, r0, CircleColor, False, CircleStroke)
            Activity.Invalidate2(rectCircle)
        End If
    Case Activity.ACTION_UP
        If flgMove.Length > 0 Then
            ' draw new cicle default color
            cvsActivity.DrawCircle(x1, y1, r0, Colors.Red, False, CircleStroke)
            Activity.Invalidate2(rectCircle)
            x0 = x1
            y0 = y1
        End If
    End Select
End Sub
The circle can be sized or moved.
Touch inside the circle to move it, the circle will change to green.
Touch the circle line to size it, the circle will change to blue.

Attached the test project.
 

Attachments

Top