modal window inside the panel

Here is example how to create modal windows constrained to panel.

by molecule

HTML

<link rel="stylesheet" href="http://dev.sencha.com/deploy/ext-4.0.7-gpl/resources/css/ext-all.css">

JavaScript

Ext.define('CS.view.StartScreen', { extend: 'Ext.panel.Panel',
    alias: 'widget.startscreen',
    dockedItems: [{
        xtype: 'toolbar',
        dock: 'bottom',
        layout: 'hbox',
        pack: 'center',
        items: [
            {xtype: 'button', text: 'Click Me'}
        ]
    }],
    initComponent : function(){
        var me = this;
        me.floatingPanel = Ext.widget('window', {
            title: 'Hello',
            draggable: true,
            constrain: true,
            modal: true,
            height: 300,
            width: 300
        });
        me.items = [me.floatingPanel];
        me.callParent(arguments);
    }
});

var ss = Ext.create('CS.view.StartScreen', {
    width: 500,
    height: 400,
    //renderTo: Ext.getBody()
});
ss.on('afterrender', function(cmp) {
    cmp.floatingPanel.show();
});
ss.render(Ext.getBody());