Sign in Join
Wiki copytemporary

LazReport Tutorial/es: what changed

Revision 1 to 2. Removed lines have a minus sign; added lines have a plus sign.

OldNewLine
11## Descripción
22
33Esta página comenzó como una traducción de un escrito en Portugés [[LazReport Tutorial/pt|Tutorial de LazReport]] (el cual a su vez parece una traducción de un documento en Francés). Fué actualizado para Lazreport (en vez de para FastReport) para Lazarus (en lugar de para Delphi), utilizando T*Connection en lugar de una tabla de DBase.
44
55## Comenzando con LazReport
66
77Vamos a utilizar una base de datos de demo que provee Delphi (DBDEMOS). Necesitas crear una nueva aplicación con un formulario principal *Form1*.
88
99Aquí se asume que se tiene la base de datos establecida tal como se especifica en [[SQLdb Tutorial0]]. En caso contrario, por favor realiza dicho paso primero.
1010
1111### Estableciendo tu formulario (form)
1212
1313Sitúa los siguientes componentes en el formulario principal:
1414
1515- Un T*Connection, e.g. TIBConnection:
1616 - DatabaseName := tu base de datos, e.g. C:\Program Files\Firebird\Firebird_2_5\examples\empbuild\EMPLOYEE.FDB
1717 - Nombre de usurio(UserName), contraseña (Password), nombre de equipo (HostName): apropiadamente (e.g. SYSDBA,password,\<none\> para Firebird embebido)
1818 - Transaction: TSQLTransaction1
1919- TSQLTransaction
2020- TSQLQuery:
2121 - Database := IBConnection1
2222 - Active: true
2323 - SQL: SELECT * FROM employee
2424- TDataSource
2525 - DataSource1.DataSet := SQLQuery1
2626- TfrDBDataSet
2727 - frDbDataSet.DataSource := DataSource1
2828- TfrReport
2929- TfrDesigner
3030- 2 TButton
3131- Button1.Caption := 'Edición'
3232- Button2.Caption := 'Vista previa'
3333
3434Esto dará el resultado siguiente:
3535
3636<img src="lazreptut01.png" title="lazreptut01.png" width="580" alt="lazreptut01.png" /> Haz Doble-click en el icono **TfrReport** (or right-click, Design Report) para traer al frente el diseñador de reportes:
3737
38-<figure>
3938<img src="lazreptut01b.png" title="lazreptut01b.png" width="950" />
40-<figcaption>lazreptut01b.png</figcaption>
41-</figure>
4239
4340### Estableciendo variables
4441
4542LazReport permite enlazar nombres de variables a bases de datos o valores del sistema, evitando así a los usuarios finales tener que descifrar nombres de campo crípticos. En nuestro ejemplo vamos a crear unas variables para nuestros campos de la base de datos FIRST_NAME, LAST_NAME etc.
4643
4744En el menú de ficheros, haz click en **Variables list**. Ahora se obtiene una descripción de las variables definidas:
4845
49-<figure>
5046<img src="lazreptutvariableseditor.png" title="lazreptutvariableseditor.png" width="700" />
51-<figcaption>lazreptutvariableseditor.png</figcaption>
52-</figure>
5347
5448Pulsa en el botón **Variables** en orden a definir algunas variables. Escribe el contenido de acuerdo a la siguiente imagen. "Demo Variables" representa una categoría y las otras entradas (campos xxx) representan variables. Para diferenciar ambas, las variables comienzan con un espacio.
5549
5650**Nota**. La distinción entre variables y categorías de variables mediante la anteposición de un espacio, es única y exclusivamente en éste formulario (**Variables List**). En todo otro lugar (Diseñador de reportes, código fuente y scripts), la variable debe invocada sin espacios.
5751
58-<figure>
5952<img src="lazreptutdefinevariables.png" title="lazreptutdefinevariables.png" width="700" />
60-<figcaption>lazreptutdefinevariables.png</figcaption>
61-</figure>
6253
6354Finalmente haz click en OK para confirmar tus entradas, y entonces verás esto:
6455
65-<figure>
66-<img src="lazreptutvariablesdefined.png" title="lazreptutvariablesdefined.png" />
67-<figcaption>lazreptutvariablesdefined.png</figcaption>
68-</figure>
56+![](/wiki-images/f/ff/Lazreptutvariablesdefined.png)
6957
7058Como puedes ver, la categoría que hemos definido se muestra en el ComboBox above de las variables. Cada variable debe enlazarse con su campo correspondiente. Para hacer esto, selecciona la variable y a continuación el campo. Realizar esto para todas las variables; el pantallazo muestra el enlace para Hire date:
7159
72-<figure>
7360<img src="lazreptutvarhiredatetofield.png" title="lazreptutvarhiredatetofield.png" width="700" />
74-<figcaption>lazreptutvarhiredatetofield.png</figcaption>
75-</figure>
7661
7762### Objetos y bandas
7863
7964Después de cerrar el editor de variables volvemos a nuestro diseñador de reporters. Habrás notado que aparece un pequeño número de objetos en la barra de la izquierda de la superficie de reporter. Estos son:
8065
8166- El icono del puntero del ratón.
8267- El objeto rectángulo.
8368- Banda.
8469- Objeto picture.
8570- Subreport
8671- Dibujar líneas.
8772- Insertar objeto de código de barras (barcode).
8873
89-<figure>
9074<img src="lazreptut01b.png" title="lazreptut01b.png" width="950" />
91-<figcaption>lazreptut01b.png</figcaption>
92-</figure>
9375
9476Haz Click en el icono de banda, ve a la superficie del report y haz click en el para depositar el objeto banda.
9577
96-<figure>
97-<img src="lazreptutinsertnewband.png" title="lazreptutinsertnewband.png" />
98-<figcaption>lazreptutinsertnewband.png</figcaption>
99-</figure>
78+![](/wiki-images/2/29/Lazreptutinsertnewband.png)
10079
10180Debes hacer click en el tipo de banda que necesitas crear. Selecciona **Report title** y haz click en OK.
10281
10382| Tipo de banda | Uso |
10483|----|----|
10584| Report title | Muestra solamente la primera página |
10685| Report summary | Mustra solamente la última página |
10786| Page header | Muestra al comienzo de cada página |
10887| Page footer | Muestra al final de cada página |
10988| Master header | Shown at the beginning of the first detail band/level |
11089| Master data | First detail level data; repeated for each record in dataset |
11190| Master footer | Shown at the end of the first detail band/level |
11291| Detail header | Shown at the beginning of the second detail band/level |
11392| Detail data | Second detail level data |
11493| Detail footer | Shown at the end of the second detail band/level |
11594| Subdetail header | Shown at the beginning of the third detail band/level |
11695| Subdetail data | Third detail level data |
11796| Subdetail footer | Shown at the end of the third detail band/level |
11897| Overlay | Shown once on each page lower layer |
11998| Column header | Muestra al principio de cada columna |
12099| Column footer | Muestra al fondo de cada columna |
121100| Group header | Shown at the top of every group |
122101| Group footer | Muestra al fondo de cada grupo |
123102| Cross header | Shown at the top of cross tables/pivot tables |
124103| Cross data | Shows cross tables/pivot table data |
125104| Cross footer | Shown at the bottom of cross tables/pivot tables |
126105
127106### Titulo del reporte
128107
129108En la banda del editor de reportes, añade un rectángulo. Aparecerá el editor de texto. En la primera línea se debe indicar el título del reporte, añade un rectángulo.
130109
131110En la segunda se necesita añadir la fecha y la hora. Ambas se obtienen haciendo click en **Variable** y a continuación en Category **Other**, seguido de un doble click en la variable deseada (una vez que te has familiarizado con las variables puedes también teclearlas). Ahora tenemos:
132111
133-<figure>
134-<img src="lazreptutreporttitle.png" title="lazreptutreporttitle.png" />
135-<figcaption>lazreptutreporttitle.png</figcaption>
136-</figure>
112+![](/wiki-images/a/ad/Lazreptutreporttitle.png)
137113
138114Haz Click en OK para salir del editor y a continuación ajusta el rectángulo del título al tamaño deseado. Escoge un color para el fondo con el pulsadorC *Bucket Fill* de la barra de utilidades.
139115
140116### El evento principal: mostrando datos en la banda de datos maestra
141117
142118Vamos a insertar una banda de datos maestra. Lazreport pregunta por una fuente de datos; escoge **frDBDataSet1**, para nuestro ejemplo. La banda maestra se repetirá para cada registro de la fuente de datos. Puedes hacer doble click posteriormente en la banda si se necesita cambiar dicha fuente de datos.
143119
144-<figure>
145-<img src="lazreptutbanddatasource.png" title="lazreptutbanddatasource.png" />
146-<figcaption>lazreptutbanddatasource.png</figcaption>
147-</figure>
120+![](/wiki-images/b/b7/Lazreptutbanddatasource.png)
148121
149122En la mitad izquierda de la banda insertamos un rectángulo y hacemos un doble click. Aparece el editor de texto que ya nos resulta familiar.
150123
151124Ahora vamos a añadir varios campos en un rectángulo. En caso necesario se puede utilizar un rectángulo por campo para aplicar diferentes formatos etc.
152125
153126La primera línea **Name** \[Full name field\] se obtiene escribiendo Name y a continuación, con el pulsador **Variable**, entrar la variable \[Field Name\]. Alternativamente, tal como se indicó antes, se puede escribir directamente el texto resultante.
154127
155128La siguiente línea **Salary** \[Salary field\] se escribe de manera similar.
156129
157130La tercera línea - **Salary divided by job grade** \[\[Salary field\]/\[Job grade field\]\] - se realiza de igual modo. Esto muestra que se pueden realizar cálculos con los campos que tenemos en la fuente de datos. Fíjate en el conjunto extra de corchetes alrrededor del cálculo. Como puedes intuir, no solamente se pueden utilizar las variables listadas a través del pulsador **Variable** , sino también las de los campos de la base de datos a través de **DB Field**.
158131
159-<figure>
160-<img src="lazreptutmasterdata.png" title=" center" />
161-<figcaption> center</figcaption>
162-</figure>
132+![](/wiki-images/6/6a/Lazreptutmasterdata.png)
163133
164134Puedes utilizar todo tipo de operadores y funciones en los cálculos; ver [[LazReport Documentation|LazReport Documentation#Documentation]] para una descripción.
165135
166136#### Formateando la salida
167137
168138Se puede controlar el modo en que se muestra el texto en los rectángulos.
169139
170140Añadamos primero un nuevo rectángulo con la variable *Hire date field*.
171141
172142En el editor de variables vamos a establecer un formato. Un formato es válido para todas las variables de un rectángulo/objeto. Para mostrar el editor de formato, hacemos doble click en un rectángulo para obtener el **editor de texto**, a continuación hacemos click en el pulsador de formato *Format*.
173143
174144Establezcamos el formato fecha (date) que se necesita aquí:
175145
176-<figure>
177-<img src="lazreptutformattingdate.png" title=" center" />
178-<figcaption> center</figcaption>
179-</figure>
146+![](/wiki-images/1/12/Lazreptutformattingdate.png)
180147
181148El primer ComboBox indica el tipo de dato (texto, numérico, fecha, hora, lógico/booleano). El segundo nos permite seleccionar el formato presenteThe second lets .... con algunas restricciones obvias:
182149
183150- El tipo Texto no permite cualquier tipo de formato de número.
184151
185152- El tipo número requiere un número decimal con una coma (**Por favor verifica esto y ajusta el artículo si es necesario. ¿es esto específico del pais?**). A excepción de para texto y tipos lógicos, se puede utiliar el mismo tipo de formato de cadenas que se utilizan en Lazarus.
186153
187154Otras opciones de formato se encuentran presentes en el pulsador debajo del menú (e.g (e.g. negrita (bold), italica (italic), resaltada (Highlighting) ).
188155
189156El formato resaltado (Highlighting) resulta muy útil para enfatizar datos. Se puede especificar una condición que determine cuando se aplica dicho resaltado.
190157
191158Para ello, utiliza el valor del keyword para indicar el valor de la variable. Aquí es el resaltado para **all hire dates** posteriores a 1989. Debido a que **Hire date** es un campo TDateTime (el cual es internamente un float), I cheated por utilizar el valor tipo flot de January 1st, 1990 el cual es 32874. Por defecto highlighter es simplemente el formato negrita sobre fondo blanco. Se pueden establecer estos parámetros para un área haciendo click en el pulsador de Highlight.
192159
193-<figure>
194-<img src="lazreptutconditionalhighlight.png" title=" center" />
195-<figcaption> center</figcaption>
196-</figure>
160+![](/wiki-images/d/df/Lazreptutconditionalhighlight.png)
197161
198162#### Una imagen es mejor que ...
199163
200164Si no lo has hecho todavía, necesitaremos añadir un campo PHOTO a nuestro test de bases de datos; utilizando una sentencia SQL como esta (nota: desafortunadamente las distintas bases de datos utilizan sintaxis diferentes; BLOB puede ser CLOB,IMAGE,OLE...):
201165
202166``` sql
203167ALTER TABLE EMPLOYEE ADD PHOTO BLOB;
204168```
205169
206170Ahora añadamos algún test de datos - este ejemplo utiliza ficheros jpg - dentro del campo PHOTO por media de tu herramienta de bases de datos favorita. Nota: este es el modo en que trabaja DBImage de Delphi: justamente blobs binarios con datos de imagen. Por defecto Lazarus DBImage es más flexible y almacena la extensión del fichero antes de los datos de la imagen, permitiendo utilizar diferentes formatos de fichero. En aras de la simplicidad utilizaremos la modalidad de Delphi.
207171
208172Ahora debemos indicar al reporte que debe tratar todos los datos de imagen como ficheros binarios en formato jpg. Haz Click en *frReport1*, ve al inspector de objetos, eventos, y comienza un procedimienton OnDBImageReader:
209173
210174```delphi
211175procedure TForm1.frReport1DBImageRead(Sender: TObject; S: TStream;
212176 var GraphExt: string);
213177begin
214178 // Fuerza TDBImage a ser compatible con las características de Delphi: únicamente admite un tipo de fichero, e.g. jpg
215179 // esto significa que los BLOBs de la base de datos deben ser ficheros binarios de formato jpg sin ningún otro dato.
216180 GraphExt:='jpg';
217181end;
218182```
219183
220184In File\>Variables List, añade el campo SQLQuery1.PHOTO como variable de campo Photo, de manera similar a como se hizo antes. En caso de que no se visualice el campo, puede que sea necesario establecer la SQLQuery del formulario a inactivo y de nuevo a activo para refrescar el listado de columnas. .
221185
222186Click on the Insert image... icon on the left of the window; now click on the right side of the band to drop the image control. A Picture editor shows up:
223187
224-<figure>
225-<img src="lazreptutpictureeditor.png" title=" center" />
226-<figcaption> center</figcaption>
227-</figure>
188+![](/wiki-images/4/48/Lazreptutpictureeditor.png)
228189
229190Si necesitas que se muestre siempre la misma imagen, simplemente necesitas hacer click Load ... (o hacer doble click en el control de imagen) y escoger tu imagen.
230191
231192However, presionemos el botón Memo e insertemos una variable Photo:
232193
233-<figure>
234-<img src="lazreptutphotofield.png" title=" center" />
235-<figcaption> center</figcaption>
236-</figure>
194+![](/wiki-images/5/56/Lazreptutphotofield.png)
237195
238196Esto pone la imagen dentro del objeto asociado al campo de datos. Presiona OK cuando necesites retornar al diseñador de reportes.
239197
240198Ajusta la altura y el ancho a tus necesidades.
241199
242200Además puedes presionar F11 para mostrar el Inspector de Objetos, el cual permite editar más si se necesita:
243201
244-<figure>
245-<img src="lazreptutobjectinspector.png" title=" center" />
246-<figcaption> center</figcaption>
247-</figure>
202+![](/wiki-images/b/b1/Lazreptutobjectinspector.png)
248203
249204Cierra el editor de reportes y salva la definición del reporte (con el mismo nombre, **lazreporttutorial.lrf**).
250205
251206Si vas a File\>Preview, verás que tu reporte incluye las imágenes.
252207
253208Cierra el editor de reportes y salva las defniciones del reporte como **lazreporttutorial.lrf**.
254209
255210### Detail data
256211
257212To do: show how to use the detail part of master/detail. see e.g. sample in components/lazreport/samples/editor directory; see the button title "Master-Detail" **Please write me.**
258213
259214### Loading the report from the form
260215
261216Now let's write the code required to load and view or edit our report. To this add the following code to the project:
262217
263218```delphi
264219TForm1.Button2Click(Sender procedure: TObject);
265220begin
266221 frReport1.LoadFromFile('lazreporttutorial.lrf');
267222 frReport1.ShowReport;
268223end;
269224TForm1.ButtonClick(Sender procedure: TObject);
270225begin
271226 frReport1.LoadFromFile('lazreporttutorial.lrf');
272227 frReport1.DesignReport;
273228end;
274229```
275230
276231You have a preview option that gives end users a way to modify the report without changing the basic application.
277232
278233### Imprimiendo
279234
280235Ahora vamos a ir añadiendo características a nuestro ejemplo básico:
281236
282237Añadimos un componente TButton con Caption := Print...' y un diálogo TPrintDialog. Detrás de la escena se debe añadir por parte del IDE una dependencia del paquete **Printer4Lazarus** por lo que hay que asegurarse de tener este paquete instalado. Add a TButton component with Caption := 'Print...', and a TPrintDialog. Behind the scenes, a project dependency on the
283238
284239Finalmente tendremos esto:
285240
286-<figure>
287-<img src="lazreptutformwithprintbutton.png" title=" center" />
288-<figcaption> center</figcaption>
289-</figure>
241+![](/wiki-images/e/e3/Lazreptutformwithprintbutton.png)
290242
291243Ahora añadimos la unidad **printers** a la claúsula uses del formulario.
292244
293245Pon el siguiente código en el evento OnClick del pulsador **Print**:
294246
295247```delphi
296248procedure TForm1.Button3Click(Sender: TObject);
297249var
298250 FromPage, ToPage, NumberCopies: Integer;
299251 ind: Integer;
300252 Collap: Boolean;
301253begin
302254 // Carga la definición del reporte desde el directorio de la aplicación
303255 AppDirectory:=ExtractFilePath(ParamStr(0));
304256 frReport1.LoadFromFile('lazreporttutorial.lrf');
305257 // Necesitamos mantener la pista de que impresora está seleccionada originalmente para chequear cambios por parte del usuario
306258 ind:= Printer.PrinterIndex;
307259 // Prepara el reporte y para si obtenemos un error ya que continuar no tendría sentido en esta situación.
308260 if not frReport1.PrepareReport then Exit;
309261 // Establecemos un diálogo con información de valores por defecto que el usuario posteriormente puede cambiar.
310262 with PrintDialog1 do
311263 begin
312264 Options:=[poPageNums ]; // permite seleccionar número/s de página/s
313265 Copies:=1;
314266 Collate:=true; // copias ordenadas
315267 FromPage:=1; // página de comienzo
316268 ToPage:=frReport1.EMFPages.Count; // página final
317269 MaxPage:=frReport1.EMFPages.Count; // máximo número de páginas permitidas.
318270 if Execute then // mostrar diálogo; si satisfactorio, procesa la feedback del usuario
319271 begin
320272 if (Printer.PrinterIndex <> ind ) // verify if selected printer has changed
321273 or frReport1.CanRebuild // ... solamente tiene sentido si se puede reformatear el reporte
322274 or frReport1.ChangePrinter(ind, Printer.PrinterIndex) //... entonces cambia de impresora
323275 then
324276 frReport1.PrepareReport //... y reformatear para una nueva impresora
325277 else
326278 exit; // we couldn't honour the printer change
327279
328280 if PrintDialog1.PrintRange = prPageNums then // user made page range selection
329281 begin
330282 FromPage:=PrintDialog1.FromPage; // primera página
331283 ToPage:=PrintDialog1.ToPage; // última página
332284 end;
333285 NumberCopies:=PrintDialog1.Copies; // Número de copias
334286 // Imprime el reporte utilizando las páginas solicitadas & número de copias.
335287 frReport1.PrintPreparedReport(inttostr(FromPage)+'-'+inttostr(ToPage), NumberCopies);
336288 end;
337289 end;
338290end;
339291```
340292
341293Es un poco largo, pero necesario, puedes crear un descendiente de TfrReport con un método o clase de impresión fácil, crear un procedimiento PrintReport (Report: string) para cargar el reporte e imprimir.
342294
343295cuando hacemos doble click en **frReport1**, obtenemos ein the report designer File\>Page Options menu you get this:
344296
345297Select paper size:
346298
347-<figure>
348-<img src="lazreptutpapersize.png" title=" center" />
349-<figcaption> center</figcaption>
350-</figure>
299+![](/wiki-images/9/90/Lazreptutpapersize.png)
351300
352301Escoge los márgenes sque mejor se adapten a tu necesidad, número de columnas y espacio entre ellas, layout order, etc.
353302
354-<figure>
355-<img src="lazreptutprintoptions.png" title=" center" />
356-<figcaption> center</figcaption>
357-</figure>
303+![](/wiki-images/4/4a/Lazreptutprintoptions.png)
358304
359305### Opciones de reporte
360306
361307Via File\>Report Options you can set a default printer that will be used for the report (using the "Select when report loaded" checkbox).
362308
363309Si necesitas incluir el número total de páginas con el número número de págica en cada página entonces necesitas seleccionar **Two-pass report** (lo cual indica a Lazreport que genere el reporte una segunda vez, insertando el número total de páginas en la segunda pasada).
364310
365-<figure>
366-<img src="lazreptutreportoptions.png" title="lazreptutreportoptions.png" />
367-<figcaption>lazreptutreportoptions.png</figcaption>
368-</figure>
311+![](/wiki-images/2/2e/Lazreptutreportoptions.png)
369312
370313En la solapa **Other**, se pueden rellenar metadatos, tal como se muestra en el siguiente pantallazo:
371314
372-<figure>
373-<img src="lazreptutreportoptionsother.png" title="lazreptutreportoptionsother.png" />
374-<figcaption>lazreptutreportoptionsother.png</figcaption>
375-</figure>
315+![](/wiki-images/f/f6/Lazreptutreportoptionsother.png)
376316
377317### Variables de propósito general
378318
379319Ahora añadimos al ejemplo algunas variables del reporte no relacionadas con la base de datos. Permitirán por ejemplo mostrar diferentes nombres de acuerdo al contexto.
380320
381321Para hacer esto, abre el editor de reportes y selecciona el menú de fichero y la variable **List**. Añade una categoría **Test** y una variable **test1** del mismo modo que hicimos previamente (con un espacio antes del nombre de la variable):
382322
383-<figure>
384-<img src="lazreptutvariableseditortestvar.png" title=" center" />
385-<figcaption> center</figcaption>
386-</figure>
323+![](/wiki-images/8/8d/Lazreptutvariableseditortestvar.png)
387324
388325La única diferencia es que no tendrás que seleccionar un valor de campo, pero deja None (el valor por defecto):
389326
390-<figure>
391-<img src="lazreptutvariabletest.png" title=" center" />
392-<figcaption> center</figcaption>
393-</figure>
327+![](/wiki-images/2/20/Lazreptutvariabletest.png)
394328
395329Retorna a Lazarus (no olvides salvar el reporte, en caso necesario) y establece el evento **OnGetValue'' del componente**frReport1''' añadiendo el siguiente código:
396330
397331```delphi
398332procedure TForm1.frReport1GetValue(const ParName: String; var ParValue: Variant
399333 );
400334begin
401335 if ParName='test1' then
402336 ParValue:='hola, soy el valor pasado a la variable test1';
403337end;
404338```
405339
406340Se pueden pasar cadenas, fechas, números, de forma directa o mediante variables o constantes, por ejemplo es válido pasar edit1.Text o llamar a una función inclusive.
407341
408342Alternativamente se puede además pasar el valor directamente a la variable utilizando el siguiente código:
409343
410344```delphi
411345procedure TForm1.Button1Click(Sender:TObject);
412346begin
413347 frReport1.Values.FindVariable('test').Field := QuotedStr('test1');
414348 frReport1.ShowReport;
415349end;
416350```
417351
418352## See also
419353
420354- [[LazReport Tutorial/pt|Tutorial de LazReport]] Version used as a basis for this translation.
421355- [[LazReport Documentation]]
422356
423357---
424358*From the Free Pascal wiki, page "LazReport Tutorial/es", as it stood on 2020-01-29 after a change by Skalogryz, out of the wiki's dump of 2024-05-26. Copyright stays with the author who wrote it, according to the old wiki's [[Licensing]] page. If you have concerns about this material, [message the admin](/wiki-contact).*
425359Category: LazReport/es
426360Category: Lazarus/es
427361Category: Tutorials/es

Back to history