在qooxdoo中为可调整大小的窗口选择最佳布局

时间:2011-08-28 17:42:04

标签: layout ria javascript-framework 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布局不支持属性'行'。”

表格显示正确,但垂直调整大小不会改变 桌面垂直尺寸。

那么,我必须使用哪些布局类型与表组件,工具栏?

P.S。:我已经尝试过“Dock”布局了。这里,错误类似:“Dock布局不支持属性'行':值'row'必须具有数组'flex,edge,height,width'”中定义的任何值。也许我需要其他方式来定义表格大小?

1 个答案:

答案 0 :(得分:2)

删除该行

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

它仅适用于网格布局

在您的情况下,窗口中只有一个项目的最佳布局可能是

qx.ui.layout.Grow()