extjs 4 怎样调节组件标题的高度

extjs 4 怎样调节组件标题的高度,第1张

如果是通用的写css margin padding 然后再组件加cls,

如果不是就在组件中写margin 或padding,也可以写成style='margin:5px'

标题的高度可以直接设置 height属性

Ext.onReady(function() {

    var testStore = Ext.create('Ext.data.Store', {

            fields : ['code', 'name'],

            data : [{

            name : "先生",

            code : "01"

            }, {

            name : "女士",

            code : "02"

            }, {

            name : "先生",

            code : "03"

            }, {

            name : "女士",

            code : "04"

            }, {

            name : "先生",

            code : "05"

            }, {

            name : "女士",

            code : "06"

            }, {

            name : "先生",

            code : "07"

            }, {

            name : "女士",

            code : "08"

            }, {

            name : "先生",

            code : "09"

            }, {

            name : "女士",

            code : "10"

            }, {

            name : "先生",

            code : "05"

            }, {

            name : "女士",

            code : "06"

            }, {

            name : "先生",

            code : "07"

            }, {

            name : "女士",

            code : "08"

            }, {

            name : "先生",

            code : "09"

            }, {

            name : "女士",

            code : "10"

            }]

    })

    var testCombo = Ext.create('Ext.form.field.ComboBox', {

        displayField : 'name',

        valueField : 'code',

        editable : false,

        store : testStore,

        emptyText : 'hello',

        listConfig : {

            maxHeight : 100,

            getInnerTpl : function() {

                return '<div data-qtip="{code}">{name}</div>'

            }

        }

    })

    

    Ext.create('Ext.container.Viewport', {

        layout : 'absolute',

        items : [testCombo]

    })

})

结果图:

combobox 本身的 maxHeight 不起作用,用 listConfig 中的 maxHeight 来设定

//增加CSS样式即可达到效果

.x-grid3-row td,.x-grid3-summary-row td{

line-height:18px//控制GRID高度

vertical-align:top//垂直居中

border-right: 1px solid #eceff6 !important//控制列线

border-top: 1px solid #eceff6 !important//控制行线


欢迎分享,转载请注明来源:内存溢出

原文地址: https://outofmemory.cn/tougao/11011976.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-13
下一篇 2023-05-13

发表评论

登录后才能评论

评论列表(0条)

保存