Themes

The WorkWithPlus 'Pattern Settings' editor shows the Web settings tab with the Settings tree expanded: Template, Objects, Theme (selected), Labels, Grid, MasterPages, Global Attribute based rules, Global Events & Subs with two Sub nodes for 'Commit updates', Global automatic conditions, Global variables, and Notifications with Predefined Transaction Notifications (Discussion, Mention, InsertRecord, UpdateRecord, DeleteRecord).

Themes node has the following properties:

Category Property  
General Theme Properties panel for a WorkWithPlus Theme node lists ThemeClass mappings (Button, Disabled Button, Image, Text To Link, Plain Text, Grid, Table, Group) and Attribute section rows (Attribute, Readonly Attribute, Readonly Grid Attribute selected showing a dropdown, Blob Attribute, Date/DateTime/Combo/Radio Button/Check Box suffixes), followed by Required attributes and FreeStyleGrid with Descriptions as Header settings.
Theme Class Button
Disabled Button
Image
Text To Link
Plain text
Att / Var Right Text
Grid
Allow Selection Grid Suffix
Column Selector table
Column Selector Free Style Grid
Table
Group
Table for Geolocation Attributes
Grid User Action Image Class
Attribute Attribute
Readonly Attribute
Readonly Grid Attribute
Blob Attribute
Readonly Blob Attribute
Readonly Grid Blob Attribute
Character Attribute Suffix
Varchar Attribute Suffix
Numeric Attribute Suffix
Date Attribute Suffix
Date Time Attribute Suffix
Combo Attribute Suffix
Radio Button Attribute Suffix
Check Box Attribute Suffix
Totalizer Atts and Vars Suffix
Required Attributes Required Themes Assignation
Required Attribute
Required Attribute Description
Required Attribute Cell
Required Attribute Description Cell
Extended Controls Panel
Tab Panel
Filter Range Middle Text
Dynamic Filter Filter Operator
Dyn Filter Table
Dyn Filter Prefix
Dyn Filter Middle
Dyn Filter Selector
Fixed Filters Description
FreeStyleGrid with Descriptions as Header Header Table (FS with Header)
Section (for Scroll in FS with Header)
Default Title (for Scroll in FS with Header)
Free Style Grid (FS with Header)

Properties Of Category General:

Theme:

Specifies the theme object that will be set to all objects generated by the pattern if Set object theme property is True. If this property is empty, theme will be taken from KB's Default Theme  property.

Properties Of Category Theme Class:

All the properties inside this category specifies the default theme class for different objects or node types. 

Properties Of Category Attribute:

The following properties specifies the class to be assigned by default to attributes of this kind.

Properties:

  • Attribute
  • Readonly Attribute
  • Readonly Blob Attribute
  • Readonly Grid Blob Attribute
  • Grid Check Box Attribute (apply only for Multi Row Selection and Association Selection)

The following properties specify a suffix that will be set to each type of attribute when is not Read only. Applies for attributes and variables.

Properties:

  • Character Attribute Suffix
  • Varchar Attribute Suffix
  • Numeric Attribute Suffix
  • Date Attribute Suffix
  • Date Time Attribute Suffix
  • Combo Attribute Suffix
  • Radio Button Attribute Suffix
  • Check Box Attribute Suffix
  • Totalizer Atts and Vars Suffix: specifies the suffix to be assigned to the class of the variable that is included automatically by WorkWithPlus at the bottom of the grid displaying the totalizer of that column.

Example 1:

If the value of the property 'Theme class' of an attribute node in a transaction is 'Att', and the type of this attribute is Date it will assign: Attribute + Property 'Date Attribute Suffix': AttDate

Example 2:

If the value of the property 'Theme class' of an attribute node in a transaction is empty, it will take the default value of Web Settings -> Theme -> Attribute + the right suffix (depending on the type of the attribute): AttributeDate (see images below).

GeneXus Person transaction editor with the WorkWithPlus pattern applied shows the generated Web Form (Basic Information, More Information, Auditing tabs) and its object tree, with PersonBirthDate selected; a red arrow points from the tree to the Properties panel's Theme class row for attribute PersonBirthDate.

WorkWithPlus WWP Configuration tree with the Theme node selected; two red arrows point from it to the Properties panel, highlighting Columns Selector Table/Free Style Grid settings and the Attribute section (Attribute, Readonly Attribute, Blob Attribute, Date/DateTime/Combo/Radio Button/Check Box Attribute Suffix rows).

