可在列表或库中配置列表窗体,其中包含自定义页眉、页脚和带有一个或多个分区并在每个分区均存在字段的窗体正文。 窗体配置不会改变列表项或文件中的数据,它只改变窗体对浏览列表或库的用户的显示方式。 可以在列表中创建和管理视图的任何人都可以使用窗体配置来配置包含页眉、页脚和正文的窗体。
若要配置窗体,请使用在列表或库中格式化 列 或 视图 时已熟悉的 JSON 格式化程序。 表单配置允许某些预定义元素和属性生成具有一个或多个节的自定义页眉、页脚和正文。
开始行动
在列表或库中配置窗体:
转到想要配置表格的列表或库。
如果在列表中:
- 打开一个项目,以在显示表单中查看项目详细信息。
如果在文档库中:
- 选择一个文件。
- 选择 ...
- 选择“更多”
- 选择属性
在窗体顶部,展开编辑窗体图标,然后选择配置布局
在格式窗格中,可选择将格式应用于以下窗体部分:
- 标头
- 正文
- 页脚
配置自定义页眉
若要将格式应用于页眉,请在应用格式的下拉列表中选择页眉。
在JSON文本输入区粘贴你的自定义页眉格式。
注意
窗体配置允许某些预定义的元素和属性构建自定义页眉。
下面是自定义页眉和 JSON 的示例:
{ "elmType": "div", "attributes": { "class": "ms-borderColor-neutralTertiary" }, "style": { "width": "99%", "border-top-width": "0px", "border-bottom-width": "1px", "border-left-width": "0px", "border-right-width": "0px", "border-style": "solid", "margin-bottom": "16px" }, "children": [ { "elmType": "div", "style": { "display": "flex", "box-sizing": "border-box", "align-items": "center" }, "children": [ { "elmType": "div", "attributes": { "iconName": "Group", "class": "ms-fontSize-42 ms-fontWeight-regular ms-fontColor-themePrimary", "title": "Details" }, "style": { "flex": "none", "padding": "0px", "padding-left": "0px", "height": "36px" } } ] }, { "elmType": "div", "attributes": { "class": "ms-fontColor-neutralSecondary ms-fontWeight-bold ms-fontSize-24" }, "style": { "box-sizing": "border-box", "width": "100%", "text-align": "left", "padding": "21px 12px", "overflow": "hidden" }, "children": [ { "elmType": "div", "txtContent": "='Contact details for ' + [$Title]" } ] } ] }
若要预览所做的更改,请点击预览按钮。
点击保存按钮,以保存更改。
关闭并再次打开窗体以查看自定义标题。
配置自定义页脚
若要将格式应用于页脚,请在格式窗格中,在格式应用的下拉列表中选择页脚。
粘贴你的自定义页脚格式到 JSON 文本输入区域。
注意
窗体配置允许某些 预定义的元素和属性 构建自定义页脚。
下面是自定义页脚和 JSON 的示例:
{ "elmType": "div", "style": { "width": "100%", "text-align": "left", "overflow": "hidden", "border-top-width": "1px" }, "children": [ { "elmType": "div", "style": { "width": "100%", "padding-top": "10px", "height": "24px" }, "children": [ { "elmType": "a", "txtContent": "='Contact Details for ' + [$Title]", "attributes": { "target": "_blank", "href": "='https://aka.ms/contacts?email=' + [$Email]", "class": "ms-fontColor-themePrimary ms-borderColor-themePrimary ms-fontWeight-semibold ms-fontSize-m ms-fontColor-neutralSecondary–hover ms-bgColor-themeLight–hover" } } ] } ] }
若要预览所做的更改,请点击预览按钮。
点击保存按钮,以保存更改。
关闭并再次打开窗体以查看自定义页脚。
配置具有一个或多个部分的自定义正文
若要将格式应用于正文,请在格式窗格中,在格式应用的下拉列表中选择正文。
在 JSON 文本输入区粘贴自定义正文格式。
与页眉和页脚不同,正文配置只允许定义一个或多个分区,并在每个分区中添加一个或多个列。
- 可以为一个正文定义一个或多个分区。
- 每个分区均可引用列表或库中的一个或多个列。
- 一列只能在一节中引用。
- 如果在多个节中引用了列,则引用该列的第一个部分将优先。
- 最后一节中将自动引用未在任何节中引用的列。
- 新增加的列将在最后一节中自动引用。
下面是 JSON 结构,用于开始在各节中定义节及引用列:
{ "sections": [ { //give a display name for the section "displayname": "", "fields": [ //reference your fields here using their display name "Title" ] }, { //give a display name for the section "displayname": "", "fields": [ //reference your fields here using their display name ] } ] }
下面是包含节的自定义主体 JSON 的示例:
{ "sections": [ { "displayname": "", "fields": [ "Title" ] }, { "displayname": "Details", "fields": [ "Department", "Email", "Country" ] }, { "displayname": "Application", "fields": [ "Application Id", "Approver", "Reviewer" ] } ] }
一旦正文自定义了一个或多个分区,列表或库窗体将切换到多栏布局。
注意
配置表单正文会将列表或库的窗体布局从单栏切换为多栏布局。 在未来的更新中,将添加针对配置单列布局正文的支持。
若要预览所做的更改,请点击预览按钮。
点击保存按钮,以保存更改。
关闭并再次打开窗体,查看自定义正文。
Read-Only 字段的自定义格式化程序
简介
Microsoft Lists提供了一种组织信息并与团队协作的强大方法。 随着基于 AI 的列表项创建的兴起,用户通常需要查看但不编辑某些字段,例如系统生成的数据或机器人添加的详细信息。 为了满足这一需求,建议使用新的自定义格式化程序功能,以允许字段在列表表单中显示为只读。
为什么 Read-Only 字段很重要
目前,只读字段在“新建项”和“编辑”窗体中隐藏。 当 AI 机器人或自动化进程创建包含用户需要查看但不需要修改的关键数据的项目时,这会产生挑战。 例如:
- 机器人使用“问题详细信息”“问题标题”和“问题说明”创建客户服务票证。
- 用户应看到此信息以采取 (作,例如发送电子邮件) ,但无法更改它。
新的自定义格式化程序通过允许这些字段显示为只读来解决此问题。
自定义格式化程序的工作原理
自定义格式化程序引入了新的 JSON 配置,用于在窗体视图中将字段标记为只读。
JSON 结构
{
"sections": [{}],
"fieldsettings": [
{
"name": "fieldName",
"readonly": true
}
]
}
- name:字段的内部名称。
- readonly:设置为 true 时,字段显示为只读。
不同窗体视图中的行为
自定义格式化程序可确保一致的用户体验:
- “新建项”窗体:只读字段不会显示。
- 编辑窗体:显示字段时没有可编辑的文本框,类似于“计算列”。
- 编辑所有模式:字段保持可见且不可编辑。
“保存”按钮按预期工作 , 不会意外修改只读字段。
示例用例
假设有一个 CRM 机器人创建具有预先填充的问题详细信息的票证。 使用以下格式:
- 问题标题 (只读) :用户可以查看和复制问题标题,但无法对其进行修改。
- 问题说明 (只读) :用户可以查看和复制问题说明,但无法对其进行修改。
- 问题源 (只读) :用户可以单击“问题源”链接,但无法对其进行修改。