スクリプトパネルの中にスクロールを作る方法について

var myPanel = (thisObj instanceof Panel) ?
thisObj :
    new Window("palette",
    "Frame and Cell Manager",
    [100,100, 400,400], // 直接座標を指定
    );

onShowのイベントハンドラをとらなくてもよさそうでしたのと、他にも同様のことをしたい方もいるかもしれませんのでコードを置いておきます。基本的には前述のとおりAutomaticLayoutのタイミングとどのグループにAutomaticLayoutするかが肝になります。

コードはドッキングパネルにしても単独にしても、表示されますし、リサイズも追従してくれます。

(function(isPanel) {
    var res = "panel { \
    orientation: 'column', \
    alignment:['fill', 'fill'], \
    preferredSize : [300,300], \
    \
    header: Group { \
        alignment: ['fill', 'top'], \
    }, \
    \
    list: Panel { \
        orientation: 'row', \
        alignment:['fill', 'fill'], \
        margins: 0, \
        scrollarea: Group { \
            orientation: 'column', \
            alignment:['fill', 'fill'], \
            itemarea: Group{ \
                orientation: 'column', \
                alignment:['fill', 'fill'], \
            }, \
        }, \
        scroll: Scrollbar { \
            alignment: ['right', 'fill'], \
            preferredSize:[15, -1], \
        }, \
    }, \
}";


    function addRow() {
        var group = itemarea.add("group", undefined, {
            name: "row",
        });

        group.orientation = "row";
        group.alignment = ['fill', 'top'];

        var text1 = group.add("edittext", undefined, "", {
            name: "frame"
        })
        text1.alignment = ['fill', 'top'];
        text1.preferredSize = [100, -1]

        var text2 = group.add("edittext", undefined, "", {
            name: "cell"
        })
        text2.alignment = ['fill', 'top'];
        text2.preferredSize = [100, -1]

        text1.text = itemarea.children.length;
        return group
    }

    function calcScrollDistance() {
        var scrollarea = itemarea.parent
        var value = itemarea.size[1] - scrollarea.size[1]
        value = (value < 0) ? 0 : value;
        scrollbar.maxvalue = value
    }

    function calcItemsSize() {
        if (itemarea.children.length === 0) return;
        var item = itemarea.children[0];
        if (item.size === undefined) return;
        var itemarea_height = itemarea.children.length * (item.size[1] + item.spacing) +
            item.parent.margins.top + item.parent.margins.bottom;
        itemarea.size.height = itemarea_height
    }

    var myPanel = (isPanel instanceof Panel) ?
        isPanel :
        new Window("palette",
            "Frame and Cell Manager",
            undefined, {
                resizeable: true
            });

    myPanel.group = myPanel.add(res);

    var itemarea = myPanel.group.list.scrollarea.itemarea;
    var scrollarea = myPanel.group.list.scrollarea;
    var scrollbar = myPanel.group.list.scroll;

    scrollbar.onChange = scrollbar.onChanging = function() {
        itemarea.location = [itemarea.location[0],
            myPanel.group.list.spacing + itemarea.margins.top - this.value
        ]
    }

    myPanel.layout.layout();

    for (var i = 0; i < 60; i++) {
        addRow()
    }

    myPanel.onResize = function() {
        myPanel.layout.resize()
        calcItemsSize()
        calcScrollDistance()
    }

    if (myPanel instanceof Window) {
        myPanel.center();
        myPanel.show();
        itemarea.layout.layout(true)
        calcItemsSize()
        calcScrollDistance()
    } else {
        itemarea.layout.layout(true)
        calcItemsSize()
        calcScrollDistance()
    }

}(this));