IMAGEN A ESCALA DE GRISES EN JAVA

Summary

El video presenta un algoritmo avanzado para transformar una imagen a escala de grises o blanco y negro. Se recomienda tener conocimientos básicos de programación para seguir el tutorial. Se inicia creando un proyecto llamado 'Tratamiento de Imágenes' con una interfaz gráfica utilizando Swing o WinForms. Se explica cómo hacer que la ventana abarque todo el tamaño de la pantalla y cómo cargar una imagen desde una ruta local o una URL. Luego, se detalla cómo cambiar el tamaño de la ventana para que no sea demasiado pequeña al cambiar la imagen. El núcleo del video es la función 'Escala de Grises', que convierte una imagen a blanco y negro calculando el promedio de los canales rojo, verde y azul. El autor corrige un error al importar la clase incorrecta y finaliza la función para que la imagen se muestre correctamente en blanco y negro. El video concluye con información sobre cómo obtener el código fuente y cómo contactar al creador para más asistencia o retos relacionados con la programación.

Takeaways

• 📝 Se está creando un algoritmo para dibujar una imagen en blanco y negro o escala de grises.
• 💡 Se asume que el espectador tiene conocimientos básicos de programación y no se explicarán detalles minuciosos.
• 💻 Se utiliza un proyecto llamado 'Tratamiento de Imágenes' con una interfaz gráfica creada con Swing o WinForms.
• 🖼️ Se muestra cómo cargar una imagen a través de una ruta local o una URL en línea.
• 🔍 Se menciona la necesidad de manejar excepciones en caso de errores en la carga de la imagen.
• 🖌️ Se describe cómo cambiar el tamaño de la ventana para que ocupe toda la pantalla y cómo establecer su posición.
• 🖇️ Se indica cómo establecer el icono de la ventana con una imagen cargada.
• 🔄 Se explica cómo transformar una imagen en escala de grises, tomando en cuenta los canales rojo, verde y azul.
• 📐 Se discute la importancia de establecer el tamaño de la ventana antes de su posición para evitar problemas de visualización.
• 🛠️ Se proporciona un código que realiza la conversión de una imagen a escala de grises, incluyendo la obtención de los canales RGB y el cálculo del valor de gris.
• 📚 Se recomienda tener en cuenta conceptos previos para entender el algoritmo y se ofrece el código en la descripción del vídeo para ser copiado y utilizado en proyectos personales.

Q & A

¿Qué conocimientos básicos son necesarios para entender el algoritmo presentado en el video?

Se necesitan conocimientos básicos de programación y, específicamente, de la manipulación de imágenes en escala de grises o en blanco y negro.

¿Cómo se llama el proyecto que se va a crear en el video?

El proyecto se llama 'tratamiento de imágenes' y se enfoca en la creación de una interfaz gráfica para manipular imágenes.

¿Qué tipo de ventana se utiliza para que el elemento de dibujo pueda ocupar toda el área de la ventana?

Se utiliza una ventana con un diseño de cuadrícula (grid layout) para que el elemento de dibujo pueda abarcar todo el espacio disponible.

¿Qué métodos se utilizan para hacer que la ventana se expanda a todo el tamaño de la pantalla del computador?

Se utilizan los métodos `setExtendedState(MAXIMIZED_BOTH)` y `setVisible(true)` para expandir la ventana a la pantalla completa.

¿Cómo se declara una función para cargar una imagen en el proyecto?

Se declara una función que retorna un buffer de imagen (BufferedImage) y recibe una ruta como argumento, pudiendo ser una ruta local o una URL en línea.

¿Qué es lo que hace la función 'escala de grises' en el código?

La función 'escala de grises' toma una imagen como entrada y devuelve una nueva imagen en escala de grises, calculando el promedio de los canales rojo, verde y azul para cada píxel.

¿Cómo se corrige el error de acceso a la variable 'leyBold' desde el método main?

Se corrige accediendo a la variable 'leyBold' desde el constructor de la clase 'Escala de Grises', en lugar de tratar de accederla directamente desde el método main.

¿Qué es lo que se debe hacer antes de transformar una imagen a escala de grises?

Antes de transformar una imagen a escala de grises, se debe cargar la imagen correctamente y asegurarse de que se muestra en la ventana de la aplicación.

¿Cómo se corrige el error de importación de clases en el código?

Se corrige asegurándose de que se importe la clase correcta para manejar imágenes, en este caso, la clase de Java AWT en lugar de la clase de JavaFX.

¿Qué es lo que hace el método 'setDefaultCloseOperation' en el código?

El método 'setDefaultCloseOperation' se utiliza para establecer el comportamiento de la ventana cuando se cierra. En este caso, se establece para que el proceso se cierre completamente.

¿Por qué es importante establecer el tamaño de la ventana antes de hacerla relativa a la pantalla?

Es importante establecer el tamaño de la ventana antes de hacerla relativa a la pantalla para evitar que la ventana se muestre demasiado pequeña o demasiado grande en la pantalla.

¿Dónde se puede encontrar el código fuente y más información relacionada con el video?

El código fuente y más información relacionada con el video se pueden encontrar en la descripción del mismo.

Outlines

00:00

😀 Introducción al proyecto de tratamiento de imágenes

El primer párrafo introduce un proyecto de tratamiento de imágenes en escala de grises o blanco y negro. Se menciona la necesidad de conocimientos básicos en programación y se describe el proceso de creación de una interfaz gráfica con Swing o WinForms. Además, se detalla cómo configurar la ventana para que abarque todo el tamaño de la pantalla y cómo hacer que sea visible al usuario final.

05:01

🖼️ Cargar una imagen y su visualización

En el segundo párrafo, se aborda cómo cargar una imagen desde una ruta local o una URL en línea. Se describe la implementación de una función para manejar la carga de la imagen y cómo manejar posibles errores al cargarla. Además, se discute la visualización de la imagen en la ventana y cómo ajustar la alineación horizontal para que se muestre correctamente. Finalmente, se menciona la creación de una función para transformar la imagen a escala de grises.

10:03

🛠️ Errores y correcciones en la implementación

El tercer párrafo comienza con el reconocimiento de un error en el código, específicamente en la importación de la clase incorrecta. Se corrige la clase importada y se ajusta el código para manejar la transparencia de las imágenes PNG. Se detalla el proceso de extraer los canales rojo, verde y azul de una imagen y cómo calcular el valor de gris para cada píxel. Además, se menciona la importancia de establecer el tamaño de la ventana antes de configurar su posición en la pantalla. Finalmente, se concluye el video con una demostración del resultado y se ofrece el código en la descripción para que los espectadores puedan copiarlo en sus proyectos.

Keywords

💡Algoritmo

Un algoritmo es una serie de pasos ordenados que se realizan para resolver un problema o ejecutar una tarea específica. En el video, el autor estructura un algoritmo avanzado para dibujar una imagen en blanco y negro o en escala de grises, que es el tema central del tutorial.

💡Escala de grises

La escala de grises se refiere a una imagen en la que cada píxel es representado por diferentes tonos de gris, en lugar de los colores completos. Es un concepto fundamental en el video, donde se enseña cómo transformar una imagen en color a una en escala de grises.

💡BufferedImage

BufferedImage es una clase en Java que representa una imagen en la memoria. En el script, se utiliza para cargar y manipular imágenes, como parte del proceso de convertir una imagen a escala de grises.

💡Interfaz gráfica

La interfaz gráfica de usuario (GUI) es una forma de interactuar con una computadora a través de elementos visuales como ventanas, botones y menús. En el video, se menciona la creación de una GUI para el proyecto de tratamiento de imágenes.

💡Ley de diseño

Se refiere a las reglas y prácticas que guían la creación de interfaces de usuario. En el contexto del video, se utiliza la 'Ley de diseño' para establecer cómo se debe mostrar la imagen en la ventana de la aplicación.

💡Transparencia en imágenes

La transparencia en las imágenes se refiere a la capacidad de un píxel para ser transparente, lo que permite que los fondos se vean a través del mismo. En el video, se menciona la importancia de manejar la transparencia al trabajar con imágenes PNG.

💡RGB

RGB es un modelo de color utilizado para representar colores en la visualización de imágenes en dispositivos de salida, como monitores y televisores. El video discute cómo manipular los valores RGB de un píxel para convertir una imagen a escala de grises.

💡URL

Una URL (Localizador Uniforme de Recursos) es una secuencia de caracteres que identifica un recurso web. En el script, se utiliza para cargar una imagen desde una ruta en internet como parte del proceso de carga de imágenes en el algoritmo.

💡Try-catch

Try-catch es una construcción de programación utilizada para manejar excepciones, es decir, errores inesperados que pueden ocurrir durante la ejecución de un programa. En el video, se utiliza try-catch para manejar posibles errores al cargar imágenes.

💡Label

Un Label en una GUI es un componente que muestra texto o una imagen. En el video, se utiliza un label para mostrar la imagen en blanco y negro o en escala de grises una vez que se haya procesado.

💡Proceso de salida

