Mostrando entradas con la etiqueta programación. Mostrar todas las entradas

Generar imágenes QR con PHP usando qrlib.php

Vamos a generar imágenes QR en PHP de una manera sencilla utilizando qrlib.php. Lo haremos de una manera muy fácil, usando la función QRcode::png.

Lo primero, como siempre, es descargarnos la librería en este ENLACE. Una vez descargada, la descomprimimos y la añadimos a nuestro proyecto.

En el código php tenemos que incluir la ruta al fichero qrlib.php que está en la carpeta que hemos añadido. El código más básico para generar una imagen qr, teniendo como datos una url, es el siguiente:

include_once dirname(__FILE__)."/phpqrcode/qrlib.php";

// --- url
$url = "https://es.wikipedia.org";

QRcode::png($url);

A la función png le podemos pasar ciertos parámetros para cambiar la imagen del qr. Le podemos pasar una ruta para guardar la imagen, el tamaño de la imagen (ECC Level), los pixeles y el tamaño del frame. Los distintos valores para el tamaño de la imagen son los siguientes:

QR_ECLEVEL_L
QR_ECLEVEL_M
QR_ECLEVEL_Q
QR_ECLEVEL_H

El L es el más pequeño y el H es el más grande. Jugando con estos niveles y los pixeles podemos obtener la imagen más grande o más pequeña y con más resolución o menos.

Estos parámetros lo vemos con el siguiente código

include_once dirname(__FILE__)."/phpqrcode/qrlib.php";

// --- url
$url = "https://es.wikipedia.org";

QRcode::png($url,"temp/01.png",QR_ECLEVEL_L,3,1);

echo '<img src="temp/01.png"/>';

El 3 corresponde a los pixels y el 1 al frame (el frame es como un margen blanco en la imagen en todos los lados). En tmp se guarda la imagen:

Os voy a poner como se escribirian los datos para mandar un teléfono, sms, skype o email (la variable es $codigo, en los comentarios están las distintas formas del código para mandar teléfono, skype, etc):

include_once dirname(__FILE__)."/phpqrcode/qrlib.php";
// --- sms y telefono
//$codigo = "sms:568999666";
//$codigo = "tel:568999666";

// -- email
$email="sandritascs@gmail.com";
$subject="Test qr";
$body = "Comprobación del test qr";
$codigo="mailto:".$email."?subject=".urlencode($subject)."&body=".urlencode($body);

// --- skype
//$codigo = "skype:".urlencode("usuarioSkype")."?call";

// --- generar imagen
QRcode::png($codigo,"temp/01.png",QR_ECLEVEL_L,3,1);

echo '<img src="temp/01.png"/>';

En el video se puede ver una demostración del funcionamiento. Aquí teneis los ficheros del ejemplo del video junto con la librería --> DESCARGA

Tutorial Animaciones y efectos botones CSS3 - Entrega 2

En esta entrega de animaciones y efectos para botones con CSS3 os muestro otros 4 efectos para dar a vuestros botones. Podéis encontrar el código en el siguiente enlace:

Animaciones y Efectos - Entrega 2

El primer efecto consiste en que el botón se mueva hacia arriba, como si estuviese flotando (efecto float). El tipo de animación es una transición de transformación. Podemos ponerle una propiedad para el tiempo (transition-timing-function) para que se acelere al final, al principio, etc. Cuando pasamos el puntero por encima del botón (evento hover) lo que hacemos es mover el botón en el eje Y hacia arriba con un valor negativo (traslateY(-10px)).

El otro efecto es similar al anterior, lo que cambia es que en vez de moverse hacia arriba se mueve hacia abajo (down). Únicamente tenemos que cambiar el traslateY en el evento hover.

El tercer efecto es que cuando pasemos el puntero, aparezca una flecha al lado de nuestro botón. En este caso vamos a utilizar pseudo-elementos en css, en concreto :before. Con esto lo que hacemos es añadir contenido después del contenido original. Tenemos que utilizar la propiedad de css content.
El código es el siguiente:

Crearemos un triángulo y calculamos el centro con (left: calc(50%-10px);) y le daremos borde y color. Dependiendo de dónde queramos que salga el triángulo o flecha (top, bottom,right,left) tenemos que cambiar esas tres propiedades de css. Así por ejemplo si queremos que salga hacia arriba utilizariamos:

top: calc(50%-10px);

border-width: 0 10px 10px 10px;

Por último cuando es el evento hover lo que tenemos que hacer es mover este triángulo hacia afuera con traslateY. Dependiendo de donde pongamos la flecha se trasladará en un eje u otro y positivo o negativo.

El último efecto es rellenar el fondo del botón desde el centro gradualmente.
Vamos a crear un cuadrado (que al principio no se ve) y lo vamos a ir agrandando hasta que ocupe todo el fondo. La animación consiste en ir agrandando ese cuadrado hasta que ocupe las dimensiones del botón.

