Question

我一直在使用esri ArcGIS javascript api已经有一段时间了，我正在使用api和dojox mobile的紧凑版本创建一个适合我们的应用程序（http://webapps.kent.gov.uk/KCC.MyNearestGIS.Web.Sites.Public/Default.aspx）的适合移动设备的版本。登记/> 我想使用可滚动窗格来保存地址搜索的结果，这样我可以保持搜索窗格足够小以适应移动设备的屏幕，但允许用户滚动RoundRectList大小超过的结果固定面板尺寸我无法在IE或Chrome（包括移动模拟器）中滚动ScrollablePane，无论我是以标记还是以编程方式创建它，我都无法理解为什么，因为我认为我正确地遵循了以下示例道场工具包。
我的代码在这里：https://jsfiddle.net/TimSkinner/ue3ok7v4/

function C_CreateLocationResultsGrid(results, resultsHeight){
require(["dojo/dom",
         "dojo/query",
         "dojo/dom-attr",
         "dojo/dom-prop",
         "dojo/_base/declare",
         "dijit/registry",
         "dojox/grid/DataGrid",
         "dojox/mobile/ScrollablePane",
         "dojox/mobile/RoundRectList",
         "dojox/mobile/LongListMixin",
         "dojox/mobile/ListItem",
         "dojo/on",
         "dojo/domReady!"], function (dom, query, domAttr, domProp, declare, registry, DataGrid, ScrollablePane, RoundRectList, LongListMixin, ListItem, on) {

    if (registry.byId("uxLocationGrid") != 'undefined' && registry.byId("uxLocationGrid") != null) {
        registry.byId("uxLocationGrid").destroy();
    }

    var uxLocationGrid;

    if (registry.byId("uxLocationScrollablePane") != 'undefined' && registry.byId("uxLocationScrollablePane") != null) {
        registry.byId("uxLocationScrollablePane").destroy();
    }

    var uxLocationScrollablePane = new ScrollablePane({
        id: 'uxLocationScrollablePane',
        //srcNodeRef: dom.byId('uxLocationSearchResultsDiv'),
        height: resultsHeight,
        allowNestedScrolls: true,
        scrollBar: true,
        scrollDir: 'v',
        scrollType: 0
    });

    uxLocationGrid = new declare([RoundRectList, LongListMixin])({
        id: 'uxLocationGrid',
        select: '',
        tag: 'ul'
    });

    if (registry.byId("uxLocationListHeader") != 'undefined' && registry.byId("uxLocationListHeader") != null) {
        registry.byId("uxLocationListHeader").destroy();
    }

    var uxLocationListHeader = new ListItem({
        id: 'uxLocationListHeader',
        header: true,
        label: 'Select a location',
        clickable: false
    });

    uxLocationGrid.addChild(uxLocationListHeader);

    var uxLocationListItem;

    for (var i = 0; i < results.length; i++) {
        var listItemId = "uxLocationListItem" + i.toString();

        if (registry.byId(listItemId) != 'undefined' && registry.byId(listItemId) != null) {
            registry.byId(listItemId).destroy();
        }

        uxLocationListItem = new ListItem({
            id: listItemId,
            label: results[i].RESULT,
            variableHeight: true,
            anchorLabel: true,
            onAnchorLabelClicked: C_OnLocationRowClickHandler,
            clickable: true
        });

        uxLocationGrid.addChild(uxLocationListItem);
    }

    uxLocationScrollablePane.domNode.appendChild(uxLocationGrid.domNode);
    dom.byId("uxLocationSearchResultsDiv").appendChild(uxLocationScrollablePane.domNode);

    uxLocationGrid.startup();

    uxLocationScrollablePane.startup();
    uxLocationScrollablePane.resize();
});
}

Answer 1

在尝试了几个不同的东西之后，我终于通过在标记中创建可滚动窗格和圆整列表然后以编程方式填充列表来完成此工作。不知道为什么会这样，但确实如此。

dojox / mobile / ScrollablePane不滚动

1 个答案: