[英]Ext JS make paging toolbar smaller
我有一个非常简单的问题,但我似乎没有找到一个简单的答案。 事实上,我没有找到任何答案如何使Ext JS网格的分页工具栏更小。
我做了一个非常简单的小提示来研究它是如何工作的,看起来在某些时候ExtJS将动态计算分页工具栏中元素的位置。 具体来说,设置了'left'css属性。
所以我想知道如何调整计算这些值的函数,以便我可以减少这些值。 我可以使用jQuery / Javascript来做到这一点,但这听起来很错,所以我更喜欢干净的ExtJS方式来做到这一点。
所以不要这样......
我想看到这个:
例如,我的示例中的“上一页”按钮具有声明的内联css样式(很可能由分页工具栏小部件完成),左侧为41px,而分隔符图标为相同“左”样式的81px。 这将继续,直到覆盖工具栏的整个宽度。
总而言之,我想要的是拦截计算并减少元素的值以降低工具栏的整个宽度。
欢迎大家提出意见。
首先设置按钮的宽度。
new Ext.Button({
width: 100, <<== width of the button
text: 'Smaller paging toolbar',
// ...
然后,您可以在按钮之前使用工具栏分隔符将元素移动到右侧:
[
{xtype: 'tbseparator', width: 200 },
new Ext.Button({
// ...
这是你纠正的小提琴
以为我会回答我自己的问题。 有一个配置,当工具栏太小时启用水平滚动:
Ext.create('Ext.PagingToolbar', {
overflowHandler: 'scroller'
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.