OBTENER IMÁGENES ALMACENADAS EN LA BASE DE DATOS SQL

En esta oportunidad, me tomo el tiempo de continuar escribiendo información que tenga que ver con la manipulación de imágenes desde una aplicación de escritorio, utilizando Visual Studio, C# y SQL Server.

En el post anterior realizábamos un ejemplo que permitía almacenar imágenes en la base de datos, como un arreglo de bytes.

Ahora vamos a ver como obtener esos registros que contienen imágenes, para colocarlos en un simple Data Grid.

Tomando como base siempre el proyecto desarrollado en el post anterior, lo primero que hay que hacer es actualizar la clase EmpleadoBL, agregando el método que permita obtener todos los empleados almacenados en la base de datos.

Para este ejemplo, el método se llamará ObtenerEmpleados, y el código se verá más o menos así:

Después de realizar la respectiva actualización de la clase de Empleado en la capa de lógica de negocios, ahora nos vamos a agregar una nueva ventana en la interfaz WPF, para poder visualizar el resultado del método creado en el paso anterior.

La estructura del formulario, será muy sencilla. Solamente utilizaremos un par de objetos en el formulario (un Button y un DataGrid para ser más exactos). Al distribuir los objetos en el formulario, lucirá más o menos de esta forma:

Al terminar el diseño del formulario, vamos a realizar unas pequeñas modificaciones al Data Grid.

Primero, vamos a establecer la propiedad AutoGenerateColumns en False. Esto servirá para evitar que se generen columnas que no deseamos visualizar en el Data Grid. El código XAML deberá lucir de una forma similar a ésta:

Como siguiente paso, establecemos las columnas que necesitaremos. Esto lo lograremos por medio de la etiqueta <DataGrid.Columns>.

Si buscamos información acerca de la etiqueta, nos daremos cuenta que nos permite obtener la colección que contiene todas las columnas que se definen en el data grid. Puedes visitar este enlace para más información.

Al momento de definir las columnas tendremos que escoger entre las diferentes opciones disponibles: DataGridHyperlinkColumn, DataGridComboBoxColumn, DataGridTextColumn, DataGridCheckBoxColumn, DataGridTemplateColumn.

Para el caso de las primeras columnas bastará con utilizar una DataGridTextColumn, ya que lo único que necesitaremos será mostrar texto. Al terminar de definir las columnas con las propiedades Header, IsReadOnly, Width y el Binding que vamos a utilizar para mostrar texto, el XAML será:

Caso especial merece hablar acerca de la columna que se utilizará para mostrar la foto. Vamos a utilizar una DataGridTemplateColumn. Este tipo de columna nos permite especificar la plantilla del contenido a mostrar en la celda.

Iniciamos con la etiqueta de apertura de <DataGridTemplateColumn>, definiendo propiedades como el Header, IsReadOnly, y el Width, para dentro de ella poder utilizar la propiedad CellTemplate. Esto nos permite que la plantilla de la celda defina  cómo el contenido se presenta en las celdas de la columna. Esta propiedad no puede quedar vacía, por lo que no debemos de asustarnos al ver que se nos genera un error cuando recién declaramos la variable <DataGridTemplateColumn.CellTemplate>. Dentro de la propiedad CellTemplate, utilizamos la propiedad <DataTemplate para crear la estructura visual de objetos que nos permitirán mostrar la imagen. Por lo que, junto con lo agregado hasta el momento, el código XAML debería de verse algo así:

Por último, dentro del DataTemplate agregamos un control Image en el cual también tendremos que definir algunas propiedades comunes: Source, Width, Height y el Stretch.

A la propiedad Source del control Image, solo le colocaremos un Binding, el cual permitirá ir a traer los datos del campo Foto de la base de datos.

Finalmente el código XAML del Data Grid será:

Ahora programamos el botón de Obtener Empleados, con Code Behind, lo que significa que debemos generar el evento clic del botón y agregar el código siguiente:

Configuramos en el App.xaml el formulario de arranque para que sea el de Obtener Empleados.

Al compilar la solución y comenzar con el Debug, los resultados serán los siguientes:

