使用 Dojo 提供的灵活多样的布局方式

核心提示： 上面创建方法得到的 FloatingPane 显示如下图所示，用户可以自由地在它的外层容器中移动位置：图 11. FloatingPane: 移动 1图 12. FloatingPane 移动 2下面介绍 FloatingPane 的一些常用属性：closable -- boolean与 Tit

上面创建方法得到的 FloatingPane 显示如下图所示，用户可以自由地在它的外层容器中移动位置：

图 11. FloatingPane: 移动 1

图 12. FloatingPane 移动 2

下面介绍 FloatingPane 的一些常用属性：

closable -- boolean

与 TitlePane 相同，closable 属性定义了该面板是否可以被关闭。

resizable -- boolean

该属性定义了 FloatingPane 是否可以在运行时改变大小。当 resizable 为 true 并引用了 ResizeHandle.css 时，用户可以通过拖动控制点来改变面板的大小

图 13. FloatingPane: resizable 属性示例

dockable -- boolean

该属性定义了 FloatingPane 是否可以被最小化到页面的最下方。与 TitlePane 可以收起面板不同的是，FloatingPane 可以将面板最小化到页面的最下方，如同 Windows 的工具栏。当 dockable 为 true 时，用户可以通过点击面板标题位置向下的三角来最小化面板。最小化的结果如图所示：

图 14. FloatingPane: dockable 属性示例

sytle – object

该属性定义了面板的位置。其中 position 定义是绝对位置还是相对位置，top 和 left 定义了面板左上角的位置，width 和 height 定义了面板的大小。但当面板被拖动或改变大小时，该值不会跟着变化。