Entradas

Mostrando entradas de 2016

OpenGL en Java (LWJGL)

Imagen
Para acceder a la librería OpenGL desde Java 8 primero debemos descargar LWJGL versión 3, este nos proveerá del acceso a la API Nativa OpenGL, para este tutorial usaremos el IDE Netbeans 8, primero creamos un proyecto Java Application, como este:

JavaFX Canvas

Imagen
El control javafx.scene.canvas.Canvas nos proporciona una superficie de dibujo sobre la cual podemos mostrar texto, formas geométricas e imágenes, al crear una instancia del objeto Canvas debemos establecer su tamaño, usando el constructor o los correspondientes métodos set y obtener el javafx.scene.canvas.GraphicsContext que nos permitirá acceder a los comandos de dibujo requeridos.

Reducir código con Lombok

Imagen
Lombok es un procesador de anotaciones Java que nos permite agilizar el proceso de desarrollo de una aplicación de software, se ejecuta en tiempo de compilación, durante este proceso crea e inyecta automáticamente el código determinado por la correspondiente anotación Java.

JavaFX - ComboBox con cuadro de búsqueda

Imagen
Un ComboBox es un control JavaFX que muestra una lista desplegable de elementos, el usuario puede seleccionar el elemento deseado, cuando la lista es extensa el usuario puede tener problemas con la búsqueda, por lo que intentaremos crear un ComboBox JavaFX con un cuadro de búsqueda.  

PyQT 5 Estilos QSS

Imagen
Qt Style Sheets (QSS) es un lenguaje diseñado para cambiar la apariencia de las interfaces gráficas de usuario diseñadas con Qt, está basado en las hojas de estilos en cascada (CSS), son muy similares, por lo que, si ya conoces CSS empezar a utilizar QSS será muy fácil. Qt Style Sheets : QLineEdit { color: red; background-color: white; }

OpenCV & JavaFX

Imagen
Ya conocemos la biblioteca OpenCV y también hemos visto la API JavaFX por lo que en este tutorial aprenderemos a utilizar ambas tecnologías en conjunto, Java hace uso de la tecnología JNI ( Java Native Interface ) para acceder a las funciones nativas almacenadas en la librería dinámica opencv.dll .

GLSL Variables Uniform

Las variables de tipo uniform permiten la comunicación entre la CPU y la GPU, estas variables mantienen su valor durante la ejecución del shader, las variables son declaradas usando la palabra reservada uniform , el shader no puede cambiar el valor de estas variables, sin embargo si es posible asignarle un valor inicial.

GLSL Vertex Attibute

Imagen
El vertex shader es la primera etapa programable en el OpenGL pipeline, es el encargado de procesar y transformar la geometría de una figura, se ejecutara una vez por cada vértice que compone dicha figura, antes de comenzar la ejecución del vertex shader primero debemos establecer los datos de entrada, podemos tener de dos tipos: vertex attibute y uniform variable .

Tutorial Sintaxis GLSL

En este tutorial veremos la sintaxis de GLSL, nos enfocaremos en el uso de la versión 3.3 como mínimo, en el Tutorial Introducción a GLSL vimos todos los detalles teóricos que debemos conocer antes de empezar, veamos nuestro primer fragmento de código.

Introducción a la Programación GLSL

Imagen
OpenGL Shading Language (GLSL) está basado en ANSI C, muchas de las características de C están presentes en GLSL con algunas diferencias que los hacen más simple, por ejemplo no contamos con punteros y se añaden nuevos tipos de datos para el manejo de vectores, matrices y texturas.

Mostrar Varios cv::Mat en una Ventana

Imagen
En el siguiente tutorial OpenCV veremos cómo podemos mostrar una, dos o más Imágenes en la misma ventana, la biblioteca OpenCV no tiene una función definida para esto pero hacerlo es muy fácil, lo que haremos será crear una imagen de gran tamaño que contendrá a las demás imágenes que deseamos mostrar ubicando cada una de ellas en su correspondiente ubicación.

TableView Editable (JavaFX)

Imagen
Seguimos viendo más posibilidades del control JavaFX TableView , esta vez veremos cómo editar los datos que son mostrados en el control y veremos cómo personalizar el control usado para la edición de las celdas, por ejemplo: para editar un dato tipo fecha usaremos un control para el manejo de fechas DatePicker , del mismo modo para los demás datos usaremos el control correspondiente.

PyQT-5 Controles Para Visualizar Listas

Imagen
Este tutorial trata sobre aquellos controles que nos permiten visualizar una lista de elementos y seleccionar o varios elementos de la lista, entre los más comunes tenemos: QComboBox , QListWidget , QTableVidget , veremos un ejemplo donde presentamos cada uno de estos widgets de la biblioteca pyqt-5.

