|
|
@@ -7,7 +7,7 @@
|
|
7
|
7
|
|
|
8
|
8
|
Los arreglos de datos (*arrays*) nos facilitan guardar y trabajar con grupos de datos del mismo tipo. Los datos se guardan en espacios de memoria consecutivos a los que se puede acceder utilizando el nombre del arreglo e índices o suscritos que indican la posición en que se encuentra el dato. Las estructuras de repetición nos proveen una manera simple de acceder a los datos de un arreglo. En la experiencia de laboratorio de hoy diseñarás e implementarás algoritmos simples de procesamiento de imágenes para practicar el uso de ciclos anidados en la manipulación de arreglos bi-dimensionales.
|
|
9
|
9
|
|
|
10
|
|
-##Objetivos:
|
|
|
10
|
+## Objetivos:
|
|
11
|
11
|
|
|
12
|
12
|
1. Practicar el acceder y manipular datos en un arreglo.
|
|
13
|
13
|
|
|
|
@@ -18,11 +18,11 @@ Los arreglos de datos (*arrays*) nos facilitan guardar y trabajar con grupos de
|
|
18
|
18
|
4. Acceder pixeles en una imagen y descomponerlos en sus componentes rojo, azul y verde.
|
|
19
|
19
|
|
|
20
|
20
|
|
|
21
|
|
-##Pre-Lab:
|
|
|
21
|
+## Pre-Lab:
|
|
22
|
22
|
|
|
23
|
23
|
Antes de llegar al laboratorio debes:
|
|
24
|
24
|
|
|
25
|
|
-1. Conseguir y tener disponible uno o más archivos con una imagen a color en alguno de los siguientes formatos: `tiff, jpg, png`.
|
|
|
25
|
+1. Conseguir y tener disponible uno o más archivos con una imagen a color en alguno de los siguientes formatos: `tiff`, `jpg`, `png`.
|
|
26
|
26
|
|
|
27
|
27
|
2. Haber repasado los conceptos básicos relacionados a estructuras de repetición y ciclos anidados.
|
|
28
|
28
|
|
|
|
@@ -37,11 +37,11 @@ Antes de llegar al laboratorio debes:
|
|
37
|
37
|
---
|
|
38
|
38
|
|
|
39
|
39
|
|
|
40
|
|
-##Edición de imágenes
|
|
|
40
|
+## Edición de imágenes
|
|
41
|
41
|
|
|
42
|
42
|
En esta experiencia de laboratorio, trabajarás con varios conceptos y destrezas básicas de edición de imágenes. Te proveemos un interface gráfico (GUI) simple que le permite al usuario cargar una imagen e invertirla vertical y horizontalmente. Tu tarea es crear e implementar una función para convertir una imagen a color a una imagen con tonos de gris, y otra función que convierta una imagen a color a una imagen en blanco y negro.
|
|
43
|
43
|
|
|
44
|
|
-###Píxeles
|
|
|
44
|
+### Píxeles
|
|
45
|
45
|
|
|
46
|
46
|
Al elemento más pequeño de una imagen se le llama un *píxel*. Esta unidad consiste de un solo color. Como cada color es una combinación de tonalidades de los colores primarios rojo, verde y azul, se codifica como un entero sin signo cuyos bytes representan los tonos de rojo, verde y azul del pixel (Figura 1). A esta combinación se le llama el *RGB* del color por las siglas de "Red-Green-Blue". Por ejemplo un píxel de color rojo (puro) tiene una representación RGB `0x00ff0000`, mientras que un píxel de color blanco tiene una representación RGB de `0x00FFFFFF` (ya que el color blanco es la combinación de los tonos rojo, verde y azul en toda su intensidad).
|
|
47
|
47
|
|
|
|
@@ -55,7 +55,7 @@ Al elemento más pequeño de una imagen se le llama un *píxel*. Esta unidad con
|
|
55
|
55
|
|
|
56
|
56
|
En `Qt` se utiliza el tipo `QRgb` para representar valores `RGB`. Utilizando ciertas funciones que describimos abajo podemos obtener los componentes rojo, verde y azul del valor `QRgb` del píxel y así manipular imágenes.
|
|
57
|
57
|
|
|
58
|
|
-###Biblioteca
|
|
|
58
|
+### Biblioteca
|
|
59
|
59
|
|
|
60
|
60
|
La experiencia de laboratorio de hoy utilizará la clase `QImage`. Esta clase permite acceder a los datos de los pixeles de una imagen para poder manipularla. La documentación de la clase `QImage` se encuentra en http://doc.qt.io/qt-4.8/qimage.html.
|
|
61
|
61
|
|
|
|
@@ -81,7 +81,7 @@ Las siguientes funciones son útiles para trabajar con datos de tipo `QRgb`:
|
|
81
|
81
|
* `qRgb(int red, int green, int blue)` // devuelve un píxel `QRgb` compuesto de los valores de rojo, verde y azul recibidos.
|
|
82
|
82
|
|
|
83
|
83
|
|
|
84
|
|
-####Ejemplos:
|
|
|
84
|
+#### Ejemplos:
|
|
85
|
85
|
|
|
86
|
86
|
1. `QRgb myRgb = qRgb(0xff, 0x00, 0xff);`: Asigna a `myRgb` el valor `0xff00ff` que representa el color 
|
|
87
|
87
|
|
|
|
@@ -91,15 +91,15 @@ Las siguientes funciones son útiles para trabajar con datos de tipo `QRgb`:
|
|
91
|
91
|
|
|
92
|
92
|
|
|
93
|
93
|
|
|
94
|
|
- entonces `originalImage.pixel(2,1)` devuelve un valor `rgb` que representa el color azul (`0x0000ff`).
|
|
|
94
|
+ entonces `originalImage.pixel(2,1)` devuelve un valor `rgb` que representa el color azul (`0x0000ff`).
|
|
95
|
95
|
|
|
96
|
96
|
3. La siguiente instrucción asigna el color rojo al píxel en posición `(2,3)` en la imagen editada:
|
|
97
|
97
|
|
|
98
|
|
- `editedImage.setPixel(2,3,qRgb(0xff,0x00,0x00));`.
|
|
|
98
|
+ `editedImage.setPixel(2,3,qRgb(0xff,0x00,0x00));`.
|
|
99
|
99
|
|
|
100
|
100
|
4. La siguiente instrucción le asigna a `greenContent` el valor del tono de verde que contiene el pixel `(1,1)` de `originalImage`:
|
|
101
|
101
|
|
|
102
|
|
- `int greenContent = qGreen(originalImage.pixel(1,1));`.
|
|
|
102
|
+ `int greenContent = qGreen(originalImage.pixel(1,1));`.
|
|
103
|
103
|
|
|
104
|
104
|
|
|
105
|
105
|
5. El siguiente programa crea un objeto de clase `QImage` e imprime los componentes rojo, verde y azul del pixel en el centro de la imagen. La imagen utilizada es la que se especifica dentro del paréntesis durante la creación del objeto, esto es, el archivo `chuck.png`.
|
|
|
@@ -131,10 +131,10 @@ int main() {
|
|
131
|
131
|
|
|
132
|
132
|
---
|
|
133
|
133
|
|
|
134
|
|
-!INCLUDE "../../eip-diagnostic/simple-image-editor/es/diag-simple-image-editor-01.html"
|
|
|
134
|
+!INCLUDE "../../eip-diagnostic/simple-image-editor/es/diag-simple-image-editor-01.html"
|
|
135
|
135
|
<br>
|
|
136
|
136
|
|
|
137
|
|
-!INCLUDE "../../eip-diagnostic/simple-image-editor/es/diag-simple-image-editor-02.html"
|
|
|
137
|
+!INCLUDE "../../eip-diagnostic/simple-image-editor/es/diag-simple-image-editor-02.html"
|
|
138
|
138
|
<br>
|
|
139
|
139
|
|
|
140
|
140
|
---
|
