B4A Library [B4X] [XUI] CropView

Cross platform, custom view that allows the user to select the cropping window.

1. Add the view with the designer.
2. Set the bitmap with CropView.SetBitmap.
3. Optionally handle the CropCompleted event.
4. Call GetCroppedBitmap to get the cropped bitmap.
5. You can check that there is a valid selection window by calling IsValidSelection.

Depends on: XUI, BitmapCreator (both are internal libraries).
Requires a recent version of B4X.

The class is included in the B4A project.

 

[JohnC]

Is there a way to make the crop window circular?

 

[Erel]

It will require some work. Example of cropping a round image without user selection: https://www.b4x.com/android/forum/threads/b4x-xui-create-a-round-image.85102/#content

 

[tuhatinhvn]

Can zoom in or zoom out??

 

[Erel]

The first post clearly explains what it does. It allows the user to select an area in the image. It doesn't do anything else.

 

[MrKim]

Exactly what I needed! Erel you are amazing! However, I wanted my users to be able to fine tune their selection so I modified it a bit so you can grab the selection by the corners and adjust. Thought I would share it.

These are the changes to code:

Sub Class_Globals
.
.
    Private sx, sy, sx2, sy2 As Int
    Private  MoveUpper, MoveLeft As Boolean
.
.
End Sub
.
.
.

Private Sub pnl_Touch (Action As Int, X As Float, Y As Float)
    x = (x - OffsetX)/ xui.Scale
    y = (y - OffsetY) / xui.Scale
    x = Max(0, Min(ColorBC.mWidth - 1, X))
    y = Max(0, Min(ColorBC.mHeight - 1, Y))
    Select Action
        Case pnl.TOUCH_ACTION_DOWN
            If ((X < SelectionRect.Right) And (X > SelectionRect.Left)) And ((Y >SelectionRect.Top) And (Y < SelectionRect.Bottom)) Then
                sx2 = X
                sy2 = Y
                If (sx2 < (SelectionRect.Width / 2)) Then MoveLeft = True Else MoveLeft = False
                If (sy2 < (SelectionRect.Height / 2)) Then MoveUpper = True Else MoveUpper = False
            Else
                SelectionRect.Left = 0
                SelectionRect.Top = 0
                SelectionRect.Right = 0
                SelectionRect.Bottom = 0
                sx = X
                sy = Y
                sx2 = 0
                sy2 = 0
            End If
        Case pnl.TOUCH_ACTION_MOVE
            If (sx2 > 0) Or (sy2 > 0) Then
                If MoveLeft Then
                    SelectionRect.Left = SelectionRect.Left + (X - sx2)
                Else
                    Log(SelectionRect.Right)
                    SelectionRect.Right = SelectionRect.Right + (X - sx2)
                End If
                sx2 = X
                If MoveUpper Then 
                    SelectionRect.Top = SelectionRect.Top + (Y - sy2)
                Else
                    SelectionRect.Bottom = SelectionRect.Bottom + (Y - sy2)
                End If
                sy2 = Y
            Else
                SelectionRect.Left = Min(sx, X)
                SelectionRect.Top = Min(sy, Y)
                SelectionRect.Right = Max(sx, X)
                SelectionRect.Bottom = Max(sy, Y)
            End If
        Case pnl.TOUCH_ACTION_UP
            If IsValidSelection Then
                CallSubDelayed(mCallBack, mEventName & "_CropCompleted")
            End If
    End Select
    UpdateTarget
End Sub

I have also included the modified program.

 

[klaus]

Did you have a look at this project: Resize and crop image?
It is B4A only, I will look to male it B4X XUI.

 

[MrKim]

Did you have a look at this project: Resize and crop image?
It is B4A only, I will look to male it B4X XUI.

Nope, missed it. I will take a look. I only need B4A anyway...

 

[MrKim]

Did you have a look at this project: Resize and crop image?
It is B4A only, I will look to male it B4X XUI.

Sigh, yours work is so much cleaner, that is probably what I will use.

 

[klaus]

I will, hopefully, publish the XUI CustomView tomorrow.