Académique Documents
Professionnel Documents
Culture Documents
INGENIERA EN INFORMTICA
ESPECIALIDAD
MATERIA
TRABAJO
ESTUDIANTE
FECHA DE ENTREGA
22 DE FEBRERO DE 2014
OBJETIVO El objetivo principal de la prctica es analizar y comprender los diferentes tipos de archivos que existen para darles un uso adecuado y en las situaciones o mementos correctos, es decir, est enfocada principalmente en el tratamiento de la informacin que se utilizara. Mi objetivo personal es lograr que cualquier persona con un conocimiento bsico de computacin y/o informtica sea capaz de desarrollar la prctica y sobre todo comprenderla a fin de que obtenga un conocimiento sustancial y de mucha utilidad, es decir, que entienda y comprenda como es que se componen los archivos para as poder implementarlos de manera correcta y se le facilite la eleccin de los mismos segn la actividad que desee realizar en un futuro.
Eleccin de la unidad de medida, formato de pgina y mrgenes Gestin de cabeceras y pies de pgina Salto de pgina automtico Salto de lnea y justificacin del texto automticos Admisin de imgenes (JPEG , PNG y GIF (versin 1.6) ) Colores Enlaces
SUBLIME TEXT: Sublime Text es un editor de cdigo multiplataforma, ligero y con pocas concesiones a las florituras. Es una herramienta concebida para programar sin distracciones. Su interfaz de color oscuro y la riqueza de coloreado de la sintaxis, centra nuestra atencin completamente.
WampServer crea por default una carpeta llamada wamp dentro de la unidad C del disco duro, dentro de ella estn todos los archivos necesarios para su funcionamiento, incluida una carpeta llamada www en donde tendremos todo lo relacionado con nuestra bases de datos, es recomendable crear una carpeta dentro de www por cada base de datos que se tenga en este caso crearemos una llamada ejemplo, dentro de esta carpeta colocaremos la librera fpdf para su posterior uso.
Una vez que se tiene descargado e instalado todo el software necesario lo principal es abrir el navegador e insertar la direccin localhost en la barra de direcciones. Deber aparecer lo siguiente:
ENTRAR A PHPMYADMIN
Una vez que se ubique en esa pgina, lo siguiente ser dar clic al enlace llamado phpmyadmin (este enlace lo sealo en la imagen)
Una vez que se tiene un usuario y contrasea se teclean en los campos especficos para cada uno de ellos y se da clic en el botn continuar.
Una vez en esta parte deberemos darle un nombre a nuestra base de datos y dar clic en el botn crear.
Accederemos a la siguiente pantalla en donde es necesario crear una tabla por lo menos para la base de datos, en esta parte de daremos un nombre a la tabla as como el total de columnas que contendr (en este caso 6) cabe mencionar que esta informacin puede ser modificada posteriormente. Una vez realizado lo anterior damos clic en Continuar.
Es importante seleccionar el tipo de dato correcto dependiendo de lo que se desee almacenar o contener en los campos de la tabla, si esto no se hace correctamente la base de datos ser inconsistente y por lo tanto ineficiente. Una vez realizado todo lo anterior y asegurndonos de que todos los datos estn ingresados correctamente, damos clic en Guardar. En este momento la tabla se ha creado y guardado. Lo siguiente es entrar a ella para llenarla con los datos deseados, esto se hace dando clic en el botn insertar que aparece en la hilera de pestaas junto al nombre de la tabla como se muestra en la siguiente imagen.
Una vez que todos los campos estn llenados de forma correcta se da clic en el botn continuar, este paso har que volvamos a la pantalla anterior en donde podemos dar insertar nuevamente y repetir el proceso hasta llenar la tabla con todos los datos deseados. Una vez concluido este paso podemos dejar por un momento el navegador para comenzar a trabajar con Sublime Text y comenzar a crear un archivo php al que llamaremos funciones en donde crearemos los mtodos a utilizar, esto con la finalidad de simplificar el cdigo siguiente, as como uno llamado ndex que har la consulta a la base de datos para tomar los datos de la tabla y crear la pgina HTML que se solicit, con el contenido completo de la tabla en una solo consulta.
10
Podemos observar que lo primero que se hace es invocar o llamar a la clase funciones.php, esta clase aun no la creamos pero la podemos incluir en el cdigo desde este momento sin ningn problema, lo siguiente que se hace es asignar el servidor, usuario, contrasea y base de datos a utilizar en las variables host, usuario, password y basedatos respectivamente. Esto es muy importante tenerlo presente ya que estas variables se van a estar utilizando permanentemente a lo largo del cdigo que implementaremos. La lnea siguiente habla de crear un objeto de la clase conexionBaseDatos (que es la clase que contiene funciones para conectarse a la base de datos), este objeto servir para abrir la base de datos junto con el mtodo abrir que crearemos ms adelante en el archivo funciones. Por ultimo este cdigo nos muestra cmo se hace una consulta a la tabla tabejem y guarda lo obtenido en la variable resultado.
11
Dentro del mismo ndex se comienza a crear la pgina HTML en donde se mostraran los resultados de la consulta a la tabla que acabamos de hacer, la lnea 30 y 31 muestran la ubicacin en donde queremos que se impriman los resultados ya que por default de imprimen a la izquierda de la pantalla, en la lnea 33 est el cdigo para insertar una imagen en el HTML que ser el encabezado, en este caso una imagen del logo de WALMART, la lnea 36 muestra cmo poner un borde a la tabla y el tamao del mismo, lo siguiente de relevancia es la lnea 41 muestra como imprimir texto en la pgina para lo cual es necesario establecer el tipo de letra (H2, H3, etc.), as como el color de esta 1420CA que se tiene que insertar en cdigo hexadecimal y el mensaje o texto que se desea imprimir en pantalla. La lnea 42 es muy importante porque en ella se establece el enlace para crear el archivo PDF mediante el archivo imprimir.php que crearemos ms adelante, este mtodo principalmente hace que una imagen (en este caso) se convierta en un hiperenlace que lo vincule hacia el archivo imprimir.php y abra el archivo PDF en el navegador. Por ultimo en esta parte del cdigo se muestra como imprimir los encabezados de cada columna de la tabla. El tr bgcolor hacer referencia al fondo de la tabla y el <td> Font color es para insertar texto y seleccionar el color del mismo, en este caso debemos escribir cada uno de los campos solicitados por el profesor.
12
Por ultimo implementamos un ciclo while que estar en funcionamiento hasta que recorra el total de datos a imprimir, ntese que se inicializo una variable i inicializada en 0, esta variable es utilizada dentro del ciclo while con un if, esto es para ir intercambiando el color de fondo de cada fila de la tabla (intercalados), posteriormente muestra el cdigo para insertar los datos en cada campo de la tabla, el de la imagen es especial porque no solo muestra cmo es que se debe imprimir una imagen sino tambin le asigna un tamao especifico (60 80), esto sirve para homologar el tamao de todas nuestras imgenes a la hora de mostrarlas en pantalla sin necesidad de estarlas recortando o modificando manualmente cada una de ellas. Al final del ciclo hace el incremento a la variable i y cierra la conexin a la base de datos.
13
En este archivo se crea una clase que contiene los mtodos que se utilizan tanto en el ndex como en el archivo imprimir que haremos despus. Contiene el mtodo para seleccionar la base de datos, abrirla, realizar consultas, insertar los valores a una tabla, actualizar en caso de ser necesario y eliminar tambin en caso de necesitarlo. En general esta clase se realiza con la finalidad de dar un orden y simplificar el cdigo para tener un mejor entendimiento del mismo. Cabe mencionar que esta clase se puede omitir, pero sera necesario teclear todo el mtodo cada vez que se requiere y eso no es prctico de ninguna forma.
14
Lo primero que se hace es invocar a las clases que se necesitaran para poder ejecutarse adecuadamente: fpdf.php que recordemos que sirve para crear un documento PDF y la clase funciones.php que es la creada por nosotros en el paso anterior y contiene los mtodos bsicos de conexin a la base de datos y algunas otras funciones especficas mencionadas anteriormente. Despus ingresamos los datos del servidor, usuario, contrasea y base de datos a usar. Ahora es necesario crear una clase a partir el archivo FPDF para crear en forma el documento PDF, insertamos la funcin Header para ponerle un encabezado que aparecer en cada una de las pginas del PDF, en este caso seleccione una imagen del logo de WALMART asi como las coordenadas en donde debe aparecer, enseguida inserto una leyenda (texto) que aparecer de igual forma en cada una de las hojas del documento como parte del encabezado, seleccionando el tipo de letra (arial), el estilo (B=negrita) y las coordenadas de cada celda en donde debe aparecer. NOTA IMPORTANTE: Las coordenadas se deben considerar para cada dato que se quiera insertar al PDF y por lo tanto es importante conocer cmo funciona esta metodologa, para lo cual existe un conjunto de tutoriales que se descargan junto con el archivo FPDF, as como muchos otros existentes en internet principalmente. Por cuestiones de tiempo y de lo complicado que resulta por esta vez solo dejare en el marco terico algunos enlaces de donde obtuve la informacin de cmo implementar el sistema de coordenadas en el FPDF.
15
La funcin Footer de FPDF sirve para insertar un pie de pgina a cada hoja del documento PDF, en este caso imprimir Pagina y el nmero de pgina correspondiente del PDF. Despus llamamos la funcin tabla que sirve para insertarle una tabla al documento PDF. En esta funcin se decretan varios criterios como lo el color de los bordes, as como su grosor. Adems seleccionamos los parmetros de la ubicacin y creacin de los encabezados de cada columna de la tabla. Una vez ms hago nfasis en que este sistema de coordenadas es algo complejo y preferira que cada persona indague un poco en las fuentes que dejare al final o en algunas que ellos consideren adecuadas para su mayor facilidad y entendimiento.
16
En la parte anterior del cdigo nicamente establecemos parmetros de las coordenadas en conde comenzaran a escribirse los datos. Es hasta esta parte en donde establecemos el tipo de letra a utilizar, el color y mediante un ciclo for hacemos que valla imprimiendo todos los datos hasta llegar al final de los datos de la tabla. Nuevamente inicializamos una variable (a) en cero, pero ahora nos servir para ir incrementando el nmero de pixeles y ajustar las coordenadas al campo correcto para que los datos queden correctamente ordenados. Dentro del ciclo for inicializamos la variable i que ser la que utilizaremos para ir intercalando los colores de las filas de la tabla y dar un tono agradable y sutil a la vista (dar formato). Podemos notar nuevamente que las imgenes se imprimen de una forma especial y nuevamente se les da un tamao especfico para todas, para que sin importar su tamao verdadero siempre se impriman a la escala deseada.
17
En esta parte del cdigo volvemos a establecer una conexin con la base de datos, indicamos que de esa base de datos consultaremos la tabla tabejem y mediante un ciclo while vamos tomando cada uno de los datos para guardarlos. Esta parte es muy importante y es en donde tena el error que haca que imprimiera solo un dato por hoja a partir de la segunda hoja. Este problema se solucion inicializando una variable i en 0, e incrementndola cada que se cumple un ciclo y comprobando mediante un if que no sobrepase los 10 registros (filas), si el if se cumple (sobrepasa los 10 registros), aade una pgina al documento PDF e inicializa la variable i en 0 nuevamente. De esta forma hice que cada hoja solo puede tener un mximo de 10 filas y me aseguro de que los datos se impriman uno detrs de otro sin dejar espacios. Al final se dibuja todos los productos restantes, se establece que se ha dibujado todo lo deseado y finalmente termina la conexin.
18
Una vez que se hayan seguido todos los pasos al pie de la letra y se tenga un resultado como el que muestro en la imagen, lo siguiente es comprobar que se han hecho bien las cosas mediante la ejecucin de la base de datos y las consultas en el navegador. Para realizar esto se deber abrir un navegador y escribir en la barra de direcciones la siguiente direccin en el siguiente formato: servidor/carpeta_contenedora_de_las_clases, es decir, en este caso se tiene que escribir localhost/ejemplo, ya que recordemos que la carpeta que creamos dentro de www y en donde colocamos todos los datos se llama ejemplo.
19
20
MARCO TEORICO
http://codegeando.blogspot.mx/2013/03/php-wampserver-definicion-instalacion-y.html http://www.genbeta.com/herramientas/sublime-text-un-sofisticado-editor-de-codigo-multiplataforma http://html-color-codes.info/codigos-de-colores-hexadecimales/ http://es.wikipedia.org/wiki/Fpdf http://www.fpdf.org/ http://www.fpdf.org/es/doc/index.php http://www.desarrolloweb.com/manuales/manual-fpdf.html http://www.taringa.net/posts/hazlo-tu-mismo/14488611/Crear-un-PDF-con-PHP-Libreria-FPDF.html
21