最新历史版本 :PC 端预览模板的移动端效果 返回文档
编辑时间: 内容长度:图片数:目录数: 修改原因:

目录:

1. 概述编辑

1.1 版本

报表服务器版本
10.0

1.2 功能简介

注:建议使用谷歌浏览器。

本文介绍如何利用浏览器的设备仿真工具,在 PC 端模拟单张模板的 移动端预览 效果,以谷歌浏览器的移动设备仿真工具为例。

本文方案具有以下优点:

  • 无需移动端设备。

  • 无需配置网络环境,并可以避免因为防火墙拦截而导致的网络连接失败。

2. 访问单张模板编辑

示例模板路径为:%FR_HOME%\webapps\webroot\WEB-INF\reportlets\demo\form\简单自由填报-phone.cpt

2.1 复制模板预览链接

1)在 FineReport 设计器中,打开任意一张普通报表或决策报表,以简单自由填报-phone.cpt为例,选择「移动端预览」,如下图所示:

2)点击「移动端预览」后,PC 端浏览器显示页面如下,选择类型为「填报」,点击「复制链接」按钮。

注:决策报表不支持填报预览。

3)在浏览器中打开一个新页面,并将步骤 2 中获取到的链接粘贴至地址栏中,无需访问,如下图所示:

2.2 切换设备

按 F12 键,或者单击鼠标右键点击检查,打开 Chrome 的控制台。点击「仿真设备」按钮,切换到移动端选项,如下图所示:

2.3 效果预览

访问当前网址,即可查看移动端报表效果,如下图所示:

注:PC端预览移动端模板效果时,不支持扫码输入。