2011-08-28 4 views
0

Qooxdoo를 이해하려고합니다.qooxdoo에서 크기를 조정할 수있는 윈도우의 최적 레이아웃 선택

그래서 "VBox"레이아웃을 사용하는 창은 툴바에서도 작동하지만 테이블 구성 요소 은 올바르게 작동하지 않습니다.

qx.Class.define("tiny.MainWindow", 
{ 
extend : qx.ui.window.Window, 

construct : function() 
{ 
    this.base(arguments, "tiny") 
    this.setContentPadding(0); 

    this.setWidth(400); 
    this.setHeight(300); 

    var layout = new qx.ui.layout.VBox(); 
    this.setLayout(layout); 
    this.setShowMinimize(false); 
    this.setAllowClose(false); 
    this.setContentPadding(0); 
    this.open(); 

    // toolbar and buttons is hidden 
    // because only table works wrong 

    var tableModel = new qx.ui.table.model.Simple(); 
    tableModel.setColumns(["ID"]); 
    tableModel.setData([[0],[1],[2],[3]]); 

    var table = new qx.ui.table.Table(tableModel); 
    this.add(table, {row: 1, column: 0, colSpan: 10}); 

    this.add(table, {flex: 1}); 
} 
}); 

var tiny_window = new tiny.MainWindow(); 
tiny_window.open(); 
tiny_window.moveTo(100, 100); 

나는이 출력을 가지고 : 은 "속성 '행'는 VBox의 레이아웃을 지원하지 않습니다!"

표가 올바르게 표시되었지만 세로 크기 조정이 표 크기를 변경하지 않음 표가 올바르게 표시됩니다.

그래서 테이블 구성 요소, 도구 모음과 함께 사용해야하는 레이아웃 유형은 무엇입니까?

추신 : 이미 "도킹"레이아웃을 시도했습니다. "row '속성은 Dock 레이아웃에서 지원되지 않습니다!'row '값은 배열'flex, edge, height, width '에 정의 된 값을 가져야합니다." 테이블 크기를 정의하는 다른 방법이 필요할 수 있습니까?

답변

2

바로 창에서 하나의 항목을 가지고있는 귀하의 경우 최적의 레이아웃은 아마

qx.ui.layout.Grow() 
+0

감사 것은 그리드 레이아웃

에만 유효 라인

this.add(table, {row: 1, column: 0, colSpan: 10}); 

드롭 , 솔루션이 작동합니다. 코드 작성에 더 세심한주의를 기울여야합니다. – ISE