Question

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

用firebug对它进行第二个视图，即dojox.mobile.ScrollableView，将css属性margin-top设置为115px并将其置于绝对位置。在firebug中，如果我删除margin-top属性并将位置设置为relative，则所有内容都显示正常。

在WL studio中，我无法设置此属性，因为它们似乎被覆盖，所以我设置了一个margin-top：-70px，采用第二种EdgeToEdgeList样式。

这是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>

自开始以来显示一切正常的任何提示？

Answer 1

有两件事可能导致这类问题：

加载dojox / mobile / deviceTheme模块的方式。应使用脚本标记加载此模块，如下所述：https://dojotoolkit.org/reference-guide/1.8/dojox/mobile/deviceTheme.html#loading-devicetheme-with-a-script-tag。
主体上的“display：none”样式可防止dojox / mobile在启动时正确计算尺寸。这应该更改为“visibility：hidden”。

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

WL 5.0.5 EdgeToEdgeList第一个元素不在标题下但在页面中间

1 个答案: