Angular2 - 如何在datagrid控件中更改DevExtreme加载指示器的大小

时间:2017-03-09 10:48:08

标签: angular devextreme dx-data-grid

https://js.devexpress.com/Documentation/16_2/ApiReference/UI_Widgets/dxDataGrid/

以上是Devextreme团队提供的API参考。我使用 loadPanel 属性将微调器指示器更改为指向自定义gif。 这是Devextreme团队曝光的房产

loadPanel: {
    enabled: "auto",
    height: 90,
    indicatorSrc: "",
    showIndicator: true,
    showPane: true,
    text: "Loading...",
    width: 200
}

我已将其更改为

loadPanel: {
    enabled: "auto",
    height: 90,
    indicatorSrc: "images/MyCustom.gif",
    showIndicator: true,
    showPane: false,
    text: "Loading...",
    width: 200
}

但是,GIF显示缩小,高度宽度属性仅适用于其周围的框窗格的大小。试图通过为指标类设置CSS样式来改变大小但是没有工作

/deep/ .dx-loadindicator-content {
    width: 200px;
    height: 200px;
}

有人能达到这个目标吗?

1 个答案:

答案 0 :(得分:1)

loadPanel.widthloadPanel.height选项与加载面板几何图形直接相关。它们不会影响图标大小。但是您可以在问题中指出通过CSS自定义图标大小。只需使用以下css选择器:

/deep/ .dx-datagrid .dx-loadindicator {
  width: 64px;
  height: 64px;
}