Gallery with Overlaid Text Page


GallerywitOverlaidText is similar to Gallery page in terms of record being repeated in both directions i.e. horizontal and vertical. However it is supported only for Modern styles, if Classic styles are selected, it will be disabled. If an application is created using Classic styles, then GallerywithOverlaidText cannot be created.




Gallery and GallerywithOverlaidText share the same Application Generation Options. However, unlike Gallery page where Number of Columns is 3 by default, GallerywithOverlaidText has 4.



Inside the repeater section of the GallerywithOverlaidText, one will notice only one literal control, which has formula comprises of the image, fieldname and redirect link.





= CategoriesTableControlRow.GetImageWithOverlaidText("Picture", "<a class=\"button_link\" href=\"" + CategoriesTableControlRow.ModifyRedirectUrl("../Categories/Show-Categories.aspx?Categories={PK}", "", True) + "\">" + CategoryName + "</a>", CategoriesTableControlRow.ModifyRedirectUrl("../Categories/Show-Categories.aspx?Categories={PK}", "", True))



Formula is available from the right click menu option within the Formulas tab:



Moreover the control is available to drag and drop from the Toolbox -> ASPX & Other Controls -> Gen.

This will generate the formula with respective fields.



In the formula, there is a call to a method called GetImageWithOverlaidText, this calls a method present in the BaseApplicationPage.vb/C# file. Here one can make changes to the styles in used for this literal control or modify the way formula works. This method is used by all the pages within the application. Therefore modification to this method will result in changes to all the pages.


GallerywithOverlaidText panel is available from the Report & Forms ->Report for…

Please note that the field steps upon selection of GallerywithOverlaidText Type will be disabled. It will preselect the appropriate fields for you.


One can add multiple fields as a link or with no link over the image. This can be accomplished by modifying the formula.




= ProductsTableControlRow.GetImageWithOverlaidText("Photo", "<a class=\"button_link\" href=\"" + ProductsTableControlRow.ModifyRedirectUrl("../Products/Show-Products.aspx?Products={PK}", "", True) + "\">" + ProductName + "<br />" + QuantityPerUnit + "</a><br />" + UnitPrice, ProductsTableControlRow.ModifyRedirectUrl("../Products/Show-Products.aspx?Products={PK}", "", True))


This formula is for the ProductGallery page using Southwind database. In the formula QuantityPerUnit will be shown as a link and UnitPrice as a text. Both are preceded by <br /> tags, so that they appear on a new line. All the fields, which are added to the formula, will be surrounded by galleryTitle style, this can be modified. For instance in order for text not to wrap just add, "white-space:nowrap;" to the galleryTitle style.