El proceso de salida hace referencia a cómo un programa termina su ejecución. En el contexto del video, se menciona 'setDefaultCloseOperation' para establecer que al cerrar la ventana del programa, este último también finalizará.

Highlights

Se presenta un algoritmo avanzado para dibujar imágenes en blanco y negro o escala de grises.

Requiere conocimientos básicos de programación para entender el algoritmo.

Creará un proyecto llamado 'tratamiento de imágenes' con una interfaz gráfica.

Utilizará Swing o Winforms para diseñar la interfaz.

La ventana del programa abarcará todo el área de la pantalla.

Implementará un método para cargar imágenes desde una ruta local o una URL en línea.

Se manejarán excepciones para casos de error en la carga de la imagen.

El ícono de la ventana se cambiará usando una imagen previamente cargada.

Se explicará cómo transformar una imagen a escala de grises.

Se usará el promedio de los canales rojo, verde y azul para crear el valor de gris.

Se incluirá soporte para imágenes con canal alfa (transparencia).

Se abordará cómo establecer el tamaño de la ventana para una visualización adecuada de la imagen.

Se dará un ejemplo de cómo aplicar el filtro de escala de grises a una imagen.

El código fuente estará disponible en la descripción del vídeo.

Se incluirán enlaces de contacto y un canal de Telegram para retos y algoritmos relacionados.

Se resalta la eficiencia y brevedad del algoritmo de escala de grises.

Se menciona que los conceptos previos son necesarios para comprender el algoritmo.

Se despide y invita a la audiencia a suscribirse al canal de Telegram.

Transcripts

hola amigos mi nombre es de fuego de lo

en este vídeo vamos a estructurar un

algoritmo para dibujar una imagen a

blanco y negro o en escala de grises

entonces lo primero que tengo que

aclarar es que para este algoritmo

tienen que tener conocimiento básico de

lo que es ya va ya que voy a enseñarles

un algoritmo un poco avanzado y no voy a

explicar a detalle todos los detalles

todo lo la estructura básica en el

lenguaje simplemente voy a explicar el

algoritmo

entonces lo que vamos a hacer es crear

un proyecto acá lo va a llamar

tratamiento de imágenes este proyecto

vamos a crearle una interfaz gráfica

esto lo hacemos dándole clic derecho acá

encima al package le vamos a dar en new

hánover y ahora vamos a seleccionar la

carpeta que dice swing winforms y vamos

a seleccionar esta que dice un hotal

frame form y le damos en siguiente y le

damos el título de nuestro proyecto en

este caso sería escala de grises

entonces selecciono escala de grises y

ahora vamos a hacer lo siguiente como

vamos a mostrar una imagen entonces

vamos a darle clic derecho a la ventana

y ahora le vamos a dar en grid layout

esto para hacer de que nuestro elemento

que va a representar la superficie de

dibujo puede ocupar toda el área de la

ventana entonces en este caso vamos a

utilizar un ley bold seleccionó aquí el

ley bold y ahora simplemente lo va a dar

clic derecho editar texto va a borrar el

peso que tiene por defecto y bueno en

este momento vamos a ahorrar todo digo

del mail y vamos a borrar los

comentarios vamos a dejar este archivo

limpio para empezar el proyecto entonces

vamos a declarar primero nuestro main y

ahora vamos a declarar una ventana de

tipo j frame vamos a decirle a la

ventana que va a ser un igual la unión j

frame y va a tener un set location

relativa to en un set de folk los

operation en exit un close esto lo que

hace es lo siguiente el set location

relativa tú lo que hace es entrar la

ventana en toda la pantalla del

computador el set de folklore operation

lo que hace es cerrar el proceso

dejaba en la cpu

en la la en el administrador de tareas

cuando se cierre esta ventana o sea

cierre esta ventana y se acaba el

programa eso es lo que quiere decir

vamos a y vamos a expandir esta

ventana a todo el tamaño de la pantalla

del computador

esto es fácil solamente colocamos set

eckstein state maximixe wood y ahora le

vamos a decir a la ventana que sea

visible estos días con usted bissey bold

y le pasamos un argumento que hacer tuvo

y bueno ahora ejecutemos y pueden ver

que tenemos una ventana que nos ocupa

todo el todo él es posible de la

pantalla del computador esto es bueno

así que ahora vamos a cerrarla y vamos a

hacer lo siguiente

vamos a declarar a cabo una función para

cargar una imagen esta va a retornar un

buffer eddy merckx y va a recibir una

ruta esta ruta que va a recibir puede

ser una ruta que está en el computador o

una ruta que esté en internet la verdad

ya va es lo suficientemente poderoso

