COMP 110-001 - Introduction to Programming (Spring 2009)

Program 5: Picture

100 points

Assigned: Monday, April 6th

Milestone 1 Due: Wednesday, April 15th at 5pm

Final Submission Due: Monday, April 27th at 5pm

Problem Description and Background

For this assignment, you will be creating a class to hold data that respresents an image. You will also be writing several methods to manipulate that data, called transformations. These transformations include cropping, scaling, mirroring, and translating the image.

You may recall that an image can be represented as a 2D array of data points that each hold a value corresponding to brightness/color. Each of these data points is referred to as a pixel. For the standard color images used in this assignment, each pixel consists of a single integer.

In the coordinate-space of the image, the pixel at location (0,0) is at the top left corner of the image. The pixel at location (width-1, height-1) is at the bottom right of the image, as shown in the 400x300 image on the right.

I have provided PictureDisplay.java to aid in testing your implementation. Download the java file to your COMP110 directory in JGrasp to get started. When you have filled out the methods below, you can show the GUI by compiling and running PictureDisplay.java.

The PictureDisplay class will try to access a file called "sample.jpg" in your COMP110 directory. So, place the image you want to work with into that folder and name it appropriately. Here are some sample images: sample.jpg, sample2.jpg, sample3.jpg, sample4.jpg, mousemri.jpg.

Implementation

Design and create a class called Picture that will aid PictureDisplay.java in displaying an image. Your Picture class must have the following public methods:

Picture(int width, int height): constructor that creates a new Picture with the specified width and height. Each pixel's initial value is set to 0 (black).
int getWidth(): returns the width of the image as an integer
int getHeight(): returns the height of the image as an integer
boolean contains(int x, int y): checks whether or not the pixel location (x,y) is within the image
void setPixel(int x, int y, int value): sets the value of the pixel at location (x,y) to the value passed in if the pixel location is inside the image
int getPixel(int x, int y): returns the value of the pixel at location (x,y) or -1 if the pixel location is outside of the image
void swapPixels(int x1, int y1, int x2, int y2): swaps the values of the pixel at (x1,y1) and the pixel at (x2,y2) *only if* both pixel locations are within the image
Transformations:
- void crop(int xloc, int yloc, int width, int height): removes any data outside of the rectangle starting at (xloc,yloc) with the given width and height
- void translate(int xdiff, int ydiff): shifts the image xdiff units to the right (left if negative) and ydiff units down (up if negative). The empty areas are filled with pixel value 0.
- void flipVertical(): flips the image vertically.
- void flipHorizontal(): flips the image horizontally.
- void scaleUp(): enlarges the image to twice its current size.
- void scaleDown(): shrinks the image to half its current size.

Transformation Details

Crop

A crop removes any data outside of a specified region, in our case a rectangle, and leaves the remaining data intact. After your code is written, this functionality can be tested in the GUI by right clicking and dragging a rectangle on the image (or alt-clicking on a mac). Keep in mind that the data outside of the rectangle will be lost forever (this will be considered normal behavior):

(0,0)	(1,0)	(2,0)	(3,0)
(0,1)	(1,1)	(2,1)	(3,1)
(0,2)	(1,2)	(2,2)	(3,2)
(0,3)	(1,3)	(2,3)	(3,3)

4x4 Image

-> Crop with parameters x=1, y=1, width=2, height=3 ->

(0,0)	(1,0)
(0,1)	(1,1)
(0,2)	(1,2)

2x3 Image

Original	Creating a rectangle to crop
Cropped

Translation

A translation moves an image left, right, up, or down. This is essentially shifting the contents of your array. After your code is written, this functionality can be tested in the GUI by dragging the image. Keep in mind that when a portion of the image is translated offscreen and back, some data will be lost (this will be considered normal behavior):

(0,0)	(1,0)	(2,0)	(3,0)
(0,1)	(1,1)	(2,1)	(3,1)
(0,2)	(1,2)	(2,2)	(3,2)
(0,3)	(1,3)	(2,3)	(3,3)

4x4 Image

-> Translated up two and right one pixel ->

(0,0)	(1,0)	(2,0)	(3,0)
(0,1)	(1,1)	(2,1)	(3,1)
(0,2)	(1,2)	(2,2)	(3,2)
(0,3)	(1,3)	(2,3)	(3,3)

4x4 Image

Original	Translated Up and Right
Translated Back to Original Location (data loss)

Mirror

A mirror flips an image vertically or horizontally. This is swapping the contents at one location in your array for another. After your code is written, this functionality can be tested in the GUI by clicking the "Flip Horizontally" and "Flip Vertically" buttons.

(0,0)	(1,0)	(2,0)	(3,0)
(0,1)	(1,1)	(2,1)	(3,1)
(0,2)	(1,2)	(2,2)	(3,2)
(0,3)	(1,3)	(2,3)	(3,3)

4x4 Image

-> Mirrored Horizontally ->

