Successfully!

Error!

[General] Collapse Expanded Style

  • Last update:  2024-03-06
  • I. Overview

    1. Version

    Report sever versionJAR package
    App version
    HTML5 Mobile display pluginSupport function
    10.02020-02-2810.4.61V10.4.61
    Folding and unfolding of report block or chart block on mobile terminal


    2. Application scenarios

    When encountering the following scenarios, users need to fold and expand report blocks/chart blocks autonomously:

    • By default, the table only displays the first 3 rows of data. Click to expand and display all rows.

    • For the content of a certain analysis dimension, a summary part or only the title is displayed by default, and all components are expanded to display.

    • The chart block can be expanded or collapsed as a whole.


    3. Function introduction

    Users can independently control the folding and unfolding of the report block or chart block content, highlight the main information of the template, hide the secondary information, and improve the readability and use experience of the template.

    II. Support range

    The scope of support for this function is shown in the following table:

    Note 1: This function is not supported under the horizontal screen of the mobile phone.

    Note 2: The [Allow Full Screen] button and the [Collapse and Expand] button do not support simultaneous use. If you need to use them at the same time, please refer to:  [General] JS to realize the collapse and expanding components

    Note 2: If the component (report block, chart block) is not set with a title, the Expand and Collapse function is invalid. If you need to use it when the title is not set, please refer to:[General] JS to realize the collapse and expanding components

    Mobile deviceTerminal rangeComponent layoutForm containerActive component
    Mobile phoneApp、H5Re-layoutbody、Tab block
    Report block, chart block

    III. Example

    1. Template preparation

    Open the template:%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc-EN\Dashboard\industry\Retail group real-time monitoring-phone.frm

    Click to download:  Retail group real-time monitoring-phone.frm


    2. Chart block settings

    1) Left-click on chart0, click on theMobile Terminal, selectCustomin the drop-down box on the right side ofCollapse, and cancel theAllow Full Screen button, as shown in the figure below:

    2) After clicking the Custom button, the user can customize theButton Color, Fold prompt, Unfold prompt andDefault in theCollapse setting item.

    Note: If the [Display button on the right side of the title] is not checked, [Button Color], [Fold prompt] and [Unfold prompt] in the settings will not take effect.

    The default interface is shown in the figure below:

    2.png


    3. Report block settings

    1) Left-click onreport0, click on theMobile Terminal, and selectCustom in the drop-down box on the right side of Collapse, as shown in the figure below:

    3.png

    2) After clicking theCustom button, the user can customize theRow Index, Button ColorFold prompt,Unfold prompt andDefault in theCollapse setting items.

    Note 1: The number of rows in the [Row Index] setting item is the number of rows after the data column is expanded.

    Note 2: In the report block, set row X to start retracting. Row X and row 'X+1' are merged cells, and they will be displayed to row 'X+1'.

    Note3: If the [Display button on the right side of the title] is not checked, [Button Color], [Fold prompt] and [Unfold prompt] in the settings will not take effect.

    The default interface is shown in the figure below:

    4.png

    Note: All chart blocks & report blocks must be set.

    App and HTML5 terminal preview effects are shown below.

    Attachment List


    Theme: Fine Mobile
    Already the First
    Already the Last
    • Helpful
    • Not helpful
    • Only read

    Doc Feedback