Automatically creating an image gallery

Supported in:

The Image Gallery feature allows you to quickly create a swipeable gallery of image files by pointing the app to a specifically formatted URL. The URL can be set as the app's homepage, a custom link in the bottom navigation bar, or as a link in an HTML page.  

Image files must be stored locally on the device. Supported formats include .jpg and .png.  

Using this URL scheme, you can set the path to your images, set an overlay image that will appear on every slide (optional), and choose the opacity for the overlay image (optional).

kiosk-igallery://?gallery-path=[path-to-image-folder]&overlay-path=[path-to-overlay-image]&overlay-alpha=[0-1]&title=[title]

Text in the square brackets in the string shown above must be updated to reflect your content/preferences and the square brackets removed. Ampersands ('&') are used to separate parameters.

Initial Protocol

kiosk-igallery://?

The initial protocol instructs Kiosk Pro to create the image gallery.  The entire string, including the '?', must be included before any of the following parameters. 

Gallery Path [optional]

gallery-path=[path-to-image-folder]

The gallery path is where the images are located. If you have a folder in the Kiosk Pro documents folder called "slideshow", than this portion of the scheme would be:

gallery-path=slideshow

To show images that are located directly in Kiosk Pro's documents folder, you can use:

kiosk-igallery:// or kiosk-igallery://?gallery-path

You can define the order in which images are shown by naming the files alphabetically, or serially using numbers (for example, ‘1.jpg’, ‘2.jpg’, ‘3.jpg’, etc.).

You can also use an .xml file stored in the same folder to define the order:

<xml>
<slide_show_settings>
    <slides>
        <slide path='slide10.jpg'/>
        <slide path='slide38.jpg'/>
        <slide path='slide7.png'/>
        <slide path='slide14.png'/>
        <slide path='slide1.jpg'/>
    </slides>
    <order_type>0</order_type>
</slide_show_settings>
</xml>

Using the .xml file makes it easier to add or reorder pieces of content as it does not require that you rename a large number of files when a change is needed.  You can choose to order the files by the order they are listed in the .xml using <order_type>0</order_type>, randomly using <order_type>1</order_type>, or alphabetically/numerically using <order_type>2</order_type>.  

A template for the .xml file can be found here.

The file must be named ‘slide_show_settings.xml’ and be placed in the same folder on the device as the images being shown. Additional images can be defined by adding additional <slide path='content.ext'/> entries.

Overlay Image [optional]

overlay-path=[path-to-overlay-image]

The overlay image is an image that will be displayed in front of every image in the gallery. We recommend making this a transparent PNG file the same resolution as your iPad. If your overlay image is called "overlay.png" and is directly in Kiosk Pro's documents folder, this portion of the scheme would be:

overlay-path=overlay.png

Overlay Opacity [optional]

overlay-alpha=[0-1]

The overlay opacity lets you set how opaque the image is. With an opacity of 1, the image will be completely visible, and an opacity of 0 would make it completely invisible. The number set here can be 0, 1 or a decimal (like 0.8). If you wanted the opacity to be at 50%, this portion of the scheme would be:

overlay-alpha=0.5

If an overlay opacity is not set in the scheme, the default will be 1 (completely visible).

Title [optional]

title=[title]

The title is shown if an image gallery is opened in a new tab. As this is passed as a URL parameter, any spaces or special characters must be URL encoded. For example, to title the tab 'Image Gallery', this portion of the scheme would be:

title=Image%20Gallery

Example

For a folder of images in the Kiosk Pro documents folder called "slideshow", and an overlay image directly in the documents folder called "overlay.png" which you wanted to be 50% opaque with a title of 'My Pics', your scheme would be:

kiosk-igallery://?gallery-path=slideshow&overlay-path=overlay.png&overlay-alpha=0.5&title=My%20Pics