INSTITUTO TECNOLÓGICO DE CELAYA

EXAMEN DIAGNOSTICO

VISTA 25D TABLERO DE BARCOS

Facultad: Ingeniería en Sistemas Computacionales.

Alumna: Arroyo Martínez Mayra.

Numero de Control: 21031101.

Semestre: 6to.

Profesor: Euresty Uribe Carlos Gerardo.

Materia: Graficación.

Fecha de Entrega: Celaya, Guanajuato a, 10 de Febrero del 2024.

ACTIVIDAD: EXAMEN DIAGNOSTICO
Sube un PDF con el código fuente y las coordenadas de salida específicas para las tres naves en el documento.

Vista 2.5D del tablero de barcos

Se requiere construir las fórmulas para poder colocar los barcos en una vista isométrica del tablero vacío
como se muestra en la figura 1.

Figura 1. Tablero de barcos vacío.

El tamaño aproximado de la pantalla es de 424 de ancho por 254 de alto pero existe una diferencia de 15
pixeles de la esquina superior e inferior del tablero y una distancia de la orilla izquierda y derecha de 18
pixeles.

Para el ejemplo solo existen tres tipos de barcos para colocar en el tablero, el barco 1 tiene unas dimensiones
de 78x49 pixeles, el barco 2 ocupa 81x40 pixeles y el barco 3 110x72 pixeles.

Barco 1
Para el barco 1 sus especificaciones son:
Dimensiones: 78x49 pixeles
Orientación: horizontal
Número de casilla que ocupa: 3
Coordenadas XY: J 8
 Barco 2

Para el barco 2 sus especificaciones son:

Dimensiones: 81x40 pixeles
Orientación: horizontal
Número de casilla que ocupa: 3
Coordenadas XY: B 4

Barco 3
Para el barco 3 sus especificaciones son:
Dimensiones: 110x72 pixeles
Orientación: horizontal
Número de casilla que ocupa: 4
Coordenadas XY: F 5

A continuación, se ve la pantalla con algunos barcos colocados en las posiciones indicadas anteriormente y
otros tres más.

Figura 2. Tablero con algunos barcos colocados.

 CÓDIGO

import pygame

import sys

# Tamaño del tablero

tablero_ancho = 424

tablero_alto = 254

offset_superior = 15

offset_lateral = 18

casilla_tamano = 50

# Tamaño de los barcos

barco1_dimensiones = (78, 49)

barco2_dimensiones = (81, 40)

barco3_dimensiones = (110, 72)

# Coordenadas de los barcos

barco1_coordenadas = (9, 7) # J 8

barco2_coordenadas = (1, 3) # B 4

barco3_coordenadas = (5, 4) # F 5

# Función para convertir coordenadas a píxeles

def coordenadas_a_pixeles(coordenadas):

x, y = coordenadas

x_pixel = offset_lateral + x * casilla_tamano

y_pixel = offset_superior + y * casilla_tamano

return x_pixel, y_pixel

# Función para dibujar el tablero y los barcos

def dibujar_tablero_y_barcos():

pygame.init()

pantalla = pygame.display.set_mode((tablero_ancho, tablero_alto))

pygame.display.set_caption("Vista 2.5D del Tablero de Barcos")

while True:

for event in pygame.event.get():

if event.type == pygame.QUIT:

pygame.quit()

sys.exit()

# Dibujar tablero

pygame.draw.rect(pantalla, (255, 255, 255), (offset_lateral, offset_superior, tablero_ancho - 2 *

offset_lateral, tablero_alto - 2 * offset_superior))

# Dibujar barco 1

pygame.draw.rect(pantalla, (0, 0, 255), (*coordenadas_a_pixeles(barco1_coordenadas),

barco1_dimensiones[0], barco1_dimensiones[1]))

# Dibujar barco 2

pygame.draw.rect(pantalla, (0, 255, 0), (*coordenadas_a_pixeles(barco2_coordenadas),

barco2_dimensiones[0], barco2_dimensiones[1]))

# Dibujar barco 3

pygame.draw.rect(pantalla, (255, 0, 0), (*coordenadas_a_pixeles(barco3_coordenadas),

barco3_dimensiones[0], barco3_dimensiones[1]))

pygame.display.flip()

# Llamar a la función para dibujar el tablero y los barcos

dibujar_tablero_y_barcos()
Este código utiliza la biblioteca Pygame para crear una ventana y dibujar una vista 2.5D del tablero de
barcos con tres barcos de diferentes dimensiones y ubicaciones. Aquí hay un resumen del código y cómo
se visualiza la salida para cada uno de los barcos:

Resumen del Código:

1. Configuración del tablero y los barcos:

• Se definen las dimensiones del tablero, los offsets (márgenes superior e izquierdo), y el tamaño de
cada casilla.
• Se especifican las dimensiones y las coordenadas de cada barco.
2. Función para convertir coordenadas a píxeles:
• La función coordenadas_a_pixeles toma las coordenadas del tablero (como (9, 7)) y las convierte
a píxeles en la ventana de Pygame, teniendo en cuenta el tamaño de las casillas y los offsets.
3. Inicialización de Pygame:
• Pygame se inicializa y se crea una ventana con el tamaño especificado.
4. Bucle principal:
• Se inicia un bucle principal que maneja los eventos de Pygame.
• Si se detecta un evento de cierre de ventana (QUIT), el programa se cierra adecuadamente.
5. Dibujar el tablero:
• Se dibuja un rectángulo blanco para representar el tablero en la ventana, teniendo en cuenta los
offsets.
6. Dibujar los barcos:
• Se dibujan tres rectángulos de colores diferentes para representar los tres barcos en las posiciones
especificadas por las coordenadas y dimensiones.
7. Actualizar la pantalla:
• Se utiliza pygame.display.flip() para actualizar la pantalla y mostrar los cambios.
8. Bucle continuo:
• El bucle principal continúa ejecutándose, lo que permite que la ventana permanezca abierta y se
actualice según sea necesario.
Salida del Programa:

Barco 1 (Azul):

• Dimensiones: 78x49 píxeles.

• Orientación: Horizontal.
• Número de casillas que ocupa: 3.
• Coordenadas XY: J 8.

Barco 2 (Verde):

• Dimensiones: 81x40 píxeles.

• Orientación: Horizontal.
• Número de casillas que ocupa: 3.
• Coordenadas XY: B 4.

Barco 3 (Rojo):

• Dimensiones: 110x72 píxeles.

• Orientación: Horizontal.
• Número de casillas que ocupa: 4.
• Coordenadas XY: F 5.

Los barcos se representan como rectángulos coloreados en la ventana de Pygame, y puedes visualizar su
posición y orientación en relación con el tablero. Cada vez que ejecutas el programa, verás la vista 2.5D
del tablero con los tres barcos dibujados en las posiciones y dimensiones especificadas.
 CONCLUSIÓN

En mi experiencia con este código, he observado que proporciona una representación visual clara y
efectiva de un tablero de barcos en una vista 2.5D. La implementación en Pygame facilita la comprensión
de la disposición de los barcos en el tablero, así como sus dimensiones y orientaciones.

La configuración inicial del tablero y la conversión de coordenadas a píxeles son conceptos clave que
contribuyen al funcionamiento adecuado del programa. La capacidad de dibujar el tablero y los barcos de
manera dinámica, permitiendo actualizaciones continuas de la pantalla, proporciona una experiencia
interactiva.

La salida del programa, con los barcos representados por rectángulos de colores y acompañados de
información detallada, facilita la identificación y seguimiento de cada uno. Los comentarios descriptivos
en el código son útiles para comprender rápidamente la funcionalidad de cada sección.

En general, este código es una herramienta efectiva para visualizar la disposición de barcos en un tablero,
y su estructura modular facilita la comprensión y posible extensión para futuros desarrollos.