Successfully!

Error!

Dashboard Adaptive Attributes

  • Last update:  2023-05-19
  • Overview

    Version

    Report Server Version

    Function Change

    11.0

    /

    11.0.3

    The adaptive layout settings in the body of dashboard are moved from Attributes on the right to the menu bar Template > PC Adaptive Attr.

    Application Scenario

    When creating a dashboard, you can set the zooming settings as Bidirectional Adaptive or Horizontal Adaptive. Templates with adaptive attributes can automatically adapt to different screen resolutions of browsers, perform proportional zooming, and display the same effect as designed when previewing them.

    • Bidirectional Adaptive: All components will automatically fill the entire browser in both directions. It is suitable for displaying dashboard with all components on a single screen. As is shown below:

    • Horizontal Adaptive: All components will fill the browser horizontally to adapt to different screen resolutions. The height will be fixed and a scroll bar will appear for you to scroll vertically to display all components. It is suitable for report-type reports. As is shown below:

    Functions

    • Function Entrance: When you create a dashboard, click the Template > PC Adaptive Attr in the menu bar, and the settings box will pop up.

    • This function only affects the design and display of dashboards on PC terminal, but it does not apply to general reports and mobile terminal dashboards.

    • Support setting Report Layout and Content AttributeReport Layout includes the Layout Type and Report Zooming SettingsContent Attribute refers to the font adaptive setting methods of all components inadashboard.

    • The Report Block can individually set the Content Display Mode to adjust the adaptive display of report. And you do not need to set adaptive mode to other components individually.

    • The parameter interface and the controls will maintain the same zooming logic and zooming ratio as the entire report.

    Introduction to Adaptive Attributes

    Note: You only need to set adaptive attributes and content display mode of report block for the entire dashboard, while do not need to set separately for single component.

    Adaptive Attributes

    The layout methods in PC Adaptive Attr include Adaptive Layout and Absolute Layout, presenting different layout effects when placing components in templates. For details, see dashboard Layout Method.

    Both Report Zooming Settings and Font follow a unified adaptive logic regardless of the layout when previewed on the browser. The effect is shown as below:

    Setting Items

    Options

    Effects

    Introduction

    Report Zooming Settings

    Bidirectional Adaptive

    All components in the template simultaneously fill the browser window in both horizontal and vertical directions, always displaying on one page under different screen resolutions.

    Horizontal Adaptive

    All components in the template will horizontally fill the browser window while the height will be zoomed proportionally. On different screen resolutions, when a single page cannot be fully displayed, a vertical scroll bar will appear.

    No Adaptive

    According to the screen resolution, the template is displayed as its original size in the browser window. When all components cannot be fully displayed on one page under different screen resolutions, vertical or horizontal scroll bar will appear.

    Font

    Adaptive

    The font size will be zoomed in or out according to the zooming effect of the template.The font adaptive attribute applies to the text of all components in the template.

    No Adaptive

    The font is displayed in its original size according to the size set in the dashboard, and will not change with the template.

    Report Block Display Mode

    In the dashboard, the report block editing interface will display a black dotted border according to the component size.

    However, when previewing, the Content Display Mode of the report block will adapt according to the setting in the Attributes.

    The default display mode for report blocks is Non-automatic Adjustment. When previewing the template, the content inside the boundary can be displayed normally in the report block area, while the content outside the area needs to be viewed with a scroll bar, as is shown below:

    The logic and effect of each Content Display Method in the report block are shown in the following table:

    Note: In order to achieve the effect of adaptive attribute, the row height and column width of the report block cells are changed to pixels unit, and one pixel is approximately equal to one-third of a millimeter.

    Display mode

    Effects

    Introduction

    Non-automatic Adjustment

    When previewing, the content of the report block is displayed as its original size, and blank spaces indicate that there is no content. If the content exceeds the block size, a vertical or horizontal scroll bar will appear.

    Horizontal Cover the Report Block

    The content of the report block horizontally covers the entire report block area, and the height of the cells will be zoomed proportionally.

    Bidirectional Cover the Report Block

    The content of the report block will zoom in or out with the entire report block area in both directions, and the width and height of the cells are zoomed proportionally.

    Server Adaptive Attributes

    In the PC Adaptive Attr, the Font defaults to the server settings. To modify server settings, click the menu bar Server > Server Configuration Manager and then select PC Adaptive Attr. As is shown below:

    Notes

    Developer Debug Preview

    After completing the dashboard, you can use the Developer Debug preview first. Because the preview effect of developer debug is the initial effect of the template, and all adaptive zooming logic is based on it.

    If the effect is normal under this preview mode, then the effect on PC terminal will be normal, and the adaptive effect will also be better when you preview them in browsers under different screen resolutions. On the contrary, the effect is normal when previewing on the PC terminal, but it may be abnormal under developer debug preview.

    Convert to the New Version

    When using FineReport, if you directly create a dashboard, the adaptive attribute of dashboard defaults to the new version.

    However, if you open a dashboard created in the old version (10.0 template) in the designer, the shortcut toolbar will display Convert to the New Version, and you can click the button to confirm the conversion. As is shown below:

    Note 1: For the differences of dashboards created in the new and old versions, see Introduction of New and Old Versions of Dashboard.

    Note 2: For the Dashboard Adaptive Attr in old version, see the documentation of FineReport 10.0 Dashboard Adaptive Attributes.

    When you convert the designer to the new version, a backup template with the suffix _bak will be generated, which is the old version of the dashboard. As is shown below:

    Attachment List


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

    Doc Feedback