滚动浏览数据网格组件

当您创建内部包含 12 个以上 文本字段 组件的数据网格时，数据网格会变得太紧而无法显示内容。 本教程演示如何滚动浏览数据网格。

教程

要滚动浏览 数据网格 组件，请执行以下操作：

1. 创建一个包含两个类的 CSS 文件，用于滚动浏览 数据网格 和使 文本字段 组件更宽。 overflow-x: scroll 属性允许您滚动浏览 数据网格。 min-width: 300px 属性可 放大文本字段 ，以显示其中的内容。

   将以下代码复制并粘贴到您的 CSS 文件中：

   .my-data-grid
   {
      overflow-x: scroll;
   }
    
    
   .my-data-grid input 
   {
      min-width: 300px;
   }

2. 转到“ 创建表单” 活动中的“ LocalCSSFilePath”属性，然后输入所创建的 CSS 文件的路径（例如 "/file://C:/User/theCssFile.css"）。

您也可以将本地 CSS 文件的路径存储为变量，并在“ LocalCSS 文件路径”字段中输入变量名称。

3. 导航到“ 数据网格 ”组件的“显示”选项卡。 4. 在“ 自定义 CSS 类 ” 字段中，写入在文件中配置的自定义 CSS 类的名称，如下所示： my-data-grid。 这会将 CSS 文件中的数据绑定到表单。

5. 保存组件和表单。

示例工作流

若要检查完整的工作流或获取未来参考，请下载 XAML 示例