Thursday, January 12, 2012

Java source coding: How to do body layout

below is an example:

  
<html>
<head>
<title>Hello World Window</title>
<link rel="stylesheet" type="text/css" href="ext-3.0.0/resources/css/ext-all.css" />
<script type="text/javascript" src="ext-3.0.0/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="ext-3.0.0/ext-all.js"></script>

</head>
<body>
<script type="text/javascript">
Ext.onReady(function() {
    
    new Ext.Viewport({
      layout   : 'border',
      defaults : {
        frame  : true,
        split  : true
      },
      items : [
        {
          title       : 'North Panel',
          region      : 'north',
          height      : 150,
          minHeight   : 120,
          maxHeight   : 150,
          split       : true,
          collapsible : true      
        },
        {
          title       : 'South Panel',
          region      : 'south',
          height      : 75,
          split       : false,
          margins     : {
            top : 5
          }
        },
        {
          title       : 'East Panel',
          region      : 'east',
          width       : 100,
          minWidth    : 75,
          maxWidth    : 150,
          collapsible : true
        },
        {
          title        : 'West Panel',
          region       : 'west',
          collapsible  : true,
          collapseMode : 'mini'
        },
        {
          xtype  : 'container',
          region : 'center',
          layout : 'fit',
          id     : 'centerRegion',
          autoEl : {},
          items  : {
            title : 'Center Region',
            id    : 'centerPanel',
            html  'Disposable',
            frame : true
          }
          
        }
      ]
    });
    
    



});
</script> 
<div id='div1'>asdf</div>
</body>
</html>














submitted by guest blogger
rujah ghandi, India Retweet this story

No comments:

Post a Comment