Plugin - Coverflow - iOS

What you will learn in this chapter
Attributes
Integrate Coverflow control Plugin with your App
Download
Good Read Coverflow plugin - Android

COVERFLOW Control

Coverflow control is a plugin that displays images in a unique coverlflow style. The user has to flick left or right to view the images.

In XMADL, COVERFLOW control is defined as follows

<!-- Parent Control-->
<control type="COVERFLOW".........local_data_source="<query>"......>
    <!-- Child Control-->
    <control type="IMAGE".......field_name="<name of the field that contains the image".../>
</control>

Fig below shows COVERFLOW control on iOS

Attributes

Attribute Description Mandatory
name Name identifies this control. If another control wants to include a control as an attribute, then name is used. No
type COVERFLOW Yes
x Specifies the start position of the control. Yes
y Specifies the starting y position of the control Yes
width

Specifies the width of the control in percentage or pixels (px) or device pixels (dp).

By default width in percentage is relative to its parent control. It can be made relative to screen using attribute dimensions_relative_to=”SCREEN” in screen_deck . Learn more about dimensions

Yes
height

Specifies the height of the control in percentage or pixels (px) or device pixels (dp).

By default width in percentage is relative to its parent control. It can be made relative to screen using attribute dimensions_relative_to=”SCREEN” in screen_deck . Learn more about dimensions

Yes
appearance_name Gives the appearance name for the control as defined in appearance.xml. Yes
data_source_type default value is CURSOR. No
local_data_source Defines local data source for this control. The value is SQL Query that fetches data from local database. Yes

Integrate Coverflow control Plugin with your App

  1. Download plugin

  2. Import Coverflow plugin into your project

  3. Create a image data table in yourProject/Resources/images

  4. Use the control in your screen.

    Example:

    In this example the images are loaded from a local data table called coverflowitems. Image is fetched in a child IMAGE control having attribute field_name=”image”.

    The table looks like screen shot of SQLITE table (TODO)

<control type="COVERFLOW" x="0" y="0" width="100" height="100"
        appearance_name="white" data_source_type="CURSOR" local_data_source="select image from coverflowitems">
        <control type="IMAGE" x="20" y="10" width="50" height="60"
            permission="READONLY" appearance_name="white" field_name="image"/>
</control>

The result screen is

images