ALMACENAR IMAGENES EN LA BASE DE DATOS SQL

En determinadas ocasiones, nos surge la necesidad de almacenar imágenes en algún lado, para la realización de nuestro proyecto.

Por eso y por otra variedad de razones, me he decido generar este post, como siempre buscando otra forma de aportar a la comunidad.

Lo que vamos a crear en esta oportunidad, es una solución utilizando Visual Studio como plataforma de desarrollo, C# como lenguaje de programación, y SQL Server 2008 R2 como gestor de Base de Datos, para que nos permita almacenar una imagen en la BD, como un arreglo de bytes. Por lo que habrá que hacer las conversiones adecuadas para lograr nuestro objetivo.

Comenzaremos desde la base de datos, creando una pequeña tabla llamada Empleado. La relevancia de la tabla empleado, es que ocuparemos un campo llamado Foto, el cual será de tipo Image. El cual nos permitirá almacenar la foto de cada empleado a registrar.

La tabla quedará con la siguiente estructura:

Cuando ya tengamos preparada nuestra tabla para el ejercicio, nos vamos a trabajar en Visual Studio.

Como primer paso, será la creación de nuestra solución en blanco en Visual Studio:

Procedemos ahora a crear nuestra capa de Acceso a Datos:

Agregamos el modelo de datos ADO .NET a utilizar:

Configuramos el modelo para generarlo desde la base de datos que creamos al inicio:

Creamos la nueva conexión hacia la BD:

Luego de eso, prestamos atención a los detalles de la conexión, así como también tenemos que verificar que la opción de guardar la conexión en el archivo de configuración de la aplicación esté activada.

Le colocamos el nombre al string de conexión. (Para el ejemplo, he decido dejar el nombre por defecto).

 

Como último paso para la generación del modelo desde la base de datos, simplemente seleccionamos los ítems que queremos importar a nuestro modelo. Para el caso del ejemplo solamente tenemos una tabla, la cual debemos de activar el check para que genere la entidad equivalente. No debemos de olvidar activar la opción de Pluralizar o Singularizar Nombres de los Objetos Generados:

Al finalizar el modelo de datos nos quedará de la siguiente forma:

Luego verificamos la propiedades de la Entidad Empleado. Buscamos y rectificamos la propiedad llamada Entity Set Name. Le colocamos el valor a la propiedad como Empleados.

Como siguiente paso, agregamos la clase que nos permitirá establecer la conexión con la base de datos. En este ejemplo la clase se llamará DBComun.

Al tener lista la clase, primero le cambiamos el modo de acceso a public para poder acceder a ella desde cualquier parte de la solución. Luego creamos una variable de tipo estática, la cual será tipo EjemploImagenEntities la cual es la clase contenedora de nuestro modelo de datos, y por último solo establecemos la propiedad con el método get para obtener el valor respectivo, para la variable que acabamos de crear.

Con esto, hemos terminado los componentes necesarios para la capa de acceso a datos.

Como siguiente paso, crearemos el proyecto que funcionará como proyecto de Lógica de Negocio.

A continuación, tenemos que agregar un par de referencias para poder comenzar a programar la clase de lógica.

Primero debemos de agregar la referencia del Proyecto de Acceso a Datos:

Luego agregar la referencia del ensamblado System.Data.Entity.

Cuando trabajamos con Visual Studio 2012, habra que comenzar a trabajar con Entity Framework 5.0, por lo que para esto necesitaremos agregar la referencia al ensamblado que lo contiene.

Abrimos el cuadro de diálogo de Agregar Referencia, luego damos clic en el botón Browse para ir a buscar el ensamblado en la siguiente ruta:

X:\Carpeta del Proyecto\packages\EntityFramework.5.0.0\lib\net45

Aquí encontraremos el archivo con extensión .dll que necesitamos:

Después de eso, las referencias del proyecto de la capa de lógica de negocio se verán de esta forma:

Agregamos una clase, que servirá para programar los métodos necesarios.

Como primer paso tendremos que agregar el using respectivo de las referencias necesarias que ya agregamos al proyecto.

Para el caso serán los using de EjemploImagen.DAL y System.Data.Entity.

