|
|
|
|
5
|
![main2.png](images/main2.png)
|
5
|
![main2.png](images/main2.png)
|
6
|
![main3.png](images/main3.png)
|
6
|
![main3.png](images/main3.png)
|
7
|
|
7
|
|
8
|
-[Verano 2016 - Ive]
|
|
|
|
|
8
|
+[Verano 2016 - Ive- Tatiana]
|
9
|
|
9
|
|
10
|
Arrays help us to store and work with groups of data of the same type. The data is stored in consecutive memory spaces which can be accessed by using the name of the array and indexes or subscripts that indicate the position where the data is stored. Repetition structures provide us a simple way of accessing the data within an array. In this laboratory experience, you will be using nested loops to process bi-dimensional arrays and implement the functionality of a green-screen.
|
10
|
Arrays help us to store and work with groups of data of the same type. The data is stored in consecutive memory spaces which can be accessed by using the name of the array and indexes or subscripts that indicate the position where the data is stored. Repetition structures provide us a simple way of accessing the data within an array. In this laboratory experience, you will be using nested loops to process bi-dimensional arrays and implement the functionality of a green-screen.
|
11
|
|
11
|
|
|
|
|
|
41
|
|
41
|
|
42
|
## Green-screen technology
|
42
|
## Green-screen technology
|
43
|
|
43
|
|
44
|
-In this laboratory experience the student will be exposed to the basics of the green screen technology used in newscasting, motion pictures, video games, and others. Green screen compositing, or more generally chroma key compositing, is a technique for combining two still images or video frames[1]. Chroma key compositing, or chroma keying, is a special effects / post-production technique for compositing (layering) two images or video streams together based on color hues (range)[2]. Chroma keying can be done with backgrounds of any color that are uniform and distinct, but green and blue backgrounds are more commonly used because they differ most distinctly in hue from most human skin colors.
|
|
|
|
|
44
|
+In this laboratory experience, the student will be exposed to the basics of the green screen technology used in newscasting, motion pictures, video games, and others. Green screen compositing, or more generally known as chroma key compositing, is a technique for combining two still images or video frames[1]. Chroma key compositing, or chroma keying, is a special effects / post-production technique for compositing (layering) two images or video streams together based on color hues (range)[2]. Chroma keying can be done with backgrounds of any color that are uniform and distinct, but green and blue backgrounds are more commonly used because they differ most distinctly in hue from most human skin colors.
|
45
|
|
45
|
|
46
|
-With this laboratory we provide a simple GUI that allows the user to load an image with any solid background (although green or blue are preferred), and a background image. Your task is to implement a function that creates a third, merged image, in which the image with the solid background appears over the background image (with the solid background removed). Figure 1 shows an example of the expected results.
|
|
|
|
|
46
|
+In this laboratory, we provide a simple GUI that allows the user to load an image with any solid background (although green or blue are preferred), and a background image. Your task is to implement a function that creates a third, merged image, in which the image with the solid background appears over the background image (with the solid background removed). Figure 1 shows an example of the expected results.
|
47
|
|
47
|
|
48
|
---
|
48
|
---
|
49
|
|
49
|
|
|
|
|
|
84
|
|
84
|
|
85
|
###Library
|
85
|
###Library
|
86
|
|
86
|
|
87
|
-In today's laboratory experience you will use the `QImage` class. This class permits access to the data in the pixels of an image to manipulate it. The documentation for the `QImage` class can be found in http://doc.qt.io/qt-4.8/qimage.html.
|
|
|
|
|
87
|
+In today's laboratory experience, you will use the `QImage` class. This class permits access to the data in the pixels of an image to manipulate it. The documentation for the `QImage` class can be found in http://doc.qt.io/qt-4.8/qimage.html.
|
88
|
|
88
|
|
89
|
The code provided in this project contains the following objects of the `QImage` class:
|
89
|
The code provided in this project contains the following objects of the `QImage` class:
|
90
|
|
90
|
|
91
|
* `originalImage` // contains the information of the original image that you will edit
|
91
|
* `originalImage` // contains the information of the original image that you will edit
|
92
|
-* `editedImage` // will contain the edited image
|
|
|
|
|
92
|
+* `editedImage` // will contain the edited image
|
93
|
|
93
|
|
94
|
The objects of the `QImage` class have the following methods that will be useful for today's laboratory experience:
|
94
|
The objects of the `QImage` class have the following methods that will be useful for today's laboratory experience:
|
95
|
|
95
|
|
|
|
|
|
206
|
* objectImage: reference to the object image with the solid background
|
206
|
* objectImage: reference to the object image with the solid background
|
207
|
* backgroundImage: reference to the background image object
|
207
|
* backgroundImage: reference to the background image object
|
208
|
* mergedImage: reference to the merged image
|
208
|
* mergedImage: reference to the merged image
|
209
|
-* threshold: is a theshold value used to compare the distances between the object pixel and the solid background pixel. In the provided code, the threshold value is read from the slideBar.
|
|
|
|
|
209
|
+* threshold: is a threshold value used to compare the distances between the object pixel and the solid background pixel. In the provided code, the threshold value is read from the slideBar.
|
210
|
* ghost: is a boolean value used to apply ghost filter to pixels.
|
210
|
* ghost: is a boolean value used to apply ghost filter to pixels.
|
211
|
* (x, y): contains the coordinate of the pixel whose color will be used as solid background. The default value is (0,0).
|
211
|
* (x, y): contains the coordinate of the pixel whose color will be used as solid background. The default value is (0,0).
|
212
|
* (offset_x, offset_y): the coordinate of the merged image where the upper-left corner of the objectImage should be inserted. The default value is (0,0).
|
212
|
* (offset_x, offset_y): the coordinate of the merged image where the upper-left corner of the objectImage should be inserted. The default value is (0,0).
|
|
|
|
|
234
|
|
234
|
|
235
|
4. Your first task is to complete the function `MergeImages` in file `Filter.cpp`.`MergeImages` is the function that is called when the user presses the button captioned `Merge Images` or when he slides the slide bar. The function `MergeImages` receives the image with the solid background, the background image, a reference to the merged image, a threshold value, and the coordinates `(x,y)` of the pixel from which we will extract the sample *green* background color, and the coordinates `(offset_x, offset_y)` from the merged image.
|
235
|
4. Your first task is to complete the function `MergeImages` in file `Filter.cpp`.`MergeImages` is the function that is called when the user presses the button captioned `Merge Images` or when he slides the slide bar. The function `MergeImages` receives the image with the solid background, the background image, a reference to the merged image, a threshold value, and the coordinates `(x,y)` of the pixel from which we will extract the sample *green* background color, and the coordinates `(offset_x, offset_y)` from the merged image.
|
236
|
|
236
|
|
237
|
-For this first exercise you can ignore the following parameters: ghost, x_offset, y_offset. Your implementation should place the `objectImage` into the `mergedImage` starting at position (0,0).
|
|
|
|
|
237
|
+For this first exercise you can ignore the following parameters: ghost, offset_x, offset_y. Your implementation should place the `objectImage` into the `mergedImage` starting at position (0,0).
|
238
|
|
238
|
|
239
|
**The algorithm**
|
239
|
**The algorithm**
|
240
|
|
240
|
|
|
|
|
|
276
|
![figure8.png](images/figure8.png)
|
276
|
![figure8.png](images/figure8.png)
|
277
|
|
277
|
|
278
|
|
278
|
|
279
|
-**Figure 7.** In this example, the background image has not been clicked. Thus the "Selected Coord" is at its default value of (0,0). The dog image is inserted with its top-left corner at (0,0) in the merged image.
|
|
|
|
|
279
|
+**Figure 7.** In this example, the background image has not been clicked. Thus the "Selected Coord" is at its default value of (0,0). The dog image is inserted with its top-left corner at (0,0) in the merged image.
|
280
|
|
280
|
|
281
|
---
|
281
|
---
|
282
|
|
282
|
|
|
|
|
|
288
|
---
|
288
|
---
|
289
|
|
289
|
|
290
|
|
290
|
|
291
|
-In this exercise your task will be the same as in Exercise 1, but this time you will need to offset the *object* image inside the *merged* image by the amount specified in the `x_offset` and `y_offset` parameters. Please take into consideration the merged image boundaries when you are inserting the object image. The user may specify an offset where the boundaries are exceeded and the object will be cut, as in Figure 9.
|
|
|
|
|
291
|
+In this exercise your task will be the same as in Exercise 1, but this time you will need to offset the *object* image inside the *merged* image by the amount specified in the `offset_x` and `offset_y` parameters. Please take into consideration the merged image boundaries when you are inserting the object image. The user may specify an offset where the boundaries are exceeded and the object will be cut, as in Figure 9.
|
292
|
|
292
|
|
293
|
---
|
293
|
---
|
294
|
|
294
|
|
295
|
![figure10.png](images/figure10.png)
|
295
|
![figure10.png](images/figure10.png)
|
296
|
|
296
|
|
297
|
-**Figure 9**. In this example, the user selected a position that assigned values that are too large for `x_offset` and `y_offset`; the implementation made the adjustment so part of the dog appeared in the merged image.
|
|
|
|
|
297
|
+**Figure 9**. In this example, the user selected a position that assigned values that are too large for `offset_x` and `offset_y`; the implementation made the adjustment so part of the dog appeared in the merged image.
|
298
|
|
298
|
|
299
|
---
|
299
|
---
|
300
|
|
300
|
|
301
|
-The example in Figure 10 shows how the object image will behave when merging it with the background image. The `x_offset` and `y_offset` variables represent the point in the background image where the upper left corner of the object image will be placed. Notice that if a point too close to the image border is chosen, part of the object image will be outside of the limits of the background image. As we have seen when manipulating arrays, if one tries to access or alter elements that are outside of the size range of the array, we get a fatal compilation error. The same thing happens with the images.
|
|
|
|
|
301
|
+The example in Figure 10 shows how the object image will behave when merging it with the background image. The `offset_x` and `offset_y` variables represent the point in the background image where the upper left corner of the object image will be placed. Notice that if a point too close to the image border is chosen, part of the object image will be outside of the limits of the background image. As we have seen when manipulating arrays, if one tries to access or alter elements that are outside of the size range of the array, we get a fatal compilation error. The same thing happens with the images.
|
302
|
|
302
|
|
303
|
-You should make sure that your implementation takes into account the `x_offset` and `y_offset` values so the composition does not try to access or alter pixels outside of the limits of the background image. If you try to access or alter pixels outside of these limits, it will result in a fatal error.
|
|
|
|
|
303
|
+You should make sure that your implementation takes into account the `offset_x` and `offset_y` values so the composition does not try to access or alter pixels outside of the limits of the background image. If you try to access or alter pixels outside of these limits, it will result in a fatal error.
|
304
|
|
304
|
|
305
|
---
|
305
|
---
|
306
|
|
306
|
|
|
|
|
|
335
|
|
335
|
|
336
|
[3] http://doc.qt.io/qt-4.8/qimage.html
|
336
|
[3] http://doc.qt.io/qt-4.8/qimage.html
|
337
|
|
337
|
|
|
|
338
|
+
|
|
|
339
|
+
|