Person Web Form designer showing the Basic Information tab (Id, First Name, Last Name, Full Name, Hobby, Nickname, Birth Date, Gender, Company fields) with the PersonBirthDate control selected; a red arrow points to the Properties panel's Class field set to AttributeDate under Appearance.

Properties Of Category Required attributes:

Specifies the themes classes or prefix to be assigned to the attributes or variables that are required.

Required Themes Assignation:

Specifies the theme classes that WorkWithPlus will assign to required attributes and variables. The options are: 'Fixed Classes' or 'Use a prefix'.

  •  Fixed classes: it will assign the classes that are defined in the properties named Required Attribute, Required Attribute Description, Required Attribute Cell and Required Attribute Description Cell. These properties are in Theme node. It won't take into account the values of the properties Theme class, Description Theme class, cell theme class and Description cell theme class of the attribute or variable.
     
    For example, if you have a required variable or attribute with the following properties:
    WebPanel7 pattern editor with Company.CompanyName selected in the object tree and Web Form preview (Data, General Information, More Information panels); two red arrows point to the Properties panel's Theme class (AnyThemeClass) and Cell theme class (AnyCellThemeClass) rows, both boxed in red.

     And the properties of WorkWithPlus Theme node are the following:
    WorkWithPlus WWP Configuration tree with Theme selected; a red arrow points to the Properties panel's Required attributes section, boxed in red, showing Required Attribute, Required Attribute Description, Required Attribute Cell (value Required), and Required Attribute Description Cell rows.

    The required variables will have the following properties:
    WebPanel7 form editor with the Company.CompanyName control selected; two red arrows point to the Properties panel's Class field (AnyThemeClass, boxed) and Cell Class field showing RequiredAnyCellThemeClass, where the 'Required' prefix is highlighted in a different color to indicate the required-attribute class prefix.
     
  • Use a prefix: the classes assigned to the required attributes will be a concatenation of the properties mentioned above and the values of the properties of the attribute/variable itself.
     
     

Properties of Category Filter:

Range Middle Text:

Specifies the theme to apply to the text that goes in the middle of the Range filter.

Projects list grid generated by WorkWithPlus, with Insert/Excel/PDF/Select columns toolbar and a filter row set to 'Search in Estimated Finish Date, value Range' showing two date-range input boxes; the 'to' label between them is boxed in red. The grid below lists projects with Id, Description, dates, Status, Real Cost, Price, and Profitability columns.

Properties Of Category Dynamic Filter:

Filter Operator:

Theme to apply to the control which contains the operators. This control is included when you insert a filter with dynamic operators or a dynamics filters node.

Dyn Filter Table:

Theme to apply to the table which wraps all the controls of the dynamic filters.

Person list grid generated by WorkWithPlus with Insert/Excel/PDF/Select columns/Delete Selected actions, a dynamic filter row (Search in Full Name, value, Starts with), and a tooltip reading 'table#TABLEDYNAMICFILTERS.gx-tab-spacing-fix-2.TableDynamicFilters.DynamicFilters 479 x 36' identifying the control. Rows list persons with Id, First/Last/Full Name, Nickname, Birth Date, Hobby, Gender, Company, and phone number columns.

Dyn Filter Prefix:

Theme to apply to the label that is next to the combobox with the attributes.

Close-up of a WorkWithPlus grid filter bar showing 'Search in' (attribute selector), 'value', and 'Starts with' controls, with the 'Search in' label boxed in red to highlight the filter attribute selector.

Dyn Filter Middle:

Theme to apply to the label that is between both comboboxes.

Close-up of the same WorkWithPlus grid filter bar (Search in Full Name, value, Starts with), with the 'value' label boxed in red to highlight the filter value input.

Dyn Filter Selector:

Theme to apply to the combobox which contains the operators to apply to an attribute.

Close-up of the same WorkWithPlus grid filter bar (Search in Full Name, value, Starts with), with the 'Starts with' operator dropdown boxed in red to highlight the filter comparison operator.

Fixed Filters Description:

Specifies the theme class that will be assigned to the filter's description. Only applies when the filter is inside the FixedFilters node.

Companies list grid with two stacked dynamic filter rows, both 'Search in' (Name and Description) set to 'Starts with'; a red arrow points to the 'Name' filter selector on the first row. The grid below shows Description and Logo columns for companies like 3M, Disco, DVelop, and Artech.