PyQT-5 Cuadros de Diálogo

Imagen
En este tutorial Python estudiaremos los cuadros de diálogo estándar que provee la biblioteca PyQT-5 aprenderemos a programar los cuadros de dialogo QInputDialog , QFileDialog , QColorDialog , QFontDialog y el QMessageBox , cada uno de ellos nos provee de funcionalidades distintas que nos facilitan el desarrollo de aplicación con Python y PyQT.

PyQT-5 Tutorial Widgets

Imagen
Seguimos con la serie de tutoriales Python orientados a la creación de Interfaces Gráficas de Usuario (GUI) con PyQT 5 , en este nos enfocaremos en ver algunos de los widgets más usados a la hora del desarrollo de las aplicaciones, como: QCheckBox, QComboBox, QDateEdit, QLineEdit, QLabel, QProgressBar, QPushButton, QSlider, entre otros.

Efecto Pixelado con OpenCV

Imagen
Continuando con la serie de tutoriales OpenCV esta vez aprenderemos a aplicar el efecto de pixelado a una imagen, lo utilizaremos en conjunto con un detector en cascada para localizar una región u ocultarla, por ejemplo, detectar un rostro y ocultar el área que lo contiene para proteger la identidad de la persona.

Comandos de Dibujo en PyQT5

Imagen
Con PyQt5 como con cualquier otro framework podemos dibujar figuras ya sea de las comúnmente conocidas o nuestras propias creaciones, ya hacer necesitamos manejar el evento paintEvent y crear un objeto QPainter para dibujar, los comandos de dibujo se deben ubicar entre las llamadas a los métodos begin y end .

Acentuar Color

Imagen
En este tutorial OpenCV creamos el efecto acentuar color, el mismo busca resaltar el área de una imagen que contenga un color indicado, las demás áreas son rellenadas con colores grises.

OpenCV Búsqueda de Patrones (Template Matching)

Imagen
La búsqueda de patrones es una técnica de análisis de imágenes que podemos utilizar para buscar una imagen dada (patrón o template) dentro de una imagen de mayor tamaño, no solo buscamos apariciones exactas del patrón también se permite un grado de variación respecto al patrón original. Template matching (Comparación de plantillas) es uno de los métodos más utilizados en la búsqueda de patrones, con la biblioteca de computación visual OpenCV esta tarea la realiza la función cv::matchTemplate() la cual implementa con distintos métodos de comparación, puedes indicar estos métodos usando la enumeración cv::TemplateMatchModes .

SkyBox Utilizando Cube Maps

Imagen
En el tutorial OpenGL anterior aprendimos a generar un terreno , aplicando correctamente diversas texturas, iluminación, mapas de relieve, etc., podemos lograr efectos realistas, sin embargo si miramos al horizonte veremos el color usado para limpiar el frame, en el mundo real vemos el cielo, sol, nubes, etc., un sky box es una caja que rodea la escena, aplicando las texturas adecuadas generamos el efecto deseado.

Generación de Terreno

Imagen
Generación de terreno utilizando un mapa de elevación, crearemos un terreno plano y usaremos un mapa de altura para establecer la elevación de cada uno de los vértices que componen el terreno, finalizamos aplicando una textura al terreno para darle un aspecto más realista, la textura puede contener rocas, nieve, fango, arena, y otros con lo que se logran efectos muy realistas.

Mapeo de Sombras

Imagen
Anteriormente veíamos como dar efectos de iluminación a las escenas 3D, para completar un efecto realista en nuestras escenas debemos agregar sombras, ya en el mundo real siempre que tengamos luz se genera una sombra, aprenderemos a utilizar el Frame Buffer Object (FBO) para almacenar un mapa de profundidad que será utilizado para crear la sombra de los objetos en la escena 3D.

Normal Map

Imagen
Un normal map es una textura que es usada para almacenar las coordenadas del vector normal, una textura regularmente almacena las componentes de color RGB, en un normal map se almacenaran las coordenadas XYZ que serán utilizadas para definir el vector normal, a esta técnica se le conoce como: normal mapping o en ocasiones como bump mapping.

Histogramas

Imagen
Un histograma es una representación gráfica de la distribución de los niveles de grises en una imagen, utilizando el método de Ecualización de Histogramas podemos obtener una distribución uniforme del histograma de la imagen, este método mejora el contraste y brillo de una imagen que sea demasiado oscura o brillante, obteniendo un balance óptimo de los pixeles blancos y negros.

Materiales e Iluminación