Cambiamos el modo de acceso a la clase. Le colocamos public.

Por último agregamos las líneas de código necesarias para el método de Agregar Empleado.

Ahora ya estamos listos para proceder a crear la interfaz para poder guardar nuestro empleado con su respectiva foto.

Crearemos un proyecto de tipo WPF:

Lo primero a realizar es agregar las referencias de las capas anteriores hacia la capa de presentación:

Ahora el ensamblador System.Data.Entity.

También debemos de realizar un paso muy importante dentro de la configuración de nuestra interfaz.

Si recordamos en la creación del modelo de datos, en el primer paso guardamos un string de conexión en el archivo de configuración de la capa de acceso a datos.

Lo que habrá que hacer es copiar ese segmento de líneas de configuración que comprende desde la apertura de la etiqueta <connectionStrings> hasta la etiqueta de cierre correspondiente </connectionStrings> tal y como se puede apreciar en la imagen:

En el proyecto de interfaz de usuario editamos el archivo de configuración, para poder pegar el string de conexión, teniendo cuidado de pegarlo dentro de la etiqueta <configuration> </configuration>.

Finalmente, el código del archivo de configuración se verá así:

Agregamos una nueva ventana en WPF, la cual nos servirá para poder ingresar la información necesaria para almacenar a nuestro empleado.

En la estructura del formulario se han utilizado solo controles comunes (Labels, TextBox, Buttons, y un Image).

Al terminar de agregar y acomodar los objetos en el formulario, se verá mas o menos de la siguiente forma:

Comenzaremos con la programación, haciendo uso de un par de las referencias que agregamos en pasos anteriores así como también de otras más:

Después de eso, nos tomamos el tiempo para agregar un par de variables e instancias globales que nos ayudarán en el proceso :

Ahora nos vamos a programar el evento clic del botón examinar, el cuál nos permitirá ir a traer una foto (en formato JPG) desde cualquier ubicación del equipo, y colocarla en el Image del formulario, así como también realizar la conversión de la imagen al arreglo de bytes para almacenarlos en la base de datos.

El código del botón quedará de la siguiente forma:

Ahora nos vamos con el botón de Guardar.

En este botón, simplemente creamos una instancia de la clase Empleado, le asignamos los valores a dicha instancia y luego mandamos a llamar al método de Agregar Empleado que está en la clase BL.

El código lucirá de la siguiente forma:

Con esto hemos terminado la construcción de una pequeña parte del proyecto.

Al realizar las pruebas se ve mas o menos así:

Al observar los registros guardados en la base de datos, podremos apreciar que nuestro registro ha sido almacenado exitosamente.

En los post siguientes veremos como obtener los registros desde la base de datos, así como también como hacer para modificarlos.

Saludos.

Cifrado César Con C# En Visual Studio

Una nueva oportunidad de aportar, la he encontrado en un tema que para algunos puede ser demasiado fácil, y para otros lo suficientemente complicado como para sufrir fuertes dolores de cabeza.

 

Primero vamos hablar brevemente del cifrado César, solo para aclarar algunos conceptos.

 

El cifrado César es una de las técnicas de codificación más simples y más usadas. Es un tipo de cifrado por sustitución en el que una letra en el texto original es reemplazada por otra letra que se encuentra un número fijo de posiciones más adelante en el alfabeto.

Este cifrado recibe su honor gracias a Julio César, un gran emperador romano, que lo usó originalmente con un desplazamiento de tres espacios hacia la derecha para proteger sus mensajes importantes de contenido militar.

 

La cantidad de espacios y la dirección del desplazamiento puede variar de acuerdo a la aplicación y la persona que lo aplica. Puedes visitar enlaces como el de Wikipedia para más información.

 

El cifrado César en programación lo podemos aplicar para poder cifrar ciertos datos que consideramos como importantes, tales como la contraseña de un usuario, el número de identificación, números de cuenta, etc.

La lógica a trabajar para este ejercicio será más o menos así:

