1.1 Manipulating Images: "image.ss"
The teachpack provides primitives for constructing and manipulating
images. Basic, colored images are created as outlines or solid
shapes. Additional primitives allow for the composition of images.
1.1.1 Images
Is x an image?
Are x and
y the same image?
1.1.2 Modes and Colors
Mode (one-of/c 'solid 'outline "solid" "outline")
A Mode is used to specify whether painting a shape fills or
outlines the form.
RGB color?
A RGB describes a color via a shade of red, blue, and green colors
(e.g., (make-color 100 200 30)).
Color (or/c symbol? string? color?)
A Color is a color-symbol (e.g., 'blue) or a color-string
(e.g., "blue") or an RGB structure.
Determines if the input is a
valid image
Color.
1.1.3 Creating Basic Shapes
In DrRacket, you can insert images from your file system. Use PNG images
instead whenever possible for insertions. In addition, you can create basic
shapes with the following functions.
Creates a w by h rectangle, filled in according to
m and painted in color c
Creates a circle or disk of radius r, filled in according to
m and painted in color c
Creates a w by h ellipse, filled in according to
m and painted in color c
Creates an upward pointing equilateral
triangle whose side is s pixels long, filled in according to
m and painted in color c
Creates a multi-pointed star with n points, an outer
radius for the max distance of the points to the center, and
an inner radius for the min distance to the center.
Creates a regular polygon with s sides inscribed in
a circle of radius r, using mode m and
color c. If an angle is specified, the polygon is rotated by that
angle.
Creates a line colored
c from (0,0) to
(x ,y).
See
add-line below.
Creates an image of the text s at point size f
and painted in color c.
1.1.4 Basic Image Properties
To understand how images are manipulated, you need to understand the
basic properties of images.
Obtain i’s width in pixels
Obtain i’s height in pixels
For the composition of images, you must know about pinholes. Each
image, including primitive ones, come with a pinhole. For images created
with the above primitives, the pinhole is at the center of the shape except
for those created from line and text.
The text function puts the pinhole at the upper left corner of
the image, and line puts the pinhole at the beginning of the line
(meaning that if the first two arguments to line are positive,
the pinhole is also in the upper left corner).
The pinhole can be moved, of course, and compositions
locate pinholes according to their own rules. When in doubt you can always
find out where the pinhole is and place it where convenient.
Determines the x
coordinate of the pinhole, measuring from the left of the image.
Determines the y
coordinate of the pinhole, measuring from the top (down) of the image.
Creates a new image with the pinhole in the location specified by
x and y, counting from the left and top (down),
respectively.
Creates a new image with the pinhole moved down and right by
delta-x and delta-y with respect to its current
location. Use negative numbers to move it up or left.
1.1.5 Composing Images
Images can be composed, and images can be found within compositions.
Creates an image by adding a line (colored c) from
(x1,y1) to
(x2,y2)
to image i.
Creates an image by overlaying all images on their pinholes.
The pinhole of the resulting image is the same place as the pinhole in the
first image.
Creates an image by adding the pixels of other to
img.
Instead of lining the two images up on their pinholes,
other’s pinhole is lined up on the point:
The pinhole of the resulting image is the same
place as the pinhole in the first image.
Determines whether the pixels of the second image appear in the first.
Be careful when using this function with jpeg images. If you use an
image-editing program to crop a jpeg image and then save it,
image-inside? does not recognize the cropped image, due to
standard compression applied to JPEG images.
Determines where the pixels of the second image appear in the first, with
respect to the pinhole of the first image. If
(image-inside? img other) isn’t true,
find-image signals an error.
1.1.6 Manipulating Images
Images can also be shrunk. These “shrink” functions trim an image by
eliminating extraneous pixels.
Shrinks the image to a width by height image, starting
from the top-left corner. The pinhole of the resulting image is in
the center of the image.
Shrinks the image to a width by height image, starting
from the top-right corner. The pinhole of the resulting image is in
the center of the image.
Shrinks the image to a width by height image, starting
from the bottom-left corner. The pinhole of the resulting image is in
the center of the image.
Shrinks the image to a width by height image, starting
from the bottom-right corner. The pinhole of the resulting image is in
the center of the image.
Shrinks an image around its pinhole. The numbers are the pixels to save to
left, above, to the right, and below the pinhole, respectively. The pixel
directly on the pinhole is always saved.
1.1.7 Scenes
A scene is an image, but with the pinhole in the upper-left corner, i.e.
an image where pinhole-x and pinhole-y both return
0.
Scenes are particularly useful with the
2htdp/universe
and
htdp/world
teachpacks, since it displays only scenes in its canvas.
Is x an scene?
creates a plain white,
width x
height scene.
creates a scene by placing img at
(x, y) into s;
(x, y) are computer graphics coordinates,
i.e., they count right and down from the upper-left corner.
creates a width by height rectangle, solid or outlined as specified by
solid-or-outline and colored according to c, with a pinhole at the upper left
corner.
creates a scene by placing a line of color
c from
(
x0, y0)
to
(
x1,
y1)
using computer graphics coordinates. In contrast to
the
add-line function,
scene+line cuts off those
portions of the line that go beyond the boundaries of the given
s.
1.1.8 Miscellaneous Image Manipulation and Creation
The last group of functions extracts the constituent colors from an image
and converts a list of colors into an image.
is one of:
| ; – empty |
| ; – (cons Color List-of-color) |
| ; Interpretation: represents a list of colors. |
Converts an image to a list of colors.
Converts a list of colors l to an image with the given
width and height and pinhole (x,y)
coordinates, specified with respect to the top-left of the image.
The remaining functions provide alpha-channel information as well. Alpha
channels are a measure of transparency; 0 indicates fully opaque and 255
indicates fully transparent.
A structure representing an alpha color.
to convert an image to a list of alpha colors
Converts a list of alpha-colors l to an image with the given
width and height and pinhole (x,y)
coordinates, specified with respect to the top-left of the image.