0

在主视图中使用 EdgeToEdgeList 可以正常工作，如果我从第一个 EdgeToEdgeList 转到其他视图并且在第二个视图 (ScrollableView) 中还有其他 EdgeToEdgeList，则第二个列表中的项目出现在“页面中间”，这是标题和第一个列表项之间有一个空格。

使用 firebug 对其进行调试，第二个视图是 dojox.mobile.ScrollableView，将 css 属性 margin-top 设置为 115px 并将 position 设置为 absolute。在萤火虫中，如果我删除了 margin-top 属性并将位置设置为相对，一切都会很好地显示。

在 WL 工作室中，我无法设置此属性，因为它们似乎已被覆盖，因此我在第二个 EdgeToEdgeList 样式中设置了 margin-top: -70px。

这是html：

<body id="content" style="display: none;" >
    <div data-dojo-type="dojox.mobile.ScrollableView" id="view0" data-dojo-props="selected:true">
        <div data-dojo-type="dojox.mobile.EdgeToEdgeList" id="mylist" >
            <div data-dojo-type="dojox.mobile.ListItem" data-dojo-props="moveTo:'Carreteras'">Testing</div>
            <div data-dojo-type="dojox.mobile.ListItem" data-dojo-props="moveTo:'Carreteras'">Testing</div>
        </div>
    </div>

    <div data-dojo-type="dojox.mobile.ScrollableView" id="Carreteras" data-dojo-props="selected:false,scrollDir:'v'" >
        <h1 data-dojo-type="dojox.mobile.Heading" data-dojo-props="label:'Carreteras',back:'Atras',moveTo:'view0',fixed:'top'"></h1>
        <div data-dojo-type="dojox.mobile.EdgeToEdgeList" id="infoViewContent" style="margin-top: -70px;'">
        <div data-dojo-type="dojox.mobile.ListItem" >Testing1</div>
            <div data-dojo-type="dojox.mobile.ListItem" >Testing1</div>
            </div>
    </div>

    <!--application UI goes here-->
    <script src="js/initOptions.js"></script>
    <script src="js/Repsol.js"></script>
    <script src="js/messages.js"></script>
    <script src="js/adapter.js"></script>
</body>

从一开始就显示一切正常的任何提示？

4

1 回答 1

1

有两件事会导致此类问题：

  • dojox/mobile/deviceTheme 模块的加载方式。此模块应使用脚本标签加载，如下所述：https ://dojotoolkit.org/reference-guide/1.8/dojox/mobile/deviceTheme.html#loading-devicetheme-with-a-script-tag 。
  • 主体上的“显示：无”样式会阻止 dojox/mobile 在启动时正确计算大小。这应该更改为“可见性：隐藏”。

更改这两件事应该可以解决您的问题。

于 2013-03-15T09:29:03.157 回答