NOTA: no podemos utilizar estos dos últimos efectos, que utilizan pseudo-elementos, con un botón creado con la etiqueta input. Esto es debido a que input no es un contenedor, por lo que no va a funcionar el efecto.

Para saber más de pseudo-elementos en css:
http://librosweb.es/libro/css_avanzado/capitulo_3/pseudo_elementos.html

Reportes con JasperReports e iReport: pasar parámetros con Datasources sin conexión a una BBDD - Netbeans 8

En este post vamos a ver como se pasan parámetros desde java al reporte sin necesidad de una conexión a una BBDD, es decir, podemos pasar los parámetros que queramos.

Vamos a comenzar creando un proyecto nuevo (File/New Project) y una clase en java que utilizaremos para instanciar objetos ( botón derecho en el paquete y New/java Class) y así pasar los datos al datasource. Para usar de ejemplo, hemos creado la clase Asistentes.

public class Asistentes {

private Integer id;
private String nombre;
private String apellidos;
private String dni;

public Asistentes(){
}

public Asistentes(int id, String nombre, String apellidos, String dni) {
this.id = id;
this.nombre = nombre;
this.apellidos = apellidos;
this.dni = dni;
}

public int getId() {
return id;
}

public void setId(Integer id) {
this.id = id;
}

public String getApellidos() {
return apellidos;
}

public void setApellidos(String apellidos) {
this.apellidos = apellidos;
}

public String getDni() {
return dni;
}

public void setDni(String dni) {
this.dni = dni;
}

public String getNombre() {
return nombre;
}

public void setNombre(String nombre) {
this.nombre = nombre;
}

}

Esta clase tiene cuatro atributos, constructor por defecto y constructor parametrizado. También debemos incluir los getters and setters ya que los atributos son privados y necesitaremos asignar esos valores.

A continuación vamos a crear el reporte. Para ello botón derecho en el paquete y nuevo Empty report.

Para editar el reporte vamos a utilizar el programa de iReport, que previamente lo tenemos que tener instalado ( a parte del plugin de iReport para netbeans). Os lo podéis descargar del siguiente enlace:

DOWNLOAD IREPORT

En nuestro reporte vamos a asignar etiquetas para las columnas y para el nombre del reporte. Esto se hace con Static Text (Paleta que está a la derecha).

Para asignar los valores que van a ir rellenando las diferentes columnas tenemos que crear unas variables y unos campos. Estos campos se crean pinchando botón derecho en Fields/Agregar Field. Hay que asignarles el tipo de dato (java.lang.String, java.lang.Integer o el que sea), y debe de coincidir con el tipo de dato que le pasemos en el programa principal, en este caso con el tipo de datos de las variables de nuestra clase Asistentes.

Una vez creados todos, pinchamos y los arrastramos al reporte. Así quedaría el nuestro:

Muy bien, ahora hay que crear la clase para pasar estos datos. Esta clase tiene que implementar la clase JRDataSource, y tiene dos métodos que son obligatorios sobreescribir, el método next() y getFieldValue(JRField jrf). En el método next incrementará el contador y JasperReport sabrá cuantos Asistentes van a existir. El método getFieldValue asignará los valores a los Fields correspondientes.

A parte en esta clase vamos a crear una variable que será una lista de Asistentes y también un método para ir agregando cada asistente a la lista. La clase quedaría así:

public class AsistentesDataSource implements JRDataSource{

private List<Asistentes> listaAsistentes = new ArrayList<Asistentes>();
private int indiceParticipanteActual = -1;

@Override
public boolean next() throws JRException {
return ++indiceParticipanteActual < listaAsistentes.size();
}

public void addAsistente(Asistentes Asistente){

this.listaAsistentes.add(Asistente);

}

@Override
public Object getFieldValue(JRField jrf) throws JRException {
Object valor = null;

if ("id".equals(jrf.getName())){

valor = listaAsistentes.get(indiceParticipanteActual).getId();

}
else if ("nombre".equals(jrf.getName())){

valor = listaAsistentes.get(indiceParticipanteActual).getNombre();

}
else if ("apellidos".equals(jrf.getName())){

valor = listaAsistentes.get(indiceParticipanteActual).getApellidos();

}
else if ("dni".equals(jrf.getName())){
valor = listaAsistentes.get(indiceParticipanteActual).getDni();
}

return valor;
}

}

En el main() tenemos que inicializar jasperreport y la clase Asistentes. También crear los objetos y pasarlos al datasource además de crear el reporte. El método main() quedaría de la siguiente forma:

