Extjs加载图标

rks48beu  于 2022-11-04  发布在  其他
关注(0)|答案(1)|浏览(255)

我想在Extjs中得到一个加载图标,如下所示。我遇到了Extjs loadMask,但它并不是我想要的。是否有任何其他现有的组件,我可以使用,也许可以修改,以实现这种行为和外观?如果没有,如何实现这一点有什么建议?

更新:我试图为表格中的每一行添加图标,下面是作为this.columns下列表中的一个项目而包含的代码。但是,行上没有显示任何内容。我是否遗漏了什么?

{
    xtype: 'actioncolumn',
    sortable:false,
    menuDisabled:true,
    width:50,
    hidden:false,

    items: [{
      xtype:'component',
      cls:'spinner-circular', 
      height:50

    }]
}
pieyvz9o

pieyvz9o1#

我们制作了自己的组件来显示loadicon,如下所示:

这很简单:

{
        xtype: 'component',
        cls: 'spinner-circular',
        height: 50
    }

其中CSS是:

@keyframes spinner-circular {
  to {transform: rotate(360deg);}
}

.spinner-circular:before {
  content: '';
  box-sizing: border-box;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 50px;
  height: 50px;
  margin-top: -15px;
  margin-left: -15px;
  border-radius: 50%;
  border: 1px solid #ccc;
  border-top-color: #f48b31;
  animation: spinner-circular .6s linear infinite;
}

相关问题