para para cargar de forma fácil y rápida

cualquiera de estas dos opciones ya sea

online o ya sea en el computador de una

ruta local

entonces a cabo simplemente voy a

retornar

el primer caso que sería para una ruta

local entonces return email a yo importó

en la librería y ahora sería apuntó with

y eta y el parámetro le pasó new fire y

la ruta si esto arroja error nos vamos a

ir para el caché y en caso tal de que

nos vayamos para el caché entonces vamos

a hacer lo siguiente vamos a declarar

otro try catch donde ahora vamos a leer

una url

para esta ruta correspondiente y acá

vamos a cambiar esta excepción por 12 en

caso tal de que ninguna de las dos rutas

exista o no sepa cargar por algún motivo

vamos a decir que no se pudo cargar la

imagen y vamos a retornar null

ahora una vez que tengamos esto vamos a

tener que agregar este icono algo de ley

vol 1 pero para esto entonces vamos a

tener que cambiar él

el objeto al que corresponde la ventana

la ventana ahora ya no va a ser un motor

frame sino que va a ser nuestro objeto

escala de imágenes que es el que

contiene el botha frame que ocupa todo

el espacio de la ventana entonces

simplemente hacemos esto ahora le vamos

a decir lejos de ley vol 1 que va a

cambiar su icono concepto icon y acá le

vamos a pasar un email icon y le vamos a

pasar cargar la imagen que esto aquí

están generando un error

y la verdad no sé por qué pero vamos a

ver

bueno esto es debido

para que está ley vol es una variable

local no global no estática más bien

como no es estática entonces no podemos

no podemos acceder a ella desde el main

tenemos que acceder a ella desde el

constructor de la escala de grises

entonces

aquí vamos a colocar hot de ley vol 1

punto set vamos a cortar y vamos a pegar

y ahora encargar imagen le vamos a pegar

una ruta la ruta correspondiente va a

ser la de esta imagen que yo tengo

preparada con anterioridad de esta

imagen está lohan en y mgb éste es un

aval orador de imágenes que nos permite

con gran facilidad obtener urls fijos

para una imagen alojada en internet

entonces simplemente voy a bajar acá voy

a presionar aquí en insertar y ahora voy

a copiar la url y la voy a pegar acá en

cargar imagen algo bueno el ingv

es que los links que nos genera son

bastante cortos es bastante elegante

para usar entonces ya que tenemos esto

ahora simplemente vamos hacer lo

siguiente vamos a transformar esta

imagen a una imagen en blanco y negro

bueno y voy a aclarar algo acá en este

argumento yo coloque una url de internet

pero ustedes pueden colocar una ruta una

ruta local de su computador

cualquiera de las dos funciona para que

ustedes puedan transformar la imagen

entonces ahora ya que tenemos esto vamos

a ejecutar y vamos a probar de que la

imagen se está cargando correctamente

pueden ver de que lehman se está viendo

correctamente pero está viendo como a la

izquierda esto es debido a que el ojo

está 'label tiene

el horizontal alignment en él y ting

entonces vamos a cambiar esto por centre

y ahora ya acabamos ya que lo cambiamos

vamos a volver a ejecutar y pueden ver

de que ahora sí le mans está viéndose

entrada bueno entonces vamos a acá

y vamos a declarar una función de tipo

pública estática y que retornaron

mujeres de email que sea llamar escala

de grises iba a recibir un mujer el

email de argumento y bueno esta imagen

va a retornar otra imagen más bien esta

función va a retornar una imagen

entonces vamos a declarar acá el retorno

este va a ser de tipo friend email se

llama retorno va a ser igual a un niño

mujeres de email donde va a tener las

dimensiones

de la imagen que entra por argumento

esto sería con img punto gateway img

punto que take y para darle

transparencia como si fuera un png para

hacerla de forma general vamos a

colocarle que un 2 y ahora vamos a

recorrer con un force la imagen de la

siguiente manera vamos a recorrer con

una variable llamada se la anchura de la

imagen

una variable llamada f la altura de la

imagen

esto lo que hará es recorrer todas las

columnas y las filas correspondientes

para los píxeles de la imagen ahora

vamos a decirle el retorno que le vamos

a modificar el rgb en esa columna con

esa fila

y el color bueno acá tenía pensado

colocarlo todo en rojo pero no sé por

qué no me está botando la opción de que

te recibe eso está raro

no está bastante raro presentados

borremos y hagamos lo siguiente vamos a

obtener la recibe de la imagen entonces

esto sería con jeans rgb va a ser igual

a img punto que rgb de la columna y la

fila