• Como todos sabemos, cada letra, número o símbolo del idioma español posee una representación numérica, llamada código ASCII. Por lo que debemos de obtener ese código de cada una de las letras que deseemos cifrar.
• Después de obtener ese número, le aplicamos el desplazamiento de 3 espacios (es decir le sumamos 3 a ese número).
• Luego, después de aplicada la suma, buscamos el equivalente al caracter de ese número (o código ASCII).

Veamos un sencillo ejemplo:

 

Supongamos que deseamos cifrar la palabra “INTEL”.

 

Primero debemos de obtener el código ASCII de cada una de las letras involucradas en la palabra que deseamos cifrar, obteniendo como resultado:

 

LETRA	CODIGO ASCII	DESPLAZA-MIENTO	RESULTADO ASCII	LETRA EQUIVALENTE
I	73	+3	76	L
N	78	+3	81	Q
T	84	+3	87	W
E	69	+3	72	H
L	76	+3	79	O

 

Si observamos con atención a la tabla anterior nos daremos cuenta que el resultado de utilizar el cifrado César para la palabra “INTEL” será: LQWHO.

 

Sin más cosas que aclarar vamos a la práctica.

 

¡Manos a la obra! Para este ejemplo vamos a utilizar una pequeña aplicación de consola.

 

Como primer paso entonces crearemos la aplicación:

 

 

Como siguiente paso, agregaremos una clase en donde guardaremos el método a utilizar para el cifrado. La clase llevará por nombre Cifrado.

 

 

Lo primero a realizar dentro de la clase es cambiar el modo de acceso de esta, le pondremos “public” para poder acceder a ella desde cualquier parte de la solución de nuestro proyecto.

 

Como acto seguido, vamos a declarar el método estático que me permitirá utilizar el cifrado César, este método aceptará un parámetro de tipo string, llamado “pPalabra”. Quedando la clase de esta forma:

 

Si prestamos atención el método nos indica por medio de la línea roja que subraya el nombre del método, que tenemos un error. Ese error se da porque el método devolverá un resultado de tipo string, que hasta el momento no se ha especificado.

 

Crearemos una variable, la cual nos servirá para guardar la palabra ya cifrada. Será de tipo string y el nombre será _caracteres. Le asignamos como valor inicial un string vacío.

 

Luego vamos a crear un ciclo, el cual nos servirá para poder recorrer toda el string que recibimos por medio del parámetro pPalabra. El ciclo inicializará en 0, y llegará hasta la longitud del parámetro recibido.

 

Al llevar a cabo estas dos acciones el código quedaría de esta forma:

 

 

El siguiente paso será el obtener el código ACII de cada una de las letras del parámetro capturado, para eso necesitamos realizar dos operaciones necesarias. La primera será sustraer una letra y almacenarla en una variable de tipo string, gracias al método Substring(). Después de eso obtenemos el código ASCII de la letra, que estará almacenada en la variable. Esto lo lograremos creando una variable de tipo int para almacenar el código resultante luego de realizar la conversión al tipo de datos Char. El código ahora lucirá mas o menos así:

 

 

Al obtener el número ASCII, procedemos a desplazar las 3 posiciones a la derecha, tal y como se habla en la idea original del cifrado César. Eso lo logramos sumando 3 al código de la letra a operar. Luego lo que hará falta el convertir ese código resultante de la operación, en el caracter equivalente. Y como último paso para terminar el método, solo tenemos que ir acumulando las letras resultantes en la variable que creamos al inicio del ejercicio, para poder retornar la palabra completa, pero ya cifrada.

 

Al terminar estas operaciones el método quedará de la siguiente forma:

 

 

Para poder probar el método, necesitaremos de un par de líneas de código en la clase Program.

Crearemos 2 variables de tipo string, una para almacenar la palabra que el usuario desea cifrar, y la segunda para almacenar el resultado de la ejecución del método, es decir almacenar la palabra ya cifrada.

Luego mandamos a llamar al método Cifrar que está dentro de la clase Cifrado, nótese que como es un método estático, no se necesita crear una instancia de la clase Cifrado.

Finalmente mandamos a imprimir en la consola el resultado de la ejecución del programa quedando las líneas de código algo así:

Si todo está perfecto, entonces obtendremos un resultado en la consola como éste: