Splitter Example

DQ.afterLoad(function () {
    //外枠
    panel1 = new DQ.UI.Panel(DQ.page(), {}, "Panel1");
    panel1.borderStyle(DQ.UI.BorderStyle.fixedSingle);
    panel1.dock(DQ.UI.DockStyle.Fill);

    //左
    panel2 = new DQ.UI.Panel(panel1, {}, "Panel2");
    panel2.borderStyle(DQ.UI.BorderStyle.dockable);
    panel2.dock(DQ.UI.DockStyle.Left);

    //左右
    sp1 = new DQ.UI.Splitter(panel1, {}, "Sp1");

    //右上
    panel3 = new DQ.UI.Panel(panel1, { minimizeBox: true }, "Panel3");
    panel3.borderStyle(DQ.UI.BorderStyle.dockable);
    panel3.dock(DQ.UI.DockStyle.Top);

    //上下
    sp2 = new DQ.UI.Splitter(panel1, {}, "Sp2");
    sp2.dock(DQ.UI.DockStyle.Top);

    //右下
    panel4 = new DQ.UI.Panel(panel1, {}, "Panel4");
    panel4.borderStyle(DQ.UI.BorderStyle.fixedSingle);
    panel4.dock(DQ.UI.DockStyle.Fill);
});