|
2-7-03
Cropping Graphics with REALbasic by
Erick Tejkowski
This week we'll begin a multi-part tutorial about cropping graphics with REALbasic. These tutorials
will cover the basics of how to implement click-and-drag graphics selection and cropping, like you'll find
in most popular graphics applications.
The tutorial emulates a Cocoa project available from Apple.
As we progress through the project each week,
we'll add various features to match the original example. So, go check out the original example and come back here
ready for some REALbasic coding. NOTE: This demo is made with OS X in mind.
Build the Interface
Launch REALbasic, and add two Canvas controls to Window1. Resize each one to a size of 256 x 256. You can position
them anywhere in the window that you want, but if you are trying to match the Cocoa project, position them next to each other
in a horizontal arrangement.
You should also add a 256 x 256 image to your REALbasic project. If you don't have an image, one accompanies the
project download at the end of this tutorial. It is named scenery.
Add the Code
Double-click the Window Editor of Window1 to open its Code Editor. Choose Edit-New Property and create the following properties.
- lastX as integer
- lastY as integer
- pictureDest as picture
- pictureSrc as picture
- startX as integer
- startY as integer
To initialize the two Picture objects, add the following code to the Open event of Canvas1:
pictureSrc = newpicture(canvas1.width,canvas1.height,32)
pictureDest = newpicture(canvas1.width,canvas1.height,32)
pictureSrc.graphics.drawpicture scenery,0,0
pictureDest.graphics.drawpicture scenery,0,0
Next, enter this code in the MouseDown event of Canvas1 to begin a click-and-drag operation:
startX = X
startY = Y
lastX = X
lastY = Y
return true
Then, add this code to the MouseDrag event of Canvas1 to track the drag operation:
dim g as graphics
g=pictureSrc.graphics
if lastx<>x OR lasty<>y then
lastX = X
lastY = Y
g.foreColor=rgb(255,255,0)
g.drawpicture scenery,0,0
g.drawrect startX,startY,lastX-startX,lastY-startY
g=me.graphics
g.foreColor=rgb(255,255,0)
g.drawpicture scenery,0,0
g.drawrect startX,startY,lastX-startX,lastY-startY
end if
Next, we'll need to handle the MouseUp event of Canvas1. This code takes care of copying the selection
from the source image to the destination image, which will appear in Canvas2.
dim g,gg as graphics
g=pictureDest.graphics
gg=canvas2.graphics
g.clearrect 0,0,g.width,g.height
gg.forecolor=rgb(255,255,255)
gg.fillrect 0,0,g.width,g.height
if startX<lastX and startY<lastY then
g.drawpicture scenery,startX,startY,lastX-startX,lastY-startY,startX,startY,lastX-startX,lastY-startY
gg.drawpicture scenery,startX,startY,lastX-startX,lastY-startY,startX,startY,lastX-startX,lastY-startY
elseif startX>lastX and startY>lastY then
g.drawpicture scenery,lastX,lastY,startX-lastX,startY-lastY,lastX,lastY,startX-lastX,startY-lastY
gg.drawpicture scenery,lastX,lastY,startX-lastX,startY-lastY,lastX,lastY,startX-lastX,startY-lastY
elseif startX>lastX then
g.drawpicture scenery,lastX,startY,startX-lastX,lastY-startY,lastX,startY,startX-lastX,lastY-startY
gg.drawpicture scenery,lastX,startY,startX-lastX,lastY-startY,lastX,startY,startX-lastX,lastY-startY
elseif startY>lastY then
g.drawpicture scenery,startX,lastY,lastX-startX,startY-lastY,startX,lastY,lastX-startX,startY-lastY
gg.drawpicture scenery,startX,lastY,lastX-startX,startY-lastY,startX,lastY,lastX-startX,startY-lastY
end if
To draw the image in Canvas1, add this code to the Paint event of Canvas1:
g.drawpicture pictureSrc,0,0
Finally, to draw in Canvas2, add this code to its Paint event:
g.forecolor=rgb(255,255,255)
g.fillrect 0,0,me.width,me.height
g.drawpicture pictureDest,0,0
That's it! Choose Debug-Run to test your work.
Conclusion
You can
download the completed project here.
We'll continue adding features to the project next week. See you then!
2-5-03
REALbasic News
by
Erick Tejkowski
Lorin Leaves
REAL Software's Vice President of Marketing, Lorin Rivers, has announced that he will be leaving the
REALbasic team, effective this week. Since Lorin is one of the people responsible for getting the REALbasic section
at ResExcellence up and running, we wish him the best of luck on his new endeavors!
Control Safari with REALbasic
MACbase has posted a combination REALbasic and AppleScript tutorial
that shows you how to make a floating window manager for Safari.
Project Vacuum
The La Jolla Underground has announced the immediate availability of
Project Vacuum 1.0.
Project Vacuum is designed to work with the REALbasic IDE to merge all external code items
into a single project file. It will merge all external classes, modules and windows into the
main project and save the resulting file as xml. This file may then be used with other
utilities (for instance the Pulp profiling tool)
or transfered to other individuals. At this time, only external code items are merged
into the project - other external items, like AppleScripts, images and resource files,
will not be added to the project.
cPictureButton 1.1
Scott Crick has updated his
cPictureButton class to
Version 1.1. cPictureButton is a canvas-based control that allows developers to create
button controls with complex appearances and shapes. While these buttons are
not Appearance Manager compliant, they do allow the developer to break with
the rectangle-based buttons currently available. All the developer has to do
is supply a picture that is how the button is supposed to look in its
various states tand a mask of the button's shape and the class does the
rest. It's easy to create buttons that are round, polygons or even more
wildly shaped!
Assorted Goodies
Seth Willits has been hard at work. He has two offerings for REALbasic developers:
- The REAL Database Guide which has received praise from dozens of readers has been updated and revised for the new database related classes in 4.5.
- Single selection listbox - It lets you select a single cell in a listbox instead of the entire row. Implemented as a class, so you can use instances of it, or you can also set it to the super of your custom listbox subclasses.
|
