Set up an [Expansion panel] layout element

PDF
Products
All Creatio products

Use Expansion panel components to group Freedom UI elements by a single criterion, for example, means of communication or product specifications.

Example. Add the Business card specifications expansion panel to the request page.

Fig. 1 Set up an Expansion panel layout element
scr_expansion_panel_setup_area.png
  1. Drag an Expansion panel layout element to the canvas and open the element setup area.
  2. Enter “Business card specifications” in the Title parameter. You can click the set_title_field_localization.png button to the right to localize the title to other languages you are going to use in the app. Learn more about localizing Freedom UI elements in a separate article: Localize a Freedom UI element.
  3. Specify the style of the expansion panel title in the Style parameter: style_group_1.png or style_group_2.png. For this example, select the former.
  4. Select whether to display the button that expands/collapses the element to the left or the right of the title in the Button position parameter. For this example, leave the button displayed to the left.
  5. Select the color of the expansion panel title in the Title color parameter. For this example, set the color to blue.
  6. Click the btn_visible.png or btn_not_visible.png button in the Visibility group to make the layout element visible or invisible by default on the page, respectively. For this example, leave the layout element visible.
  7. Click Setup conditions in the Visibility group to set up element business rules. For this example, do not add business rules. Learn more about setting up business rules in a separate article: Set up business rules.
  8. Clear the Full width header checkbox to disable the full width alignment of the title and other elements in the expansion panel header, e. g., buttons. For this example, leave the checkbox selected.
  9. Specify the width of the header title as a percentage relative to the entire header in the Title width parameter. For this example, set the width to 50%.
  10. View the unique expansion panel code in the page schema in the Element code parameter. The parameter is populated automatically and non-editable.

As a result, Creatio will add the Business card specifications expansion panel to the request page.