public static void main(String[] args) {
// TODO code application logic here

InputStream inputStream = null;
JasperPrint jasperPrint= null;
AsistentesDataSource datasource = new AsistentesDataSource();

for(int i = 0; i<=5; i++){

Asistentes asist;
asist = new Asistentes(i, "AsistenteNombre de "+i,"AsistenteApellidos de "+i, "Asistente dni de "+i);
datasource.addAsistente(asist);

}

try {
inputStream = new FileInputStream ("src/reportes/reporte01.jrxml");
} catch (FileNotFoundException ex) {
JOptionPane.showMessageDialog(null,"Error al leer el fichero de carga jasper report "+ex.getMessage());
}

try{
JasperDesign jasperDesign = JRXmlLoader.load(inputStream);
JasperReport jasperReport = JasperCompileManager.compileReport(jasperDesign);
jasperPrint = JasperFillManager.fillReport(jasperReport, null, datasource);

JasperExportManager.exportReportToPdfFile(jasperPrint, "src/reportes/reporte01.pdf");

}catch (JRException e){
JOptionPane.showMessageDialog(null,"Error al cargar fichero jrml jasper report "+e.getMessage());
}

}

Ejecutamos el proyecto ya tenemos nuestro reporte:

Hay problemas con la versión de iReport y Windows. Al ejecutar el proyecto nos puede aparecer dos tipos de errores.

Error uuid: no está permitido que el atributo uuid aparezca en el elemento jasperreport
Error cast: can not cast from Integer to String.

Para el error del uuid simplemente en la vista del xml del reporte hay que borrar todos los campos donde venga el uuid. Para el error del cast, hay que añadir en los <textFieldExpressions> la clase correspondiente (String, Integer,Float,...)

Podéis descargaros el proyecto en GitHub -> Reportes GitHub

Instalar jasperReport e IReport en Netbeans 8.0

A continuación os explico como instalar jasperReport e iReport en Netbeans 8.0. No sé si es la forma más correcta, pero es como a mi me ha funcionado, ya que las librerias de jasperReport me han dado un poco de dolor de cabeza porque no me funcionaban, pero al final lo conseguí.

Lo primero que hacemos es instalar iReport en netbeans 8.0. Este plugin en teoría no es necesario para utilizar jasperReport por separado. Este plugin nos facilita el diseño de las plantillas de jasperReport desde Netbeans.

Nos vamos a la página de netbeans y a la sección de plugins iReport y nos lo descargamos. No hay ninguno para la versión 8.0 de netbeans pero el último que hay que es el de la 7.4 nos sirve.

Una vez descargado nos vamos a Netbeans a Tools->Plugins (Herramientas->Plugins) y a la pestaña de Downloaded. Le damos al botón "AddPlugins" y buscamos la carpeta descomprimida del fichero que nos hemos descargado antes, el de iReport.

Con esto ya tenemos instalado el plugin y la librería principal de jasperReport. En Tools->Options (Herramientas->Opciones) podemos verlo.

Ahora necesitamos añadir a la librería otros ficheros y librerías para que nos funcione correctamente. Estos ficheros son una recopilación que he ido guardando cuando me investigué como instalar jasperreports, y son con los que me ha funcionado todo. En este enlace os lo podéis descargar:

LIBRERIAS PARA JASPERREPORT

Ahora nos vamos a las opciones de nuestro proyecto, botón derecho Properties, seleccionamos Libraries, pinchamos en la de jasperReports y le damos al botón Edit. Buscamos los ficheros que os he mencionado antes y adjuntamos todo y le damos a guardar.

Ahora vamos a hacer una prueba para ver si todo funciona. Lo primero de todo es crear un fichero jasper, que es como una plantilla. Con el plugin de iReport para Netbeans es fácil. En nuestro proyecto, en el paquete le damos a botón derecho y New. Elegimos Report y Empty Report. Se abren en Netbeans unas pantallas para diseñar nuestro fichero. Lo vamos a quedar vacío. En otro tutorial lo explicaré :).

Por último un pequeño código que lo que hace es leer este report (extensión jrxml) en un pdf. El código y el proyecto de prueba lo tengo en este enlace para que os lo podais descargar:

PROYECTO

Sandrita - Software engineer

Generar imágenes QR con PHP usando qrlib.php

Tutorial Animaciones y efectos botones CSS3 - Entrega 2

Reportes con JasperReports e iReport: pasar parámetros con Datasources sin conexión a una BBDD - Netbeans 8

Instalar jasperReport e IReport en Netbeans 8.0

Sígueme

Páginas

Archivo del blog

Popular Posts

Vistas de página en total

Sandrita - Software engineer

Generar imágenes QR con PHP usando qrlib.php

Tutorial Animaciones y efectos botones CSS3 - Entrega 2

Reportes con JasperReports e iReport: pasar parámetros con Datasources sin conexión a una BBDD - Netbeans 8

Instalar jasperReport e IReport en Netbeans 8.0

Sígueme

Páginas

Archivo del blog

Popular Posts

Vistas de página en total

Suscribirse a Sandritascs