PDA

View Full Version : Mirror contents of a panel



fabio.policeno
22 Jul 2013, 4:06 AM
Hello,


There is a better way to replicate (mirror) the content of a panel to another panel mini? As the power point, where I have a screen and next to a mini screen representing its content. Follows a ilustracao I intend to do the following:

44973


Thank you!

slemmon
24 Jul 2013, 3:42 PM
This is a way oversimplified example, but might give you a place to start thinking how you might do this. You'll need to manage the dimensions of things using CSS or something like that. You'll need to watch out for copying content from container A to container B when the content has ID attributes as those cannot be duplicated on a page without consequence, etc.



var largePanel = Ext.widget('panel', {
renderTo: document.body,
cls: 'large-panel',
height: 300,
width: 374,
html: '<img src="http://developer.sencha.com/img/sencha-large.png" />'
});


Ext.widget('panel', {
renderTo: document.body,
cls: 'small-panel',
height: 150,
width: 150,
listeners: {
afterrender: function () {
this.update(largePanel.body);
}
}
});

fabio.policeno
25 Jul 2013, 3:56 AM
Thank you!


My solution was to recreate the component panel and apply a better zoom: 0.1. In chrome worked perfect, but I realized that does not exist in firefox this property in css, but a similar (-moz-transform: scale (0.1) ;) but it does not behave the same way exatamete. How do I use absolute layout and objects are rendered in a precise position, the problem of the-moz-transform in Firefox is that it changes the coordinate of the object. The following screen:


4503645037


There is another solution that solves the firefox?


Thank you!