DeferredResize: Boolean
The DeferredResize property determines whether items are resized after the mouse cursor leaves the area.
Available values:
true. Item resizing will take place after the mouse cursor leaves the area.
false. Item resizing will take place after mouse cursor movements (default).
Use JSON or the setDeferredResize method to set the property value and the getDeferredResize method to get the property value.
To execute the example, the HTML page must contain links to the PP.js script files and the PP.css styles file in the <body> tag of the <div> item with the stackPanel identifier and the example itself must be placed in the <script> tag. In the onload event of the <body> tag it is necessary to specify the call of the createStackPanel() function. Add a container with items on the page and implement a handler of the ItemSizeChanging event:
var stackPanel;
function createStackPanel() {
// Create a container
stackPanel = new PP.Ui.StackPanel({
// Do not take into account size of scrollbars
AutoScrollSize: false,
// Set a parent item
ParentNode: "stackPanel",
// Set sizes
Width: 250,
Height: 300,
// Set resize option for container items
IsContentResizable: true,
// Set resize option for item after the mouse cursor leaves the area
DeferredResize: true,
// Enable scrollbars view when necessary
ScrollVisible: true,
ItemSizeChanging: function (sender, args) {
console.log("Container item size changes")
}
});
// Add several buttons
for (var i = 0; i < 3; i++) {
stackPanel.add(new PP.Ui.Button({ Content: "Button "+ i }));
}
Get button contents in the coordinates (20, 20):
// Get button contents which is located in the coordinates (20, 20)
!!(stackPanel.getItemByPoint(20, 20)) ? console.log("Contents: " + stackPanel.getItemByPoint(20, 20).getContent().getContent()) : console.log("Item is not avalable");
As a result the button contents or a message about item unavailability is displayed in the console:
Contents: Button 1
Resizing of the button with the 0 index will not be immediate, but only after the mouse cursor leaves the area. The item will have new size of the frame:
On item resizing, the browser console displays a message about item resizing.
See also: