Create a Work With for Smart Devices based on templates (version 7 or lower)

In order to create a Work With for Smart Devices Based on a WorkWithPlus for Native Mobile template, you have to follow the steps below:

  1. Navigate to Work With for Smart Devices Pattern from a transaction

    And when you navigate to this option, the following window will be displayed in order to select the WorkWithPlus for Native Mobile template in which the List will be based on.

    The GeneXus IDE Product object's Patterns tab, with the WorkWithPlus for Native Mobile "Select Template" dialog open on top, showing a Select Category tree (Recent, All, List, Other) and three phone-mockup template thumbnails: GX Image gallery, Map of elements with images, and Map of elements, plus Preview, Skip, and Select buttons.

    Select one WorkWithPlus for Native Mobile template and press Select.

    WorkWithPlus for Native Mobile infers the attributes of the Transaction for each content (Image, Title, and Description in the following WorkWithPlus for Native Mobile template example), but you can change it.


    The WorkWithPlus Template Wizard shows the "Image with title and subtitle" template step, with Include in slide menu and Enable Floating Actions checked, a DataGrid section Based on Attributes mapping Image to ProductImage, Title to ProductName, and Subtitle to ProductShortDescription. A phone preview on the right shows the resulting Properties list screen with thumbnail images, titles, and subtitles for entries like Brand New, Business, City, and Cordon.

The WorkWithPlus for Native Mobile template applied to the sections:

  • Tabular sections display
  • Tabular sections edit
  • Grid sections

These will be the ones defined in the WorkWithPlus for Native Mobile template selected when applying WorkWithPlus for Native Mobile templates to the Work With for smart devices. In this example, the SmartDevicesPlus template selected when applying WW for SD is 'Image, title and long description', so the SmartDevicesPlus templates applied for the different sections are the following:

A WorkWithPlus for Native Mobile Template properties table lists Template Category as List, Tabular sections display template WorkWithPlus.NativeMobile.SDPDataDisplay, Tabular sections edit template WorkWithPlus.NativeMobile.SDPDataEdit, Grid sections template WorkWithPlus.NativeMobile.SDPListTitle, Allows floating actions True, and Remove advanced filters/Remove search both False.

And the generated sections (in this case section General) will be created based on the correspondent WorkWithPlus for Native Mobile template (in this case it uses SDPDataDisplayForImage and SDPDataEdit) 

The GeneXus IDE Product object's Patterns tab with WorkWithPlus for Web applied, showing the Level (Product) tree with List, Detail, and Section (General) nodes selected, and the Layout canvas rendering an image placeholder above ProductName and ProductShortDesciption fields, followed by a Description section with ProductDescription and an Image Big placeholder.

In order to visualize the WorkWithPlus for Native Mobile templates applied to each section you can make click in the 'Work With for Smart Devices' tab and visualize its properties:

The GeneXus IDE Product object's Patterns tab with the Work With for Smart Devices tab active, showing the Properties panel for object WorkWithDevicesProduct. An orange arrow points from the properties list to a highlighted callout box reading "Section General (Edit): SDPDataEdit, List: SDPListWithImage, Section General: SDPDataDisplayForBannerImageWithSubtitle", illustrating which template each pattern section uses.

Also, you have the following actions available within a Section created based on a WorkWithPlus for Native Mobile template:

The GeneXus IDE Product object's Patterns tab shows the Level (Product) tree with an arrow pointing to the selected Section (General) node, which has an open right-click context menu listing options: Edit WorkWithPlus for Native Mobile template properties, Edit WorkWithPlus for Native Mobile template properties for Edit, Add new layouts from selected WorkWithPlus for Native Mobile template, Disassociate from WorkWithPlus for Native Mobile template, Select FioriMobile template, Select FioriMobile template for Edit, Add, and Delete.