y ahora le vamos a pasar el relieve de

la imagen y ya que teníamos la imagen de

retorno cargada vamos a retornar el

retorno ahora sí simplemente queda

probar que esto se muchas 'no

correctamente entonces pueda poderlo

probar vamos a la función de

escala de grises y la vamos a utilizar

vamos a encerrar la función de cargar la

imagen con la url que le hemos puesto y

la vamos a encerrar dentro de la función

de escala de grises le voy a dar formato

a esta sección del código para que esto

sea más legible porque veo que es otro

que 'no todo el montón ado entonces una

vez que tenemos esto vamos a darle clic

derecho y run file y pueden ver de que

la imagen se está viendo de la misma

manera en que se vio antes esto es

debido a que todavía no le hemos

aplicado un filtro como tal solamente

estamos haciendo una copia idéntica de

la imagen que está recibiendo por

argumento ahora vamos a este valor

rgb y lo vamos a transformar en una

escala de grises esto no es difícil

aunque es un concepto bastante

abstracto

se hace en la siguiente manera vamos a

definir una variable que se va a llamar

color y va

a obtener el rgv de la imagen bueno acá

no sé por qué el código no me está

funcionando bueno

encontré el error esto es debido a que

importe la clase equivocada importe la

clase de java fx y no puede ser la clase

java fx tiene que ser la clase d

de java punto a w esta que aparece acá

entonces la importó y ahora le pasó el

ing punto que te rgb trump este como

true es para que acepte la transparencia

de la imagen porque ustedes van a

utilizar imágenes png

el error que está mostrando en este

momento es debido al tipeo el tipo le

estoy diciendo en este momento que se

enteró pero tiene que ser color ahora ya

que tengo esto simplemente imt rd rojo

va a ser igual al color punto que es red

y lo mismo para el canal verde y azul

sería g y b y ahora en lugar de get red

sería get green y get blue

para obtener el canal rojo verde y azul

ahora ya que tenemos esto programado

de esta manera obteniendo los canales

rojo verde y azul

vamos a transformar estos tres valores

en un gris esto es simplemente el

promedio de los canales el gris es igual

a r más que más dividido entre 3 porque

tenemos tres canales y ahora si estamos

trabajando con imágenes alfa entonces

vamos a obtener el canal alfa el color

sería y nt de alfa igual al color punto

que alfa y ahora vamos a pasarle este

color transformado

a la imagen de retorno eso sería con new

color y le pasamos el gris en los tres

canales de color rgb y el alfa lo

dejamos como tal como alfa y le decimos

que vamos a obtener el rg v de este

color y ahora esto que estoy señalando

acá es el filtro correspondiente para

transformar una imagen a blanco y negro

esta es en esencia lo que hace cualquier

algoritmo que transforma una imagen a

blanco y negro es bastante corto es

abstracto pero es muy fácil de

implementar para poder entender lo

necesitan conceptos previos así que

bueno ahora le damos clic derecho a

ejecutar y pueden ver de que ahora la

imagen ya no está con colores está en

blanco y negro y al momento de cambiar

el tamaño pueden ver de que la ventana

se hace demasiado pequeña para que esto

no suceda acá en el en la estructura de

la obligaba de la escala de grises voy a

colocarle que el set tight va a ser de

800 x 600 pero es muy importante que

este set size este antes del set

location relativa tú

es muy importante que esté aquí

anteriormente a esto entonces lo coloco

antes del cen location relativa tube y

vuelvo a ejecutar clic derecho ron file

y pueden ver de que ahora cambie el

tamaño de la ventana y la ventana ya no

se hace extremadamente pequeña como se

hacía antes ahora se hace un tamaño

moderado en el que podemos seguir viendo

la imagen ahora sí amigos con esto he

concluido el contenido del vídeo ya

saben de que esta función de acá que se

llama escala de grises es la que se

encarga de hacer la magia es bastante

corta y bastante eficiente es muy buena

para poder trabajar este tipo de

comportamientos ya saben que el código

lo van a poder encontrar en la

descripción de este vídeo para que lo

puedan copiar e importar a sus propios

proyectos sin más que decir me despido y

olvidaba recordarles algo

en la descripción aparte de él y del

proyecto van a poder encontrar

enlaces a delegar y whatsapp para que me

puedan contactar en el momento que

deseen y también van a poder encontrar

un link a un canal de tele

donde estaré proponiendo retos mostrando

algoritmos

y cosas de este estilo uno

para que ingresé en este canal y se

suscriban ya sin más que decir ahora sí

me despido nos vemos en una próxima

ocasión hasta luego