Image Strip Options
Contents
Overview
ImageStrip Sections display a horizontal 'strip' of data-bound images. They can optionally include a text notes panel.
The Lianja Tablet Web UI Demo App (example_webapp1) includes an ImageStrip Section:
In web/mobile Apps, the images are touch-friendly - here calling the Double Click event delegate.
Which uses the Lianja.showDialogPanel() method to display the information in a slide-in panel.
Lianja.showDialogPanel("EMPLOYEE INFORMATION", "lib:/showdialogpanel_employee.rsp?employeeid={employees.employeeid}", 500);
Touch or click on the text notes panel to edit...
In a slide-in dialog panel:
example_imagestrip App
From v7.1, the Lianja App Builder distribution includes the example_imagestrip App. This demonstrates the new Image Viewer functionality.
When the Image viewer visible attribute is set to True, clicking on an image in the ImageStrip displays that image in the Image viewer.
Clicking (or touching) the details panel now slides in the editor - either Text or HTML depending on the Image notes format attribute setting.
Clicking (or touching) the '-' button in the section header allows images to be deleted.
Clicking (or touching) the '+' button in the section header or the big '+' after the last ImageStrip image allows images to be added.
This provides you with a powerful No-Code section in Lianja 7.1
You can of course customize its operation using Low-Code delegates e.g. handle double click of an image.
See Also
Image Strip Section Attributes
Image notes visible
Show the image notes panel (True | False)
Image notes editable
Allow the image notes to be edited (True | False). From v6.0.
Image notes format
The format of the image notes to be edited (Text | Html). From v6.0.
Image notes caption to display
Image notes data source
Image notes data source (column name)
Image notes backcolor
Image notes background color
- See Colors
Image notes forecolor
Image notes foreground color
- See Colors
Image viewer visible
Show the image viewer panel (True | False). From v7.1.
- See the example_imagestrip App as shown above.