I. Overview
Applicable scenarios: Users who have installed the "FVS Large Screen Editing Mode" plugin can refer to this article to learn about the related functions of the FVS template.
1. Version
| Report server version | JAR package | FVS large screen editing mode (beta version) version | Function changes |
|---|---|---|---|
| 11.0 | 2021-11-15 | V1.0.0 | - |
| 11.0.1 | 2021-12-15 | V1.1.0 | Chapter IV, Interactive mode optimization of template preview |
2. Function introduction
This article will briefly introduce the related attributes of FVS canvas and pagination.
First of all, users need to understand the composition of the FVS large screen template:
An FVS large screen template is a canvas. Multiple pagination in one canvas. There are multiple components in each pagination. As shown below:
II. Canvas Attributes
1. Canvas size
When creating a new FVS large screen template, you can set the canvas size. The user can also adjust the canvas size directly below the editor.
You can manually enter the width and height of the canvas, the unit is px, and the width and height value range is 300-50000px.
The adjustment of canvas size takes effect on all pages in the current canvas.
2. Canvas adaptation
FVS large screen template provides four ways to adapt to the canvas. As shown below:
The adjustment of the canvas adaptation mode takes effect for all the pages in the current canvas.
The specific effects of the canvas adaptation scheme are shown in the following table:
| Canvas adaptive scheme | Zooming logic |
|---|---|
| Auto | The canvas display page fills the browser window Display page width = browser page width Display page height = browser page height The size of the component is zoomed according to the ratio of min[browser page height / canvas size height, browser page width / canvas size width] |
| Horizontally | Canvas display page height fills browser window height Display page height = browser page height Display page width = max[browser page height / (canvas size height / canvas size width), browser page width] Component and canvas zoom proportionally |
| Vertically | The width of the canvas display page fills the width of the browser window Display page width = browser page width Display page height = max[browser page width / (canvas size width / canvas size height), browser page height] Component size is proportional to canvas width |
| None | Display page height = max[browser page height, canvas size height] Display page width = max[browser page width, canvas size width] Component size does not zoom |
3. Canvas display ratio
The adjustment of the canvas display ratio does not change the actual size of the canvas, but only affects the size of the canvas display in the editor.
Users can manually modify the zoom value, or select a preset zoom value in the drop-down box. The zooming value needs to be between 10-400.
III. Page attributes
1. New page
1) Click Fold/Expand to fold/expand the page area.
2) Click + New Page to add a blank page.
3) Right-click the selected page, click Copy Page, and add a page that is the same as the selected page after the selected page.
4) Right-click the selected page and click Delete to delete the selected page. When there is only one page, the "Delete" button is grayed out and unavailable.
5) Press and hold the page and drag to adjust the page order.
2. Page name
Select the page and click Page in the configuration bar in the upper right corner to manually modify the page name. As shown below:
3. Page Background
The page background supports four configuration methods: None, Color, Built-in Asset, and Custom Upload.
For details, please refer to: FVS Page Background & Component Background.
The configuration of the page background takes effect only on the selected page and has no effect on other pages in the current canvas.
4. Page transition
Provides a smooth transition function. If turn on smooth transation,there are shifting transations between the animations of the same component in previous page and current page. The exit effects in previous page will be disabled.
For details, see: FVS Component Framework Animation Properties .
IV. Template preview
When there are multiple pages in the template, the user can first set the Preview Playback Settings for the template in the page area, as shown in the following figure:
After setting, click the Preview button in the upper right corner to preview the template in the browser.
Depending on the selection of the button, the final preview effect varies, please refer to the following table for details:
| Automatically switch pages | Loop the page | Show toggle button | Effect |
|---|---|---|---|
| uncheck | uncheck | uncheck | When previewing the template, you see the first page by default. Move the mouse to the lower left corner, the page switching button appears, click to switch pages. However, it can only switch from front to back/back to front, and does not support cyclic switching from the last page to the first page.
|
| uncheck | check | uncheck | When previewing the template, you see the first page by default. Move the mouse to the lower left corner, the page switching button appears, click to switch pages. And you can connect the last page to the first page in series, support circular switching.
|
| uncheck | uncheck | check | When previewing the template, you see the first page by default. The page switching button automatically appears in the lower left corner, click to switch pages. However, it can only switch from front to back/back to front, and does not support cyclic switching from the last page to the first page.
|
| uncheck | check | check | When previewing the template, you see the first page by default. The page switching button automatically appears in the lower left corner, click to switch pages. And you can connect the last page to the first page in series, support circular switching.
|
| check | uncheck | uncheck | When previewing the template, the default is to play from the first page to the last page, and then stop on the last page. Move the mouse to the lower left corner, the page pause button appears, click to pause/start sequential playback. Move the mouse to the lower left corner, the page switching button appears: Click to switch to the next one, you can switch pages, if the playback is currently paused, it will automatically start sequential playback. Click to switch to the previous page to switch pages. If playback is currently paused, automatic playback will not be triggered. It can only switch from front to back/back to front, and does not support cyclic switching from the last page to the first page.
|
| check | check | uncheck | When previewing the template, concatenate the last page and the first page into a loop, and play in a non-stop loop. Move the mouse to the lower left corner, the page pause button appears, click to pause/start sequential playback Move the mouse to the lower left corner, the page switching button appears: Click to switch to the next one, you can switch pages, if the playback is currently paused, it will automatically start sequential playback. Click to switch to the previous page to switch pages. If playback is currently paused, automatic playback will not be triggered.
|
| check | uncheck | check | When previewing the template, the default is to play from the first page to the last page, and then stop on the last page. The page pause button automatically appears in the lower left corner, click to pause/start sequential playback. The page switching button automatically appears in the lower left corner: Click to switch to the next one, you can switch pages, if the playback is currently paused, it will automatically start sequential playback. Click to switch to the previous page to switch pages. If playback is currently paused, automatic playback will not be triggered. It can only switch from front to back/back to front, and does not support cyclic switching from the last page to the first page.
|
| check | check | check | When previewing the template, concatenate the last page and the first page into a loop, and play in a non-stop loop. The page pause button automatically appears in the lower left corner, click to pause/start sequential playback. The page switching button automatically appears in the lower left corner: Click to switch to the next one, you can switch pages, if the playback is currently paused, it will automatically start sequential playback. Click to switch to the previous page to switch pages. If playback is currently paused, automatic playback will not be triggered.
|
Previous：FVS Canvas Editing (Earlier Version)
