如何为Umbraco表单设置界面注册自定义设置字段？

1. 定义自定义表单设置模型 #

首先创建一个继承自FormSettings的类，用来承载你的自定义设置字段：

public class CustomFormSettings : FormSettings
{
    [ConfigurationField("customFormSetting", "自定义表单配置", "/App_Plugins/CustomFormSettings/Views/TextInput.html", Description = "用于存储表单的自定义配置项")]
    public string CustomSettingValue { get; set; }
}

ConfigurationField属性用来指定字段的标识、显示名称、渲染视图路径和描述文本。

2. 注册自定义设置类型 #

通过Umbraco的Composer机制，替换默认的表单设置类型：

public class CustomFormSettingsComposer : IComposer
{
    public void Compose(IUmbracoBuilder builder)
    {
        builder.Forms().SetFormSettingsType<CustomFormSettings>();
    }
}

这段代码会告诉Umbraco Forms，使用你定义的CustomFormSettings来管理表单的全局设置。

3. 配置前端渲染视图（按需自定义） #

如果默认的文本输入视图满足需求，可以直接复用Umbraco Forms自带的Textfield.html；如果需要自定义UI，在App_Plugins目录下创建对应插件文件夹和视图文件，比如/App_Plugins/CustomFormSettings/Views/TextInput.html：

<div ng-controller="UmbracoForms.FieldTypes.TextfieldController">
    <input type="text" ng-model="model.value" class="umb-textstring form-control" />
    <p class="help-block text-muted">{{model.description}}</p>
</div>

要是需要更复杂的控件（比如开关、下拉选择），可以参考Umbraco Forms原生字段的视图代码来编写。

4. 读取自定义设置值 #

在业务代码中，可以直接从表单对象的Settings属性中获取自定义配置：

var targetForm = _formRepository.GetFormById(formId);
var customConfig = ((CustomFormSettings)targetForm.Settings).CustomSettingValue;

注意事项 #

• 不同Umbraco Forms版本的API存在细微差异，比如Umbraco Forms 9+基于.NET Core，启动配置和命名空间会有所调整，需要对应适配。
• 自定义字段会自动出现在表单设置窗口的「设置」标签页中，与原生设置项并列展示。

内容的提问来源于stack exchange，提问作者troshan