半岛权威十大直营(官方)网站

从FastReport网站下载Online Designer之前，您必须先编译它。为此，您必须首先在特殊的可视化构建器中配置该程序。但是，如果您的需求发生了变化，并且需要一个不同的配置呢？ 您必须在可视化构建器中再次创建OnlineDesigner，将其下载并将其添加到您的项目中。 如果同一个项目中的不同情况需要不同的设计器配置呢？ 您的代码开始重复使用不同版本的设计器，这增加了不必要的“麻烦”，正如Martin Fowler所说。

但是实际上并没有那么糟糕！

在本文中，我将讨论新功能 - 在程序代码中更改在线设计器的配置。 实际上，我们将覆盖设计器的配置文件，这是一个json格式的文档。 该功能在2017.3.3版本中已经实现。 此功能可用于更改设计器的设计和其他参数。

怎么运行的？ 在线设计器首先加载默认设置，然后更改 - 它们覆盖初始设置。

覆盖的配置存储在属性：WebReport.DesignerConfig中，作为JSON格式的字符串。

我们来看一个例子。 创建ASP.Net MVC应用程序。 我们在项目中添加一个包含在线设计器的文件夹。 我们称之为WebReportDesigner。 在其中，我们将从FastReport站点下载的存档的内容配置为设计器。

在参考文献中，我们添加了一个链接到FastReport.dll和FastReport.Web.dll库。

现在，在Index中将以下代码添加到HomeController控制器：

使用此属性的示例：

using FastReport.Web;
using System.Web.UI.WebControls;
…
 public ActionResult Index()
 {
 WebReport webReport = new WebReport();
 webReport.Width = Unit.Percentage(100);
 webReport.Height = Unit.Percentage(100);
 string report_path = GetReportPath();
 System.Data.DataSet dataSet = new System.Data.DataSet();
 dataSet.ReadXml(report_path + "nwind.xml");
 webReport.Report.RegisterData(dataSet, "NorthWind");
 webReport.Report.Load(report_path + "Simple List.frx");
 webReport.DesignReport = true;
 webReport.DesignScriptCode = false;
 webReport.Debug = true;
 webReport.DesignerPath = "~/WebReportDesigner/index.html";
 webReport.DesignerLocale = "en";
 webReport.DesignerSaveCallBack = "~/Home/SaveDesignedReport";
 webReport.ID = "DesignReport";
 // file with custom configuration
 string designerConfigFile = this.Server.MapPath("~/App_Data/DesignerConfig.json");
 // load file in DesignerConfig
 if (System.IO.File.Exists(designerConfigFile))
 webReport.DesignerConfig = System.IO.File.ReadAllText(designerConfigFile);
 ViewBag.WebReport = webReport;
 return View();
 } 

您注意到，WebReport添加了DesignerConfig属性。 在其中，我们定义配置文件，覆盖在线设计器的必要参数。 该文件放置在项目中的App_Data或任何其他文件夹中。

以下是文件内容/App_Data/DesignerConfig.json的示例：

{
"font-names": [
    "Calibri",
    "Calibri Light",
    "Comic Sans MS",
  ],
"default-font-name": "Calibri",
"preload-fonts": ["Calibri"],
"scale": 1,
"grid": 9.45,
"sticky-grid": true
}

在此文件中，我们更改了在线设计器的文本组件中可用的字体集。

现在来看看在配置文件中可以覆盖的所有配置参数：

• “font-name” - 包含可用于文本组件的字体名称的数组;
• “default-font-name” - 分配给新创建的文本组件的默认字体;
• “preload-fonts” - 一个包含一组将在设计器初始化之前预加载的字体的数组。 因此，这里的字体越多，原始设计器的负载将越长;
• “prefetch-fonts” - 加载类似于以前设置的字体，但是在稍后的初始化阶段。 到目前为止，页面和工具栏已经可见了;
• “scale-mobile” - 用于从移动设备（0到2）查看设计器的默认页面比例;
• “scale” - 缩放从所有其他设备（0到2）查看设计器的默认页面;
• “grid” - 网格间距;
• “sticky-grid” - “粘贴”到网格的组件（true / false）;
• “hotkeyProhibited” - 禁用热键;
• “save_success_redirect”：

  {
  "url" - Where to make a redirect after successful saving;
  "blank": - Open in a new tab;
  "useParent" - In the case when the online designer in the iframe then make a redirect in the parent window in which the designer is embedded;
  "removeConfirmation" - Do not show confirmation when redirecting (after saving);
  },
  

• “colors”：

  {
  "button-circle" - Color of resize elements and other round elements on the work area;
  "angle-slider" - Angle element color;
  "default-band-separator" - Color of separator between the bands;
  "selected-band-separator" - The color of the active splitter between the bands, when the band is in the process of resizing;
   },
  

• “show-band-title” - Band标题秀;
• “add-bands” - 禁止添加Band的能力;
• “resize-bands” - 禁止更改Band大小的能力;
• “movable-components” - 能够禁止控件的移动;
• “resizable-components” - 能够防止更改组件的大小;

自定义面板（左侧，具有按钮的工具栏）

• “customization”：

  {
          "properties": {
              "enable" - Panel activity;
              "button" - Show the button for this toolbar on the toolbar;
              "shown" - Open the default panel when downloading an online designer;
              "header": - Panel title;
              "hasBorder" – Visual border of the panel;
              "movable" - The ability to move the panel through drag & drop;
              "resizable" – The ability to change the size of the panel;
          },
          "events": {
              "enable": true,
              "button": true,
              "shown": false,
              "header": true,
              "hasBorder": true,
              "movable": true,
              "resizable": true
          },
          "report-tree": {
              "enable": true,
              "button": true,
              "shown": false,
              "header": true,
              "hasBorder": true,
              "movable": true,
              "resizable": true
          },
          "data": {
              "enable": true,
              "button": true,
              "shown": false,
              "header": true,
              "hasBorder": true,
              "movable": true,
              "resizable": true
          },
          "preview": {
              "enable": true,
              "shown": true,
              "button": false,
              "header": false,
              "background": "initial",
              "container": "horz"
              "width": 125 - Default widget width;
              "table": true
          }
      },
      "default-tab-menu": "home" – The default tab in the top toolbar when the designer loads;
      "show-saving-progress": "default", - Possible values - default, small, large;
      "notifications": "default", - Possible values - default, html5, false;
      "notifications-mobile": "default" Possible values - default, html5, false;
  }
  

因此，我们有一个很好的机会重新配置在线设计器，而无需重新编译。

产品介绍 | 下载试用 | 优惠活动 | | 联系Elyn

推荐阅读

• FastReport VCL报表控件开发者手册
• FastReport Online Designer中文手册
• Fastreport.Net教程2016
• Fastreport.Net用户手册
• FastReport.Net教程2017（持续更新中···）
• FastReport Online Designer教程2017（持续更新中···）
• 报表教程2017（持续更新中···）