乐趣区

关于低代码:FoxnicWeb-代码生成-7-配置表单页

jiezi

Foxnic-Web 代码生成 (7) —— 配置表单页

概述

  咱们之前曾经介绍了字段的通用配置和字段的表单组件配置，这些配置仅限于单个字段。因为 Foxnic-Web 的模块页面以关上窗口的形式出现表单内容，天然就会有对表单窗口的管制，以及表单字段布局的管制。

  本篇咱们就来理解一下，在代码生成时的表单出现方面，咱们能够做点啥。

  本文中的示例代码均可在 https://gitee.com/LeeFJ/foxni… 我的项目中找到，本文对照 webfull 我的项目解说。

残缺示例

  Foxnic-Web 我的项目提供代码生成的残缺示例，请大家参考：

https://gitee.com/LeeFJ/foxni…

配置表单窗口

  表单相干的配置能够在模块代码配置类的 configForm 办法内实现：

@Override
public void configForm(ViewOptions view, FormOptions form, FormWindowOptions formWindow) {formWindow.width("120px");
    formWindow.bottomSpace(263);
}

  配置表单窗口，通过 ViewOptions.formWindow() 选项管制。formWindow 提供的管制项包含：

配置项 阐明
width 设置表单窗口的宽度，默认 500px；字符串能够指定像素或百分比。
bottomSpace 设置最下方的表单组件和窗口底部之间的间距，用于撑高表单窗口的高度，便于下拉框展现。

  表单窗是按表单内理论内容主动调节高度的，所以不用指定表单窗口的高度。单某些状况下，因为表单内字段较少，窗口高度也会比拟低，这时，如果输入框是下拉框，那么可能不能很好地展现下拉选项，须要将表单窗口的高度人为的减少一些，这时就须要用到 bottomSpace 参数。

配置表单依赖文件

  表单以及表单页面通过 FormOptions 配置。在代码生成时，表单页面能够额定蕴含其它的 js 和 css 文件，以及变量等，配置项如下：

配置项 阐明
addCss 增加 css 文件引入
addJs 增加 js 文件引入。
addJsVariable 增加 js 变量；这是表单的服务端模版变量。

配置表单外观参数

表单的外观参数如下：

配置项 阐明
labelWidth 设置标签宽度，单栏次默认 65px；多栏次默认 100px
disableFooter 禁用 Footer，用于页面的嵌入。
disableMargin 禁用 Margin，用于页面的嵌入。
enableContextMenu 启用右键菜单，默认 false。

配置表单布局

  Foxic-Web 的表单布局是比拟丰盛的，反对分组、分栏；反对增加嵌入页面、Tab 等，相干配置项如下：

配置项 阐明
columnLayout 应用分栏布局
addGroup 增加一个分组布局
addPage 增加一个内嵌页面
addTab 增加一个内嵌的 Tab

配置表单接口

  Foxic-Web 的表单布局是比拟丰盛的，反对分组、分栏；反对增加嵌入页面、Tab 等，相干配置项如下：

配置项 阐明
savingURL 设置自定义保留接口地址
loadingURL 设置自定义数据加载接口地址

小结

  本节次要从表单窗口、表单页面依赖、表单外观、布局、接口等方面介绍了在代码生成时如何管制表单的外观出现与性能个性。下一节，咱们将介绍表格以及搜寻相干方面的代码生成配置项。

相干我的项目

  https://gitee.com/LeeFJ/foxnic

  https://gitee.com/LeeFJ/foxni…

  https://gitee.com/lank/eam

  https://gitee.com/LeeFJ/foxni…

官网文档

  http://foxnicweb.com/docs/doc…

退出移动版