Project Goals • Improve Design Skills Zoomable Images – Interoperate with an existing library • Develop Large App in C++ • Learn a bit about digital images Project 1(and only) The App A bit about digital images • A zoomable image viewer • Images are 2D array of pixels – Display a variety of different types of images – Each pixel contains a color – Be able to zoom into portions of the image – Color given by RBG (red-green-blue) triples – Each value in triplet is an 8-bit integer (0-255) – Complete color is 24-bit – Use an existing windowing library for display • 24-bit or true color – Link A bit about digital images Different types of images • Resolution of a digital image • Images can be categorized by the means of defining the info contained within – Dimensions in pixels in x & y direction – Examples: • File Image – Pixel data stored in a file in a given format • Fractal Image – Image defined by a mathematical function • Drawing Image – Image defined by a set of drawing commands.
File Images Fractal Image • This image is a JPEG file • Defined by a mathematical function – Mandelbrot Image: • Other file formats: GIF, PNG, PPM, BMP Fractal Image Fractal Image • Why fractal? • The Mandelbrot set is actually a set of complex numbers – Displays self-similarity at different scales – Zooming on portion of image results in similar • The Mandelbrot image is the Mandelbrot image. set mapped on the complex plane. • = 1 + i � = -2 -2 i – FractInt. � = 0 - i Fractal Image Drawing Image CANVAS width=10.0 height=10.0 • The most complex mathematical image in CIRCLE radius =2 position=(0,0) the world color=blue SQUARE size=2 position=(1, -1) color=red – Amazingly simple to generate TRIANGLE size=2 position=(-2, 3) – Details in write-up. color=yellow
Redefining resolution Redefining Resolution • Use floating point coordinate system rather • Even file images can be converted to a than pixel coordinate system floating point coordinate system. – Fractal Images – coordinates correspond to the complex plane – Drawing image – coordinates correspond to the canvas coordinates. Rendering Rendering • Mapping from: – Floating point coordinate system of source image to – Integer coordinate system of 2D pixel array of display Render into 300x300 pixel array Each pixel = 10/300 = 0.0333 units in canvas space Zooming Zooming • Zooming can be accomplished during rendering – pixel array will get mapped to a rectangular portion of the image – Namely, the part of the image in which to zoom. – Paintshop Pro demo
Project Your task • Design an image viewer that will: • Questions so far? – Be able to display images of each type described • File Image • Fractal Image • Drawing Image – Be able to zoom into a portion of the image • Specification of zooming is up to you. – Make use of a simple Windowing library • Library allows for capturing of mouse events – YOU WILL BE WORKING IN TEAMS OF 2 Requirements Deliverables imageZoom -t ImageType -w # -h # filename • 5 deliverables – Design where: – File Image -t ImageType indicates the type of image to be displayed – Fractal Image -w # the width of the Window (optional) -h # height of the Window (optional) – Drawing Image + extras – Team Evaluation filename is the name of a file. The file will contain a different set of data dependent upon the type of image. – Must implement at least 1 extra. Should print error messages for invalid input (see write-up) Deliverables Deliverables • Design • File Image – Images in PPM format – design a framework for image display and – Can be text or binary zooming. – Exercise in C++ I/O – should be general enough to display and zoom – Filename is name of image file to display any of the images described – image types should conform to an interface – Can set size of window = resolution of image that you develop in your design – Zooming == cropping – Documented using UML – EXTRA: Do point sampling for zooming.
Deliverables Deliverables • Fractal Image • Drawing image – Canvas dimensions, figures to draw will be read from – Mandelbrot image in black and white file. – filename is the name of the file containing – EXTRAS: Render in color based on colormap dimensions/shapes in file. – NOTE: Windowing library knows how to draw shapes – filename will hold colormap (if applicable), ignored otherwise – EXTRAS: Interactive manipulation (add, delete, move) of shapes Deliverables Deliverables • Team Evaluation • Due Dates (subject to change) – Grade yourself & your partner – Design – March 28 th – File Image – April 18 th – Fractal Image – May 2 nd – Drawing Image + extras – May 12 th – Team Evaluation – May 13 th Deliverables Questions? • Grading • Project writeup should be up by Friday. – Design – 20 points – File Image – 20 points – Fractal Image – 20 points – Drawing Image – 20 points – extras – 20 points – Team Evaluation – +/- bonus points
Recommend
More recommend
