Question

我正在创建一个包含一些HTML内容的面板。我想根据我放在那里的内容增加面板大小。我尝试使用floating:true and overflow:true 但那没用。

知道如何实现这一目标吗？

这是我的代码：

Ext.define("InfoImage.common.view.actionItems.CommonOverlay",{
    extend : 'Ext.form.Panel',
    requires : [
        // 'InfoImage.view.workItemPanel',
        'Ext.TitleBar', 'Ext.Button' ],
    xtype : 'commonOverlay',
    id : 'commonOverlay',

    config : {
        id : 'aboutPanel',
        layout : 'fit',
        modal : true,
        //floating: true,
        overflow: false,
        hideOnMaskTap : false,
        scrollable : false,
        showAnimation:{
            type:'slide',
            direction:'down',
            duration:250,
            easing:'ease-out'
        },
        hideAnimation:{
            type:'slide',
            direction:'up',
            duration:250,
            easing:'ease-out',
            out:true
        },
        centered : true,
        width : 490,
        height : 100,
        styleHtmlContent : true,
        margin: '-20 -20 -20 -20 ',
        style : 'background-color:#FFF; margin-left:-50px;',
        items : [{
            layout:{
                   type:'vbox'
            },
            items:[
                {
                    xtype : 'panel',
                    scrollable:true,
                    id:'message',
                    style:'background-color:#FFFFFF',
                    height : 250,
                    html : ''
                }, {
                    xtype : 'button',
                    text : 'Continue',
                    id : 'aboutcontbtn',
                    ui : 'action',
                    width : '25%',
                    top: 190,
                    left: 330
                   // centered : true
                   // margin : '130 40 0 0'
                }]
        }]

    }
});

Answer 1

您已为面板设置了一个高度：

height : 100,

因此，显然不会根据其内容调整自身大小。

此外，您设置的面板具有适合布局，只有一个项目是另一个具有vbox布局的面板。也可以将第一个面板的布局设置为vbox。

希望这有帮助

如何根据内容调整面板大小

1 个答案: