如何在 ExtJS 清晰主题中缩小 UI 大小



比较 Extjs 清晰和经典的主题,除了样式之外,UI 的大小/比例也有差异。Crisp主题看起来放大了110%的经典。

是否可以将清晰主题的大小缩小到经典主题的大小?我意识到样式会带来填充,边框和图像大小,这些填充,边框和图像大小将为每个主题下的组件设置。但我仍然想知道是否可以缩小尺寸?

提前致谢

是的,字体更大(清晰时为 13px,经典字体为 12px),而且它们都使用不同的字体方案,这也会增加一些差异。

对于您缩小字体大小的问题,答案当然是肯定的,这是可能的。你可能会走一条糟糕的道路,创建一堆CSS规则来覆盖已经清晰的内容,这肯定会奏效。

但是,更好的选择是完全创建自己的主题。您可以创建一个清晰的扩展主题,然后简单地调整您想要不同的各个区域(字体大小、不同组件上的填充等)。如果你这样做,请记住,清脆的主题扩展了海王星主题,而经典主题只扩展了中性(海王星也扩展了)。我之所以这样说,是因为如果您查看实际清晰的主题,就您要调整的内容(填充,边距等)而言,它非常裸露。这是因为其中大部分都来自海王星主题,所以你可能会帮自己一个忙,熟悉这两个主题,以便最有效地实现你所追求的结果。

如果您以前没有做过自定义 Ext JS 主题,请务必查看此处的指南:http://docs.sencha.com/extjs/5.0/core_concepts/theming.html。本指南还有一个很好的图表,说明了默认主题包的主题继承,因此请务必也查看一下。

希望对您有所帮助!

最新更新