tablelayouttest.html 2.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107
  1. <html>
  2. <head>
  3. <link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />
  4. <!-- GC -->
  5. <script type="text/javascript" src="../../ext-all.js"></script>
  6. <script type="text/javascript">
  7. Ext.require(['*']);
  8. Ext.onReady(function() {
  9. if (window.location.search.toLowerCase().indexOf('nocss3') >= 0) {
  10. Ext.supports.CSS3BorderRadius = false;
  11. Ext.getBody().addCls('x-nbr x-nlg');
  12. }
  13. p = Ext.create('Ext.panel.Panel', {
  14. style: {
  15. "float": 'left'
  16. },
  17. id: 'panel1',
  18. frame: true,
  19. layout: {
  20. type: 'table',
  21. columns: 2,
  22. tdAttrs: {
  23. style: 'padding:2px'
  24. }
  25. },
  26. defaultType: 'button',
  27. items: [
  28. { text: 'Button 1'},
  29. { text: 'Button 2'},
  30. { text: 'Button 3'},
  31. { text: 'Button 4'}
  32. ],
  33. renderTo: document.body,
  34. title: 'Table layout Panel'
  35. });
  36. p = Ext.create('Ext.window.Window', {
  37. closable: false,
  38. hidden: false,
  39. floating: false,
  40. resizable: false,
  41. draggable: false,
  42. style: {
  43. "margin-left": '10px',
  44. "float": 'left',
  45. position: 'relative'
  46. },
  47. id: 'panel2',
  48. layout: {
  49. type: 'table',
  50. columns: 2,
  51. tdAttrs: {
  52. style: 'padding:2px'
  53. }
  54. },
  55. defaultType: 'button',
  56. items: [
  57. { text: 'Button 1'},
  58. { text: 'Button 2'},
  59. { text: 'Button 3'},
  60. { text: 'Button 4'}
  61. ],
  62. renderTo: document.body,
  63. header: false,
  64. fbar: {
  65. items: {
  66. text: 'Button'
  67. }
  68. },
  69. headerPosition: "bottom"
  70. });
  71. p = Ext.create('Ext.panel.Panel', {
  72. style: {
  73. "margin-left": '10px',
  74. "float": 'left'
  75. },
  76. id: 'panel3',
  77. frame: true,
  78. layout: {
  79. type: 'table',
  80. columns: 2,
  81. tdAttrs: {
  82. style: 'padding:2px'
  83. }
  84. },
  85. defaultType: 'button',
  86. items: [
  87. { text: 'Button 1'},
  88. { text: 'Button 2'},
  89. { text: 'Button 3'},
  90. { text: 'Button 4'}
  91. ],
  92. renderTo: document.body,
  93. header: false
  94. });
  95. });
  96. </script>
  97. </head>
  98. <body style="padding:10px">
  99. </body>
  100. </html>