Imagen
Los materiales son usados para definir el aspecto de los objetos en escena 3D, estos describen las propiedades físicas de los objetos con respecto a cómo los mismos reflejan la luz que incide sobre ellos, anteriormente habíamos definido las propiedades de la fuente de luz por lo que toda la escena es iluminada del mismo modo, definiendo por separado las propiedades de cada objeto logramos que cada una de ellos responda de manera diferente a la iluminación.

Texturas e Iluminación

Imagen
En el tutorial OpenGL anterior aprendimos a modificar las propiedades de los materiales para obtener diferentes resultados cuando el objeto es iluminado por una fuente de luz, si deseamos obtener resultados más realistas debemos recurrir al uso de texturas para establecer de manera más precisa el color de cada pixel, veremos cómo utilizar texturas para definir las componentes ambiental, difusa y especular de un objeto.

GUI en OpenGL (AntTweakBar)

Imagen
AntTweakBar es una librería diseñada para crear interfaces gráficas de usuario (GUI) en aplicaciones gráficas, funciona tanto en OpenGL como en Microsoft DirectX, es bastante fácil de usar y muy potente, sobre OpenGL se puede usar en conjunto con las librerías de manejo de ventanas más utilizadas, como: GLFW (la que usamos en esta serie de tutoriales OpenGL moderno), la clásica GLUT y su versión más moderna FREEGLUT, SDL, entre otras.

JavaFX Gráficos 3D

Imagen
JavaFX nos ofrece la posibilidad de agregar gráficos tridimensionales en la aplicación que estemos desarrollando, JavaFX cuenta con un grupo de figuras prediseñadas como: cubo, esfera, cilindro, etc., además podemos crear nuestras propias figuras, contamos también con las clases correspondientes para el manejo de luces y cámaras.

OpenCV Restaurar Imagen

Imagen
Inpainting es un proceso en el que se busca reconstruir partes dañadas de una imagen o video, también puede ser utilizado para remover textos u objetos de una imagen, esta función soporta dos métodos el primero llamado INPAINT_NS (Navier-Stokes) y el método INPAINT_TELEA propuesto por Alexandru Telea.

Tutorial OpenGL - Cámara

Imagen
En este tutorial OpenGL moderno aprenderemos a crear una cámara móvil, que nos permitirá navegar libremente por una escena 3D, anteriormente para visualizar una escena usamos una cámara estática que nos permitía ver el objeto desde un único punto de vista, esta nueva cámara cambiara su posición al presionar determinadas teclas y cambiara su dirección de visión con el ratón.

Open Asset Import Library (ASSIMP)

Imagen
Assimp es una librería que nos servirá para cargar modelos o escenas 3D almacenados en gran variedad de formatos, como: Collada (*.dae; *.xml), Blender (*.blend), 3D Studio Max 3DS (*.3ds), Wavefront Object (*.obj ), y muchos más, Assimp puede cargar información de vértices, coordenadas de textura, normales, materiales, animación, y otros.

Iluminación - Tipos de Luces

Imagen
En este tutorial OpenGL veremos tres tipos de luces que podemos implementar, ya aprendimos como utilizar el modelo de iluminación phong en el tutorial anterior, ahora utilizaremos los conceptos aprendidos para crear varios tipos de luces, como: luz direccional, luz puntual y luz focal.

Modelo de Iluminación Phong - Tutorial OpenGL

Imagen
En la programación de gráficos 3D existen distintos modelos de iluminación que intentan simular cómo se comporta la luz al iluminar la superficie de un objeto tridimensional, uno de esto es el modelo de iluminación Phong , lo podemos aplicar por vértice ( Gouraud shading ) o por pixel ( Phong shading ). 

PyQT5 Responder a Eventos

Imagen
Una de las tareas más comunes a la hora de crear una GUI es responder a determinados eventos para dar cierta funcionalidad a nuestra aplicación, por ejemplo: ejecutar una acción al presionar un botón, o incluso responder a eventos que no han sido producidos por la GUI como los eventos de conexión o desconexión a la red de internet.

Seguimiento de Objetos por Color

Imagen
Esta vez intentaremos detectar un objeto basándonos en su color, esta técnico nos servirá para detectar objetos de un color uniforme, veremos cómo extraer las coordenadas en las que se encuentre el color que deseamos detectar y como resaltar el objeto encontrado.

Inyección de Dependencias (DI) en Spring

En el tutorial IoC con Spring vimos como los beans son administrados por Spring IoC Container, en ocasiones podemos tener beans que dependen de otros, estos a su vez tienen sus dependencias, la inyección de dependencias en un patrón de diseño en el cual estas dependencias son inyectadas automáticamente por el framework, en nuestro caso Spring Framework.

Dibujar Texto en OpenGL

Imagen
Dibujar texto en una aplicación gráfica es una tarea común, sin embargo OpenGL no cuenta con funciones para esta tarea, cuando deseemos mostrar texto tenemos varias opciones, las más comúnmente utilizadas como: usar una imagen generada a partir de una fuente determinada, o cargar una fuente TrueType, generar la imagen y mostrarla como una textura.

Cargar Modelo 3D Formato OBJ

Imagen
En este punto sabemos cómo crear objetos 3D y cómo aplicarles una textura, sin embargo todo lo hemos hecho mediante código, por lo que a la hora de crear modelos 3D complejos esta práctica será bastante irritante, por lo general los modelos 3D y sus texturas son creados con la ayuda de software de modelado 3D como Blender, Maya, 3D Max y otros, estos modelos son almacenados en diferentes formatos (3DS, FBX, OBJ, etc.) por lo que en este tutorial veremos cómo podemos cargar en nuestra aplicación gráfica un modelo creado usando alguna de estas herramientas.

Texturas OpenGL Moderno

Imagen
Una textura es una imagen que puede ser aplicada a un objeto 3D para darle mayor realismo, OpenGL maneja dos tipos de texturas, las texturas procedurales, son calculadas mediante algoritmos y las texturas de imagen, que son aplicadas a partir de un archivo de imagen, en este tutorial nos enfocaremos en las texturas de imagen.

PyQT5 Diseñador QT

Imagen
QT Designer es una aplicación que nos facilita la creación de GUI, nos permite crear interfaces gráficas de usuario rápidamente mediante el método de arrastrar y soltar, una vez creada se guarda en un archivo .ui en formato XML que puede ser cargado en tiempo de ejecución o convertirse en código Python para generar la GUI.

Visualización 3D usando OpenGL

Imagen
Las matrices son ampliamente utilizadas en la visualización de gráficos 3D, OpenGL las utiliza para aplicar transformaciones (escalado, traslación, rotación) a los objetos 3D, manipular la vista de proyección, entre otras cosas, para empezar veremos cómo mostrar un objeto tridimensional en pantalla (el clásico cubo).

JavaFX Preloader (Pantalla de Carga)

Imagen
Un Preloader es una pantalla que se muestra antes de iniciar una aplicación JavaFX, mientras la misma está cargando, es recomendable utilizarla si nuestra aplicación tarda algo de tiempo al cargar, puesto que el usuario podría pensar que la aplicación no responde, por lo que mostrarle una pantalla indicándole que la aplicación está cargando y el progreso de la carga es una buena práctica de programación.

Spring-Security en JavaFX (Parte-2)

Imagen
Segunda parte del tutorial de seguridad para JavaFX con Spring Security Framework , aquí nos centraremos en eliminar el archivo de configuración security.xml y tener toda la configuración basada en código Java, a parte integraremos una base de datos donde almacenaremos la información de los usuarios registrados, por último aprenderemos a proteger las contraseñas mediante el uso de algoritmos hash.

Seguridad en JavaFX con Spring Security (Parte-1)

Imagen
Spring Security es un framework de seguridad, nos provee de mecanismos de autenticación y autorización, usualmente utilizado en la creación de aplicaciones web con Spring Framework, pero, en esta ocasión integraremos Spring Security a una aplicación JavaFX no web, veremos cómo crear un sistema de login y autorización por roles, además tendremos la posibilidad de proteger un método de una clase determinada.

Layout en PyQT-5

Imagen
A la hora de crear una Interfaz Gráfica de Usuario (GUI) disponemos de dos opciones en cuanto al posicionamiento de los controles (QWidget) estos pueden ser ubicados en un área establecida por las coordenadas (X, Y) o podemos optar por utilizar clases que administren la posición de los controles automáticamente.

Python GUI con PyQT5

Imagen
QT en librería utilizada para la creación de interfaces gráficas de usuario (GUI) en el lenguaje C++, soporta múltiples sistemas operativos como: Linux, Mac OS, Windows, etc., PyQT es la versión Python de QT, en este curso veremos la versión PyQT 5 y aprenderemos a crear GUI mediante código y usando el diseñador Qt Designer, usaremos los distintos layouts y controles que tenemos disponibles para desarrollar aplicaciones visualmente enriquecidas.

Introducción a CSS en JavaFX

Imagen
Las hojas de estilo en cascada (CSS) por sus siglas en inglés, son un lenguaje utilizado para dar estilo y formato a documentos HTML, JavaFX soporta el uso de estilos CSS para cambiar la apariencia de una aplicación, de momento no todas las características CSS estandarizadas por la W3C están soportadas y algunas cosas funcionan de manera diferente, pero si ya conocen CSS integrarlo en JavaFX será muy sencillo.

Introducción a OpenGL Moderno

Imagen
OpenGL es una API de gráficos 3D multiplataforma, además existen adaptaciones de la API para dispositivos móviles (OpenGL ES), y para navegadores web (WebGL), además esta soportada por las principales tarjetas gráficas como ATI, NVidia, incluso procesadores gráficos integrados de AMD e Intel, OpenGL junto a DirectX son las dos API gráficas mas populares existentes a la fecha.

Introducción a los Shader (GLSL)

Imagen
Los shaders no son mas que simples programas que se ejecutan en el procesador gráfico GPU, son escritos en el lenguaje GLSL, el cual es bastante similar a C, como cualquier otro programa los shaders deben ser compilados y enlazados, solo que el compilador y el enlazador o linker están integrados en la API OpenGL.

Enviar datos al vertex shader

Imagen
Este tutorial nos enseña como enviar datos al vertex shader, específicamente vértices, por ahora, para formar una figura requerimos de varios vértices, para un triangulo necesitamos 3, uno para cada esquina, por lo veremos como almacenar estos vértices en la memoria de la GPU para que el vertex shader pueda acceder a ellos y dibujar la figura deseada.

DAO con Spring Framework

En tutoriales anteriores hemos visto cómo implementar la arquitectura DAO ya sea con la API JDBC directamente o mediante el ORM Hibernate utilizando la especificación JPA 2.1, en este punto podemos avanzar al siguiente nivel, integrar un framework para simplificar aún más nuestro proyecto, utilizaremos Spring Framework 4.x y aprovecharemos sus capacidades de Inversión de Control (IoC).

Simplificar DAO con Hibernate JPA

En el tutorial anterior DAO con JDBC vimos cómo implementar la arquitectura DAO con la API JDBC, en el mismo podemos notar la gran cantidad de código que requerimos para el manejo de excepciones que además repetimos varias veces, también observamos que siempre necesitamos mapear los objetos java hacia la base de datos o al contrario de la base de datos a objetos java, existen herramientas llamadas Object Relational Mapping (ORM), que realizan estas tareas por nosotros, por lo que este tutorial veremos cómo simplificar nuestro código mediante el uso del ORM Hibernate 4.x.

Compilar e Instalar GLFW y GLM

Imagen
GLFW es una librería que nos permitirá crear y administrar las ventanas donde desplegaremos los gráficos OpenGL, podemos crear ventanas de manera nativa usando las funciones WGL (Windows-GL) para la plataforma windows, del mismo modo disponemos de funciones para Mac OS y Linux, el uso de GLFW nos facilita el trabajo de creación de ventanas y ademas es soportada por los sistemas operativos mencionados.

Data Access Object (DAO) con JDBC

Imagen
Este tutorial nos enseña cómo implementar el patrón de diseño DAO en una aplicación Java conectada mediante la API Java Database Connectivity (JDBC), el patrón DAO busca crear una separación entre las capas de bajo nivel (acceso a datos) y la capa de alto nivel (servicios de negocios).

Inversión de control (IoC) con Spring

Imagen
El núcleo de Framework Spring es el contenedor de inversión de control, este es el encargado de instanciar, inicializar y administrar los objetos de la aplicación, estos objetos son llamados beans , la forma como se crearan estos objetos debe ser configurada, lo podemos hacer mediante un archivo XML, usando configuración basada en anotaciones o la configuración basada en Java, podemos usar una, otra o combinarlas, según nuestras necesidades.

Realidad Aumentada (OpenCV+ArUco)

Imagen
La realidad aumentada busca combinar el mundo real con uno virtual permitiendo la interacción entre ambos mundos, lo que haremos será extender la realidad con objetos creados por computador que se adaptarán a nuestro mundo real.

Compilar e instalar la librería GLEW

Imagen
Compilación e instalación en Windows de las librerías auxiliares OpenGL que nos facilitaran el trabajo con esta librería gráfica, utilizaremos CMake como herramienta de generación de proyectos para que cada uno genere las librerías para su compilador e IDE favorito, en mi caso utilizare Microsoft Visual Studio 2015.

Visualizar Reportes Jasper en JavaFX

Imagen
Jasper Report es una librería utilizada para la construcción de reportes en Java, la misma cuenta con un visor de reportes construido con Swing, por lo que crearemos un visor en JavaFX que nos permita visualizar nuestros reportes sin inconvenientes de interoperabilidad.

Temas relacionados