Hi, I have come across an issue where I am displaying a formPanel on top of a tabPanel, both of which have docked top toolbars, yet both toolbars are being displayed at the same time.

See the screenshots attached, the User Preferences panel appears when clicking the top right settings button from the main tabPanel view.

Code for both views below:

Code:
Ext.define('PinpointersTouch.view.MainView', {
    extend: 'Ext.TabPanel',
    xtype: 'mainview',
    requires: [
        'PinpointersTouch.view.UnitList',
        'PinpointersTouch.view.GMap',
		'PinpointersTouch.view.PreferencesView'
    ],
    config: {
        fullscreen: true,
         tabBar     : {
            docked : 'bottom',
            layout : {
                pack : 'center'
            }
        },
		items: [
			{
				title: 'Home',
				iconCls: 'home',
				html: [
					'<h1>Welcome to Pinpointers Touch</h1>'
				].join("")
			}, {
				xtype: 'unitslist',
				title: 'Locations',
				iconCls: 'locate',
				


			}, {
				xtype: 'gmap',
				title: 'Map',
				iconCls: 'maps',
				


			},{
			    xtype: 'toolbar',
                docked: 'top',
                ui: 'light',
                defaults: {
                    iconMask: true
                },
                items: [
                    { xtype: 'spacer' },
                    { iconCls: 'refresh', itemId: 'btnRefresh' },
                    { iconCls: 'user', itemId: 'btnUserLogout' },
                    { iconCls: 'settings', itemId: 'btnUserPrefs' }
                ]
			}
		]
    }
});
Code:
Ext.define('PinpointersTouch.view.PreferencesView', {
    extend: 'Ext.form.Panel',
    xtype: 'prefsview',
	config: {
		fullscreen:true,
        items: [
			{
				xtype : 'toolbar',
				docked: 'top',
				title: 'User Preferences'
			},
			{
				xtype: 'checkboxfield',
				name : 'showunitlabels',
				label: 'Show Unit Labels'
			},
			{
				xtype: 'selectfield',
				label: 'Auto Update Interval',
				options:[
						{text: '1 Minute',  value: 60},
						{text: '3 Minutes', value: 120},
						{text: '5 Minutes',  value: 300},
						{text: '10 Minutes',  value: 600}
					]
			},
			{
				xtype : 'toolbar',
				docked: 'bottom',
				layout : {
					pack : 'right'
				},
				items: [
					{
						xtype : 'button',							
						text: 'Done',
						itemId: 'btnDone'
					},
					{
						xtype : 'button',							
						text: 'Cancel',
						itemId: 'btnCancel'
						
					}						
				]
			}
		]
    }
});
I just a have listener in a controller which is showing my PreferencesView:

Code:
this.control({
            'button': {
                tap: function(btn) {
					
					if(btn._itemId=='btnUserPrefs') {
						if(this.application.userPrefsPanel==null) {
							this.application.userPrefsPanel =  Ext.create('PinpointersTouch.view.PreferencesView',{
							});
						}
						this.application.userPrefsPanel.show();
						
					}


                }
            }
        });
So as you can see, I end up with overlapping content on both toolbars, is this a bug?