Ya que tenemos la funcionalidad de subir imágenes en el post anterior, acá vamos a hacer que se generen en PDF los gafetes/credenciales/identificaciones de los registrados en la base de datos
Acá les dejo el enlace de descarga a googleDrive del directorio completo de trabajo de este ejemplo (solo salta la publicidad y listo)
El diseño consta de lo siguiente:
Bueno, para concluir, se colocarán en las respectivas posiciones las celdas que contendrán la información que se recibe de la base de datos.
Para ello necesitaremos lo siguiente: haremos la llamada a la base de datos la cual nos regresará un arreglo asociativo con la información, en este caso de ejemplo, los datos de una persona. También requerimos otro arreglo asociativo de coordenadas (x, y). Una vez teniendo ambos arreglos, se pondrán en un ciclo y se extraerá un par de coordenadas que se le pasarán al método SetXY que colocará la celda en la posición que se asigne, y a su vez, se extraerá un dato de la persona y se la pasará al método Cell.
El arreglo de coordenadas, en este caso se me facilitó porque usé para colocar la información dentro del formato, líneas con el método Line. Cabe mencionar que el primer parámetro que requiere el método Line es donde comienza la línea. Así que, para saber dónde iría cada celda solo me fijé en este primer parámetro y aumenté 2 unidades a la derecha (coordenada X) y una unidad hacia arriba (coordenada Y) y este par es el que coloqué en el arreglo de coordenadas. Por ejemplo: Line(40, 50, 70, 50); <– para colocar la celda sería: SetXY(42, 49) Cell (parámetros…)
Quedará más claro viendo el código 🙂 Espero que los comentarios del código ayuden 😀
Como lo he dicho a varios de mis lectores, en definitiva, diseñar un formato lleva su tiempo. Se ha de diseñar primeramente un bosquejo a lápiz y papel para tener una idea general del diseño y definir cuáles métodos se han de usar en el código y lograr el diseño requerido.
En esta ocasión les presento un formato con un diseño sencillo el cual utiliza un margen decorativo y dos imágenes que se colocan con el método Image. Hago uso del método Line que dibuja una línea recta y celdas sin borde.
Evidentemente un diseño será tan complejo como se requiera, acá el punto es solo demostrar que los datos que obtengamos también se pueden colocar en posiciones distintas y no solo en tablas y reportes.
La carpeta de trabajo contendrá: index.php, PDF.php, carpeta de la librería y 3 imágenes. En este ejemplo el archivo PDF.php no contendrá ningún código, simplemente pondremos la clase extendida PDF de FPDF para poder usar en index.php objetos de FPDF.
Veamos el código y la salida:
Este tutorial nace de una sugerencia de un lector del blog 🙂 Me comentaba que ya podía hacer tablas y reportes como el de las entradas anteriores. El detalle es que están en una posición única. Se encontró con que ahora tenía que hacer un formato y llenarlo con la información extraída de la base de datos. Ya que es un formato, los campos con la información deben estar en ciertas posicione dentro de la hoja.
La siguiente imagen muestra el bosquejo de un formato; los recuadros morados son precisamente la información que se extrae de la base de datos y que se han de acomodar en la hoja. Notar que ahora ya no están mostrados en una tabla, sino que ahora, están esparcidos en diferentes posiciones.
Bosquejo de un formato
Bueno, esta entrada es sobre la anécdota con la que recuerdo siempre mi primer acercamiento al mundo de la computadoras e informática. A su vez, siempre que tengo ‘ratos libres’ me pongo a hacer esta figura hecha solo con líneas rectas.
Aquel día cuando la primera computadora PC llegó a casa fue un momento especial; por mi mente solo pasaba: Juegos, juegos y más juegos 😀 En mi corta edad creía que la computadora era solo para tener miles de juegos y escribir tareas aburridas en word xD
Cuando la encendí el primer día me estuve varias horas en un ‘programilla’ llamado paint, ese fue mi primer contacto informático. Hice diferentes figuras y las rellené de varios colores, pinté a mano alzada, borraba con la goma, me acercaba con la lupa, en fin. Después de las largas horas que se me habían pasado en estar ahí, las ideas se venía abajo pero…
Ahora toca el turno a hacer un reporte dinámicamente extrayendo de la base de datos mediante un SELECT.
Aunque pareciera más «difícil» por el hecho de obtener los datos de la base de datos… no lo es :). De hecho es tan sencillo como retornar un array asociativo, como el de los ejemplos anteriores, en la clase dedicada a la base de datos y listo.
Los métodos que se han usado antes, son exactamente los mismos, acá lo único que se agregará, son los dos archivos necesarios para la comunicación con la base de datos y mediante el método donde se realice el SELECT, devuelva un arreglo asociativo.
En el index.php se creará un objeto de la clase myDBC.php y en una variable se guardará el array asociativa que regresa el método que hace el SELECT, es decir, el método seleccionar_datos( ). Después, esta variable se le pasa al método tablaHorizontal( ).
En la librería FPDF como tal, no existen las celdas con borde redondeado pero gracias a la misma comunidad que comparte sus códigos, hubo quien modificó el método Rect (que dibuja un rectángulo) para que se generará rectángulos con borde redondeado. En el futuro habrá quien modifique y comparta el código para que el mismo método Cell tenga como opción de parámetro que la celda tenga borde redondeado.
Ya que no existe existe (aún) la propiedad que necesitamos, pero tenemos lo antes mencionado… ¡a darle! 😀 Cabe mencionar que la librería FPDF permite traslapar posiciones (x, y) y con esto, poner en la misma posición varios métodos.
En esta ocasión lo que haremos en términos generales es lo siguiente: crear la tabla como la hemos venido haciendo pero sin borde y, en cada paso del ciclo para formar los tres campos, agregaremos un solo rectángulo redondeado del tamaño de los mismos. Y en este caso, el relleno de celda lo tendrán los rectángulos y no las celdas.
Veamos el código, espero que los comentarios sean explicativos xD Pero sino, dejen su comentario 🙂
Ahora bien, ¿qué pasa si en la cabecera, un título tiene más caracteres o uno de nuestros datos y por lo tanto no quepan en el ancho de celda que escogimos? pasa esto:
Datos que sobrepasan la celda
Para solucionar esto, colocaremos en nuestra clase de PDF.php una serie de métodos que ajustan el texto a la celda. Este código es proporcionado por la propia comunidad de fpdf.org en la opción de su página principal llamada «Scripts».
Al final de los métodos que ya tenemos, colocaremos este código. El método que usaremos se llama CellFitSpace( ) el cual sustituirá a Cell( ). El código de PDF.php es el siguiente:
En esta serie de mini entradas, les presento cómo hacer tablas, empezando por lo más básico e ir agregando código para darle más estilo y funcionalidad a nuestras tablas. Siempre me ha gustado empezar desde un ejemplo concreto y simple e ir escalando el ejemplo; con esto, podemos conocer cómo funciona desde el principio, después podemos agregar funciones que vayan encapsulando código con nuevas funcionalidades.
La tablas en FPDF se basan en repetir en un ciclo el método Cell( ) tantas veces como sea necesario. Además algo importante es que para que la tabla sea vertical u horizontal, basta cambiar un parámetro del método Cell( ) para que cada celda se coloque una debajo de la otra (vertical) o que cada celda se posicione a la derecha de la anterior (horizontal).
El método que usaremos frecuentemente es Cell( ), así que te recomiendo ver los parámetros que recibe este método. Para más detalle de éstos, puedes verlos en la opción de ‘Manual’ en la página oficial de fpdf.org. El único parámetro para que la tabla sea vertical u horizontal, será cambiando el parámetro posición actual, ya sea 0 ó 2 🙂
Cell(ancho, alto, texto, borde, posición actual, alineación del texto)
Durante el proceso de diseño de tablas, reportes, formatos, texto y demás elementos dentro de un documento PDF generado con la librería FPDF, se llega a un punto en el que necesitas colocar dichos elementos en ciertas posiciones de la hoja.
Cuando yo inicié a usar esta librería, no tenía idea cuáles valores poner para la pareja (X, Y), en cierto métodos que requieren está información o para asignar una posición que necesite una celda en particular.
En base a este ejercicio totalmente estático les muestro de una forma muy colorida ^__^ varias posiciones de la hoja de tamaño A4 (conocida en México como ‘tamaño carta’), siendo ésta la más común para documentos.
Te invito a mi sitio web donde está mi CV en línea así como los servicios freelance que puedo ofrecerte huguidugui.com
Así lo hice... 