Dermapet Lime Sulfur Dip For Cats

Ext.Viewport object. ASIMO

This object is a special container within the core of Ext Js (much like Ext.Panel), which represents the visible area of \u200b\u200bthe application.
its class hierarchy is:


say it is special because:

• automatically renders the HTML document body (document.body).
• Adjust the size of the window as this will be resized. (Try resizing the window in the demo ).
• can only be one object per page Ext.Viewport.
• displacement does not support (Scrolling), if needed, it must be implemented by child components, such as a Ext.Panel.
  

Well enough is enough, give me something to do, show me some code ...
Example:

Code snippet - on Snipplr

Explaining a little:

Ext.onReady (); This function runs when DOM is ready and can be referenced, it is like the body onLoad event, but the difference is not expected onReady loading the images, styles, JavaScript and the DOM, so this ready before the onLoad event. (Have a look the ExtJS API . )

All objects have something called "Configuration options" that come to be the first choices of each object, and here items is precisely one of the options Ext.Viewport. Some other options are:

• anchor: This option should be used when the container has been configured with a content management AnchorLayout.
• disabled: Enable or disable the component, the default value is false.
• hidden : This property sets the object to determine whether it should be shown or not.
• HideBorders : Indicates whether or not to be painted the borders, default value false
• layout: Indicate the size and position to take the objects inside the container.
• items: May be an object or an array of objects. This is one of the ways in which we can add child components inside another object, in this case the container Ext.Viewport. Example

;

• a single object: items
:{...}
• several objects: items_ [{...}, {...}]
  

These objects (items) can be any class-based object Ext.Component which we find expressed in two ways:

• A complete instance :
  

Code snippet - on Snipplr

TextField

being: items: {name}

• U n object literal (literal object , dynamic object) that contains a set of properties and values \u200b\u200bthat:

1 .- It has specified the type of object using xtype, which must be one the list falls within Ext.Component.
2 .- If xtype is not specified, the value of the container DefaultType (Contein) will be used and this 'panel'.
being:

Code snippet - items on Snipplr

The result is the following:


View demo: Viewport
know it sounds a little thing anything, but I hope to move forward, to see examples useful.

Conclusion:

Well as we create an object Ext.Viewport, is very simple and we all have the bases on the concepts of object-oriented programming, and as I said earlier it is much like programming in Java, (remember when you change the color .... my first panel; -)), in addition to the way objects are added is very clear, thanks to JSON, I hope I can explain a little about this notation.

Links:
Ext JS API
Material support.