1. [ Window 창 ]
흔히 모달창 또는 레이어 팝업이라고 불리우는 컴포넌트입니다.
1.1 [Sample - Code ]
Ext.onReady(function() {
var winObj = Ext.create("Ext.window.Window", {
width : 500,
height : 500,
autoShow : false,
maximizable : true,
modal : true,
title : 'window Title',
html : '<h1>Window</h1>',
closeAction : 'hide',
resizable : true
});
Ext.create("Ext.panel.Panel", {
width : 1000,
height : 1000,
title : 'Panel',
renderTo : Ext.getBody(),
items : [{
xtype : 'button',
text : 'Open Widow',
handler : function(btn) {
winObj.show();
}
}]
})
})
JavaScript
복사
2. [ window에 대표적 config ]
1.
autoShow (default : false) - 윈도우 컴포넌트가 생성 될 때 자동으로 화면에 보여줄지를 결정
2.
draggable (default : false) - 윈도우를 브라우저내에서 드래그앤드롭으로 위치 이동이 가능
3.
resizable (default : true ) - 윈도우의 가로/세로 리사이즈 가능
4.
maximizable : (default : false) - 윈도우를 브라우저 영역내에 가득채우게 하는 최대하 기능
5.
closeAction (default : destroy) - 윈도우의 닫기 버튼 클릭시 동작되는 액션 (destory / hide 두 속성이 있음) destroy면 윈도우창을 닫으면 다시 열리지않음, hide는 닫아도 다시윈도우창을 열 수 있음
6.
modal (default : false ) - 윈도우를 모달창 출력
7.
animateTarget(default : null ) - 윈도우가 오픈되는 동안 포커스가 되는 타켓 (id or element)