(0,0)	(1,0)	(2,0)	(3,0)
(0,1)	(1,1)	(2,1)	(3,1)
(0,2)	(1,2)	(2,2)	(3,2)
(0,3)	(1,3)	(2,3)	(3,3)

4x4 Image

Original	Horizontal Flip
Vertical Flip	Both Flipped

Scale

A scale changes the size of an image. We will be only performing scales by powers of two. For this assignment, when an image is scaled up by 2x, the width and height of the image are doubled, and each original pixel becomes a new 2x2 pixel square:

(0,0)	(1,0)
(0,1)	(1,1)

2x2 Image

-> Scaled up by two ->

(0,0)	(1,0)	(2,0)	(3,0)
(0,1)	(1,1)	(2,1)	(3,1)
(0,2)	(1,2)	(2,2)	(3,2)
(0,3)	(1,3)	(2,3)	(3,3)

4x4 Image

Original

Scale Up

When an image is scaled down by 2x, the width and height of the image are halved, and the new image converts each distinct 2x2 square in the original image to a single pixel. For this assignment, we will take the value in the top left corner of that square to be our new value and discard the rest. (Note that "discarding" is not a step that needs to be performed, it is only shown here to help illustrate the idea.)

(0,0)	(1,0)	(2,0)	(3,0)
(0,1)	(1,1)	(2,1)	(3,1)
(0,2)	(1,2)	(2,2)	(3,2)
(0,3)	(1,3)	(2,3)	(3,3)

4x4 Image

-> Discard certain pixels ->

(0,0)	(1,0)	(2,0)	(3,0)
(0,1)	(1,1)	(2,1)	(3,1)
(0,2)	(1,2)	(2,2)	(3,2)
(0,3)	(1,3)	(2,3)	(3,3)

4x4 Image

-> Scaled down by two ->

(0,0)	(1,0)
(0,1)	(1,1)

2x2 Image

Original

Scale Down

Keep in mind that scaling an image down will result in a loss of data (this is normal behavior). As a result, scaling an image down and back up will produce a different, blockier image:

(0,0)	(1,0)	(2,0)	(3,0)
(0,1)	(1,1)	(2,1)	(3,1)
(0,2)	(1,2)	(2,2)	(3,2)
(0,3)	(1,3)	(2,3)	(3,3)

4x4 Image

-> Scale Down ->

(0,0)	(1,0)
(0,1)	(1,1)

2x2 Image

-> Scale Up ->

(0,0)	(1,0)	(2,0)	(3,0)
(0,1)	(1,1)	(2,1)	(3,1)
(0,2)	(1,2)	(2,2)	(3,2)
(0,3)	(1,3)	(2,3)	(3,3)

4x4 Image

Original

Scaled Down then Up

Additional Notes

For some of these methods, you may wish to create a new array of pixels to hold your data, then replace the original with the new array.
None of these methods really need to be much longer than about 8-10 lines of code. At least two of the transformations can be done in 3 lines.
Assuming you use a 2D array, you will likely need to use nested for loops.
If there is no "sample.jpg" file available, the PictureDisplay class will try to access the web to select an image online. If you are not connected to the internet, the program will simply ask you which file you want.
Sample images 2 and 3 are great for testing your mirroring transformations. Sample image 4 is excellent for testing O RLY?
You may include as many additional private methods as you need.
Include all methods with proper signatures regardless of whether or not you complete them so that the grading program will compile.

Milestones

Milestone 1:
Due: Wednesday, April 15th, 5pm
You must create a Picture.java file that correctly implements the following methods:
getWidth(), getHeight(), contains(), setPixel(), getPixel(), swapPixels(), crop(), and the constructor
You must also include stub methods (methods with proper signatures but empty bodies) for all of the other transformations; these methods may be partially filled out if you have gotten started on them (but must compile!).
Milestone 2 (final submission):
Due: Monday, April 27th, 5pm
You must create a Picture.java file that correctly implements all of the methods and transformations.

Submission

1. Log into Blackboard and go to the appropriate submission page:

Program 5 Milestone 1 for the first submission (Apr 15)
Program 5 Final Submission for the final submission (Apr 27).

2. Click "Browse..." and select "Picture.java" for upload. Do not hit submit yet.
3. Click "Add Another File" once. All files should show up as "Currently Attached Files" now.
4. In the comments section, let me know many hours you spent on this assignment (to the half hour).
5. Click the "Submit" button.

Grading

If your java file does not compile or is submitted/named improperly, your maximum score is 10.
If your file causes the grading program not to compile due to incorrect method signatures, your max grade is 10.
If your file lacks a properly edited Program Header, your maximum score is 90.

10% Program Header edited correctly
15% constructor, getWidth(), getHeight(), and contains()
15% setPixel(), getPixel(), and swapPixels()
10% Crop functionality
10% Translate functionality
10% Flip Horizontal functionality
10% Flip Vertical functionality
10% Scale Up functionality
10% Scale Down functionality