Cropping a Bitmap 2 (Visual Basic Script)

Take the following steps to add code that lets you select an area with a mouse, crop the display to show only that area, and trim the bitmap to match the selected area. (This example uses both cropping and trimming, so that you can see the difference.):

1.

Start with the project that you created in Loading and Displaying an Image.

2.

Add the following code between the <BODY> and </BODY> tags to add a LEAD Raster Process object named RasterProc:

<OBJECT ID="RasterProc" NAME="RasterProc"
   CLASSID="CLSID:00140712-B1BA-11CE-ABC6-F5B2E79D9E3F"
   CODEBASE="path to CAB file/Ltrpr14n.cab">
   <P>This is not supported in web browser.</P>
</OBJECT><BR>

3.

Add the following code between the <FORM> and </FORM> tags to add Two buttons: btnCropp and btnTrim:

<INPUT TYPE="button" NAME="btnSelectRect" VALUE="Select Rectangle" LANGUAGE="VBScript"
   OnClick="SelectRect">

<INPUT TYPE="button" NAME="btnTrim" VALUE="Trim Image" LANGUAGE="VBScript"

   OnClick="Trim">

4.

Add the following code between the <SCRIPT> and </SCRIPT> tags:

Dim Cropping 'The state when the mouse is used for cropping
Dim StartX 'Starting X position in screen pixels
Dim StartY 'Starting Y position in screen pixels
Dim EndX 'Ending X position in screen pixels
Dim EndY 'Ending Y position in screen pixels

5.

Add the following code between the <SCRIPT> </SCRIPT> tags for btnCrop and btnTrim buttons respectively:

Sub SelectRect()
   LEADRasterView1.EnableFireMouse2Event = True
   'Set the scale mode to twips so that we do not have to
   'translate mouse coordinates
   LEADRasterView1.ScaleMode = 1
   'Initialize cropping so that you can do it more than once
   If Cropping = True Then
      'Set the clipping area to match the image.
      LEADRasterView1.SetDstClipRect LEADRasterView1.DstLeft, LEADRasterView1.DstTop, LEADRasterView1.DstWidth, LEADRasterView1.DstHeight
      'Display the image
      LEADRasterView1.ForceRepaint
   End If

   'Set a global variable to let other events know that you are cropping
   Cropping = True
   'Set the pointer to a crosshair
   LEADRasterView1.MousePointer = 2
End Sub

Sub Trim()
   'Trim the bitmap.
   RasterProc.Trim LEADRasterView1.Raster, 0, 0, LEADRasterView1.Raster.BitmapWidth / 2, LEADRasterView1.Raster.BitmapHeight
End Sub

6.

Add the following code between the <HEAD> </HEAD> tags to handle the Main Control’s MouseDown2 event:

<SCRIPT LANGUAGE="VBScript" FOR="LEADRasterView1" EVENT="MouseDown2(Button, Shift , X , Y)">
   <!--
       'Save the starting position
       StartX = x
       StartY = y
      'Make the rubberband invisible until the mouse moves
      LEADRasterView1.RubberBandVisible = False
   //-->
</SCRIPT>

7.

Add the following code between the <HEAD> </HEAD> tags to handle the Main Control’s MouseMove2 event:

<SCRIPT LANGUAGE="VBScript" FOR="LEADRasterView1" EVENT="MouseMove2(Button, Shift, x, y)">
   <!--
      Dim rbX
      Dim rbY
      Dim rbWidth
      Dim rbHeight
      If Cropping = True And Button = 1 Then
         'Get the current mouse position
         EndX = x
         EndY = y
         'Determine the origin of the rubberband rectangle, regardless of which way the mouse moves.
         If EndX > StartX Then
            rbX = StartX
         Else
            rbX = EndX
         End If
         If EndY > StartY Then
            rbY = StartY
         Else            rbY = EndY
         End If
         'Determine the height and width of the rubberband rectangle
         rbHeight = Abs(StartY - EndY)
         rbWidth = Abs(StartX - EndX)
         'Set the rubberband rectangle
         LEADRasterView1.SetRubberBandRect rbX, rbY, rbWidth, rbHeight
         'Alternatively, you could use the following properties to set the
         'rubberband rectangle.
         LEADRasterView1.RubberBandHeight = rbHeight
         LEADRasterView1.RubberBandLeft = rbX
         LEADRasterView1.RubberBandTop = rbY
         LEADRasterView1.RubberBandWidth = rbWidth
         'Make the rubberband rectangle visible
         LEADRasterView1.RubberBandVisible = True
         End If
   //-->
</SCRIPT>

8.

Add the following code between the <HEAD> </HEAD> tags to handle the Main Control’s MouseUp2 event:

<SCRIPT LANGUAGE="VBScript" FOR="LEADRasterView1" EVENT="MouseUp2(Button, Shift, x, y)">
   <!--
      Dim CropLeft
      Dim CropTop
      Dim CropWidth
      Dim CropHeight

      If Cropping = True Then
         'Get the current mouse position
         EndX = x
         EndY = y
         'Get the origin of the clipping rectangle.
         'Allow for different mouse drag directions
         If StartX < EndX Then
            CropLeft = StartX
         Else
            CropLeft = EndX
         End If
         If StartY < EndY Then
            CropTop = StartY
         Else
            CropTop = EndY
         End If
         'Get the height and width of the cropped area
         CropWidth = Abs(EndX - StartX)
         CropHeight = Abs(EndY - StartY)
         'Crop and repaint the image
         LEADRasterView1.SetDstClipRect CropLeft, CropTop, CropWidth, CropHeight
         LEADRasterView1.ForceRepaint
         LEADRasterView1.RubberBandVisible = False
         LEADRasterView1.MousePointer = 0 'Default
      End If
   //-->
</SCRIPT>

9.

Run your page to test it.