Web \ud654\uba74\uc744 \uc124\uacc4 \ud558\ub294 \uacbd\uc6b0 \ubcf4\ud1b5 Layout\uc744 \uc774\uc6a9\ud55c\ub2e4. Absolute\ub97c \uc774\uc6a9\ud558\ub294 \uac83\uc774 \uac00\uc7a5 \uae54\ub054\ud558\uace0 Design\uc774 \uc798 \ub098\uc624\uc9c0\ub9cc \uc815\ubcf4 \uc870\ud68c\ub97c \ud558\uae30 \uc704\ud574 ExtJs\ub97c \uc0ac\uc6a9\ud55c Form\uc774\ub098 Grid \ub4f1\uc744 \uc774\uc6a9\ud560 \uacbd\uc6b0\uc5d0\ub294 \uc0dd\ub6b1\ub9de\uc740 Component\uac00 \ud654\uba74 \ud55c \uac00\uc6b4\ub370 \ub369\uadf8\ub7ec\ub2c8 \ub5a8\uc5b4\uc838 \uc788\uc9c0 \uc54a\uc73c\ub824\uba74 Layout\uc744 \uc774\uc6a9\ud558\uc5ec \uc801\uc808\ud55c \ubc30\uce58\ub97c \ud558\ub294 \uac83\uc774 \ud544\uc694\ud558\ub2e4.<\/p>\n
\uc774 \ub54c, Grid\ub294 <table> \ud0dc\uadf8 \ub0b4\uc5d0 \uc874\uc7ac\ud558\ub294 \uacbd\uc6b0 table DOM\uc758 \ud06c\uae30 \ubcc0\ud654\uc5d0 \ubc18\uc751\ud558\uc9c0 \uc54a\ub294\ub2e4. \uc989, Layout\uc5d0 \uc9c1\uc811\uc801\uc778 \uc601\ud5a5\uc744 \ubc1b\ub294 \uacbd\uc6b0 ( Layout\uc774 \uc774\uc815\ub41c Component, Container \ub4f1\uc5d0 \uc9c1\uc811 \ubc30\uce58\ub41c \uacbd\uc6b0)\uc5d0\ub294 \ud654\uba74 \ub808\uc774\uc544\uc6c3 \ubcc0\uacbd\uc5d0 \ubc18\uc751\ud558\uc9c0\ub9cc <table> \ud0dc\uadf8 \ub0b4\uc5d0 \uc874\uc7ac\ud558\ub294 \uacbd\uc6b0(\ud654\uba74 \ubc30\uce58\ub97c \uc704\ud574 table\uc744 \uc774\uc6a9\ud558\ub294 \uacbd\uc6b0, \ub610\ub294\u00a0<div>\ub85c \uc704\uce58 \uc870\uc815\ud55c \uacbd\uc6b0)\u00a0\uc544\ubb34\ub9ac width:100%\ub97c \uc9c0\uc815\ud574\ub3c4 \ucc98\uc74c \ubc30\uce58\ub41c \uadf8 \ud06c\uae30 \uc774\uc0c1\uc73c\ub85c \ub298\uc5b4\ub098\uac70\ub098 \uc904\uc5b4\ub4e4\uc9c0 \uc54a\ub294\ub2e4. Column\uc740 \ub9d0\ud560\uac83\ub3c4 \uc5c6\uace0.<\/p>\n
\uc5ec\ub7ec \uc790\ub8cc\ub97c \ucc3e\uc544\ubd24\ub354\ub2c8 \ub2e4\uc74c\uacfc \uac19\uc740 \ud574\uacb0\ucc45\uc774 \uc81c\uc2dc\ub418\uc5c8\ub2e4.
\n1. viewConfig: { forceFit: true, … \ucd94\uac00 ( Container\uc5d0 \uc788\ub294 \uacbd\uc6b0\ub9cc \ubc18\uc751)
\n2. width : 100%, autoSize : true, … (Container\uc5d0 \uc788\ub294 \uacbd\uc6b0\ub9cc \ubc18\uc751)
\n3. viewConfig : {
\nlisteners: {
\nrefresh: function(dataview) { … \uc801\uc6a9 \uc548\ub428<\/p>\n
\uacb0\ub860\uc740 \ubaa8\ub450 \uc2e4\ud328\uc600\ub2e4.<\/p>\n
\uc774\ub7f0 \uacbd\uc6b0 EventManger\ub97c \ud1b5\ud574 grid\uc758 \ud06c\uae30 \uc870\uc815\uc744 \uc9c1\uc811 \uc9c0\uc815\ud560 \uc218 \uc788\ub2e4.<\/p>\n
Ext.EventManager.onWindowResize(function(w, h){
\nExt.getCmp(‘grid1’).setWidth( w – 20);
\n});<\/p>\n
onWindowResize \uc774\ubca4\ud2b8\uc5d0 \ubc18\uc751\ud558\ub294 EventManger\ub294 grid\uc758 \ud06c\uae30 \uc678\uc5d0 grid\uc758 column \ud06c\uae30 \uc870\uc815\uacfc \uac19\uc740 \ub2e4\ub978 \ub2e4\uc591\ud55c layout \uad00\ub828 \uc791\uc5c5\uc744 \ud560 \uc218 \uc788\ub2e4. \ub2e4\ub9cc, grid\uc758 \ud06c\uae30\ub97c \uc870\uc808\ud560 \ub54c\ub294 \ubc18\uc751 \uc18d\ub3c4\uac00 \uc57d\uac04 \ub290\ub9ac\ub2e4\ub294 \ub2e8\uc810\uc774 \uc788\uc73c\ub2c8 \uae54\ub054\ud55c \ud574\uacb0\ucc45\uc774\ub77c\uace0 \ud560 \uc218\ub294 \uc5c6\ub2e4.<\/p>\n
<\/p>\n
<\/p>\n
<\/p>\n","protected":false},"excerpt":{"rendered":"
Web \ud654\uba74\uc744 \uc124\uacc4 \ud558\ub294 \uacbd\uc6b0 \ubcf4\ud1b5 Layout\uc744 \uc774\uc6a9\ud55c\ub2e4. Absolute\ub97c \uc774\uc6a9\ud558\ub294 \uac83\uc774 \uac00\uc7a5 \uae54\ub054\ud558\uace0 Design\uc774 \uc798 \ub098\uc624\uc9c0\ub9cc \uc815\ubcf4 \uc870\ud68c\ub97c \ud558\uae30 \uc704\ud574 ExtJs\ub97c \uc0ac\uc6a9\ud55c Form\uc774\ub098 Grid \ub4f1\uc744 \uc774\uc6a9\ud560 \uacbd\uc6b0\uc5d0\ub294 \uc0dd\ub6b1\ub9de\uc740 Component\uac00 \ud654\uba74 \ud55c \uac00\uc6b4\ub370 \ub369\uadf8\ub7ec\ub2c8 \ub5a8\uc5b4\uc838 \uc788\uc9c0 \uc54a\uc73c\ub824\uba74 Layout\uc744 \uc774\uc6a9\ud558\uc5ec \uc801\uc808\ud55c \ubc30\uce58\ub97c \ud558\ub294 \uac83\uc774 \ud544\uc694\ud558\ub2e4. \uc774 \ub54c, Grid\ub294 <table> \ud0dc\uadf8 \ub0b4\uc5d0 \uc874\uc7ac\ud558\ub294 \uacbd\uc6b0 table DOM\uc758 \ud06c\uae30 \ubcc0\ud654\uc5d0 […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[8],"tags":[],"class_list":["post-239","post","type-post","status-publish","format-standard","hentry","category-extjs"],"_links":{"self":[{"href":"https:\/\/www.fsquare.co.kr\/index.php?rest_route=\/wp\/v2\/posts\/239","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.fsquare.co.kr\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.fsquare.co.kr\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.fsquare.co.kr\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.fsquare.co.kr\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=239"}],"version-history":[{"count":3,"href":"https:\/\/www.fsquare.co.kr\/index.php?rest_route=\/wp\/v2\/posts\/239\/revisions"}],"predecessor-version":[{"id":242,"href":"https:\/\/www.fsquare.co.kr\/index.php?rest_route=\/wp\/v2\/posts\/239\/revisions\/242"}],"wp:attachment":[{"href":"https:\/\/www.fsquare.co.kr\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=239"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.fsquare.co.kr\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=239"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.fsquare.co.kr\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=239"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}