|
|
|
|
123
|
|---|----|----|
|
123
|
|---|----|----|
|
124
|
| ![](images/rowMajor01-small.png) | ![](images/rowMajor02-small.png) | ![](images/rowMajor03-small.png)|
|
124
|
| ![](images/rowMajor01-small.png) | ![](images/rowMajor02-small.png) | ![](images/rowMajor03-small.png)|
|
125
|
|
125
|
|
126
|
-**Figura 2** - (a) Un dibujo con trasfondo blanco y puntos rojos. (b) Cuando el usuario marca el botón de línea horizontal (`RowMajorFill`) y marca la celda mostrada, (c) se dibuja una línea horizontal que se expande hacia la izquierda y hacia la derecha de la celda marcada, hasta que se encuantra una celda con un color diferente al color de trasfondo.
|
|
|
|
|
126
|
+**Figura 2.** (a) Un dibujo con trasfondo blanco y puntos rojos. (b) Cuando el usuario marca el botón de línea horizontal (`RowMajorFill`) y marca la celda mostrada, (c) se dibuja una línea horizontal que se expande hacia la izquierda y hacia la derecha de la celda marcada, hasta que se encuantra una celda con un color diferente al color de trasfondo.
|
127
|
|
127
|
|
128
|
|
128
|
|
129
|
##### `ColMajorFill`
|
129
|
##### `ColMajorFill`
|
|
|
|
|
136
|
|---|----|----|
|
136
|
|---|----|----|
|
137
|
| ![](images/colMajor01-small.png) | ![](images/colMajor02-small.png) | ![](images/colMajor03-small.png)|
|
137
|
| ![](images/colMajor01-small.png) | ![](images/colMajor02-small.png) | ![](images/colMajor03-small.png)|
|
138
|
|
138
|
|
139
|
-**Figura 3** - (a) Un dibujo con trasfondo blanco y puntos rojos. (b) Cuando el usuario marca el botón de línea vertical (`ColMajorFill`) y marca la celda mostrada, (c) se dibuja una línea vertical que se expande hacia arriba y hacia abajo de la celda marcada, hasta que se encuantra una celda con un color diferente al color de trasfondo.
|
|
|
|
|
139
|
+**Figura 3.** (a) Un dibujo con trasfondo blanco y puntos rojos. (b) Cuando el usuario marca el botón de línea vertical (`ColMajorFill`) y marca la celda mostrada, (c) se dibuja una línea vertical que se expande hacia arriba y hacia abajo de la celda marcada, hasta que se encuantra una celda con un color diferente al color de trasfondo.
|
140
|
|
140
|
|
141
|
|
141
|
|
142
|
|
142
|
|
|
|
|
|
150
|
|---|----|----|
|
150
|
|---|----|----|
|
151
|
| ![](images/diagLeft00-small.png) | ![](images/diagLeft01-small.png) | ![](images/diagLeft02-small.png)|
|
151
|
| ![](images/diagLeft00-small.png) | ![](images/diagLeft01-small.png) | ![](images/diagLeft02-small.png)|
|
152
|
|
152
|
|
153
|
-**Figura 4** - (a) Un dibujo con trasfondo blanco y puntos rojos. (b) Cuando el usuario marca el botón de línea diagonal izquierda (`DiagonalLeft`) y marca la celda mostrada, (c) se dibuja una línea diagonal izquierda que se expande hacia arriba a la izquierda y hacia abajo a la derecha de la celda marcada, hasta que se encuantra una celda con un color diferente al color de trasfondo.
|
|
|
|
|
153
|
+**Figura 4.** (a) Un dibujo con trasfondo blanco y puntos rojos. (b) Cuando el usuario marca el botón de línea diagonal izquierda (`DiagonalLeft`) y marca la celda mostrada, (c) se dibuja una línea diagonal izquierda que se expande hacia arriba a la izquierda y hacia abajo a la derecha de la celda marcada, hasta que se encuantra una celda con un color diferente al color de trasfondo.
|
154
|
|
154
|
|
155
|
|
155
|
|
156
|
|
156
|
|
|
|
|
|
165
|
| ![](images/diagLeft00-small.png) | ![](images/diagLeft01-small.png) | ![](images/diagRight02-small.png)|
|
165
|
| ![](images/diagLeft00-small.png) | ![](images/diagLeft01-small.png) | ![](images/diagRight02-small.png)|
|
166
|
|
166
|
|
167
|
|
167
|
|
168
|
-**Figura 5** - (a) Un dibujo con trasfondo blanco y puntos rojos. (b) Cuando el usuario marca el botón de línea diagonal derecha (`DiagonalRight`) y marca la celda mostrada, (c) se dibuja una línea diagonal derecha que se expande hacia arriba a la derecha y hacia abajo a la izquierda de la celda marcada, hasta que se encuentra una celda con un color diferente al color de trasfondo.
|
|
|
|
|
168
|
+**Figura 5.** (a) Un dibujo con trasfondo blanco y puntos rojos. (b) Cuando el usuario marca el botón de línea diagonal derecha (`DiagonalRight`) y marca la celda mostrada, (c) se dibuja una línea diagonal derecha que se expande hacia arriba a la derecha y hacia abajo a la izquierda de la celda marcada, hasta que se encuentra una celda con un color diferente al color de trasfondo.
|
169
|
|
169
|
|
170
|
|
170
|
|
171
|
### Ejercicio 2 - Implementar las funciones para hacer funcionar los botones de dibujar cuadrados, triángulos y círculos.
|
171
|
### Ejercicio 2 - Implementar las funciones para hacer funcionar los botones de dibujar cuadrados, triángulos y círculos.
|
|
|
|
|
182
|
|
182
|
|
183
|
![](images/squares.png)
|
183
|
![](images/squares.png)
|
184
|
|
184
|
|
185
|
-**Figura 6** - Cuadrados de tamaño 1 (verde), 2 (rojo), 3 (azul), y 4 (amarillo). En cada caso, el usuario marcó la celda del centro del cuadrado.
|
|
|
|
|
185
|
+**Figura 6.** Cuadrados de tamaño 1 (verde), 2 (rojo), 3 (azul), y 4 (amarillo). En cada caso, el usuario marcó la celda del centro del cuadrado.
|
186
|
|
186
|
|
187
|
|
187
|
|
188
|
#### 2b: Triángulos
|
188
|
#### 2b: Triángulos
|
|
|
|
|
193
|
![](images/triangles.png)
|
193
|
![](images/triangles.png)
|
194
|
|
194
|
|
195
|
|
195
|
|
196
|
-**Figura 7** - Triángulos de tamaño 1 (verde), 2 (rojo), 3 (azul), y 4 (amarillo). En cada caso, el usuario marcó la celda del centro de la base del triángulo.
|
|
|
|
|
196
|
+**Figura 7.** Triángulos de tamaño 1 (verde), 2 (rojo), 3 (azul), y 4 (amarillo). En cada caso, el usuario marcó la celda del centro de la base del triángulo.
|
197
|
|
197
|
|
198
|
#### 2c: Círculos
|
198
|
#### 2c: Círculos
|
199
|
|
199
|
|
|
|
|
|
202
|
|
202
|
|
203
|
![](images/circles.png)
|
203
|
![](images/circles.png)
|
204
|
|
204
|
|
205
|
-**Figura 8** - Círculos de tamaño 1 (verde), 2 (rojo), 3 (azul), y 4 (amarillo). En cada caso, el usuario marcó la celda del centro del círculo.
|
|
|
|
|
205
|
+**Figura 8.** Círculos de tamaño 1 (verde), 2 (rojo), 3 (azul), y 4 (amarillo). En cada caso, el usuario marcó la celda del centro del círculo.
|
206
|
|
206
|
|
207
|
**Ayuda para producir los círculos:**
|
207
|
**Ayuda para producir los círculos:**
|
208
|
|
208
|
|
|
|
|
|
254
|
|
254
|
|
255
|
|
255
|
|
256
|
|
256
|
|
257
|
-**Figura 9** - (a) El dibujo original con trasfondo blanco y celdas negras. (b) Se selecciona una celda y se ejecuta el algoritmo de rellenar en esa celda (1), (c) La celda se pinta anaranjada, entonces (d) invoca `relleno` en la celda de la izquierda (2). (e) La celda 2 se pinta anaranjada, entonces (f) invoca `relleno` en la celda de la izquierda (3). Esta celda no es de color-buscado (es negra), la función regresa (returns).
|
|
|
|
|
257
|
+**Figura 9.** (a) El dibujo original con trasfondo blanco y celdas negras. (b) Se selecciona una celda y se ejecuta el algoritmo de rellenar en esa celda (1), (c) La celda se pinta anaranjada, entonces (d) invoca `relleno` en la celda de la izquierda (2). (e) La celda 2 se pinta anaranjada, entonces (f) invoca `relleno` en la celda de la izquierda (3). Esta celda no es de color-buscado (es negra), la función regresa (returns).
|
258
|
(g) `relleno` se invoca en la celda de la derecha de la celda 2, pero esa celda ya está pintada del color-reemplazo. (h) `relleno` se invoca en la celda de arriba de la celda 2. (i) Esta celda se pinta anaranjada e (j) invoca `relleno` en la celda de la izquierda (4). Esta celda no es de color-buscado, por lo tanto la función regresa (k), celda (3) invoca `relleno` en su celda derecha.
|
258
|
(g) `relleno` se invoca en la celda de la derecha de la celda 2, pero esa celda ya está pintada del color-reemplazo. (h) `relleno` se invoca en la celda de arriba de la celda 2. (i) Esta celda se pinta anaranjada e (j) invoca `relleno` en la celda de la izquierda (4). Esta celda no es de color-buscado, por lo tanto la función regresa (k), celda (3) invoca `relleno` en su celda derecha.
|
259
|
|
259
|
|
260
|
Invoca la función relleno (`flood-fill`) y prueba su funcionamiento utilizando varias figuras. Asegúrate de probar figuras abiertas, como, por ejemplo, la siguiente:
|
260
|
Invoca la función relleno (`flood-fill`) y prueba su funcionamiento utilizando varias figuras. Asegúrate de probar figuras abiertas, como, por ejemplo, la siguiente:
|
|
|
|
|
269
|
|
269
|
|
270
|
## Entregas
|
270
|
## Entregas
|
271
|
|
271
|
|
272
|
-Utiliza "Entrega" en Moodle para entregar el archivo `tools.cpp` con las funciones que implementaste en esta experiencia de laboratorio. Recuerda utilizar buenas prácticas de programación, incluir el nombre de los programadores y documentar tu programa.
|
|
|
|
|
272
|
+Utiliza "Entrega" en Moodle para entregar el archivo `tools.cpp` con las funciones que implementaste en esta experiencia de laboratorio. Recuerda utilizar buenas prácticas de programación, incluye el nombre de los programadores y documenta tu programa.
|
273
|
|
273
|
|
274
|
---
|
274
|
---
|
275
|
|
275
|
|