在borderContainer中更改contentPane的拆分器位置？答案

【问题标题】：Change splitter position for contentPane in borderContainer?在borderContainer中更改contentPane的拆分器位置？
【发布时间】：2013-08-06 20:11:03
【问题描述】：

我在 BorderContainer 中有 2 个 contentPanes，使用 Dojo Toolkit。很像以下内容：

<div data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="design:'sidebar', gutters:true, liveSplitters:true" id="borderContainerB" style="height: 200px">
    <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="splitter:true, region:'top'" style="width: 100px;">Hi, I'm leading pane<br><br>Lots of stuff goes here.</div>
    <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="splitter:true, region:'center'">Hi, I'm center pane</div>
</div>

我想使用 JavaScript 以编程方式更改拆分器的位置。在一种情况下，我想将它一直移到一边，这样只有一个 contentPane 是可见的。我该怎么做才能改变分离器的位置？

已经试过了：

var datasetArea = document.getElementById("studiesDatasetArea");
datasetArea.style.height = newHeight + "px";

这不起作用，以及：

dojo.widget.byId('studiesDatasetArea').resizeTo(400, newHeight);

这会改变borderContainer的大小，而不是仅仅移动分割器的位置。我不想改变外边框容器的大小。

【问题讨论】：

标签： dojo contentpane border-container

【解决方案1】：

我在这里找到了一些有用的代码来回答我的问题：

http://telliott.net/dojoExamples/dojo-bcExample.html

一个sn-p：

require(["dijit/registry"],
    function(registry)
{
    var myBC = registry.byId("studiesBorderContainer"); // actual JS object

    var topPane = registry.byId("studiesTableArea");
    dojo.style(topPane.domNode, "height", (800-newHeight)+"px");
    myBC.resize();
});

【讨论】：

【解决方案2】：

_layoutChildren: function(/*String?*/ changedChildId, /*Number?*/ changedChildSize){
// summary:
//      This is the main routine for setting size/position of each child.
// description:
//      With no arguments, measures the height of top/bottom panes, the width
//      of left/right panes, and then sizes all panes accordingly.
//
//      With changedRegion specified (as "left", "top", "bottom", or "right"),
//      it changes that region's width/height to changedRegionSize and
//      then resizes other regions that were affected.
// changedChildId:
//      Id of the child which should be resized because splitter was dragged.
// changedChildSize:
//      The new width/height (in pixels) to make specified child

//example:
var bc = digit.byId(‘borderContainerId’);
var newSize = 150;
var childContentPaneId = ‘myPaneId’;
dojo.hitch(bc, bc._layoutChildren(‘childContentPaneId’,newSize));

【讨论】：