1

我是 dojo / dojo mobile 的新手。我正在构建一个带有标题和下方项目列表的屏幕。在移动应用程序中非常经典。

<body id="content" style="display: none">
<div data-dojo-type="dojox.mobile.ScrollableView" id="mainView"
    data-dojo-props="selected:true,scrollDir:'v'">

    <h1 data-dojo-type="dojox.mobile.Heading"
        data-dojo-props="label:'Main',fixed:'top'"></h1>

    <div data-dojo-type="dojox.mobile.EdgeToEdgeList" style="margin-top: 0px;">
        <div data-dojo-type="dojox.mobile.ListItem"
             data-dojo-props="label:'Take Picture...',
                              icon:'images/plus-30.png',
                              url:'TakePicture.html',
                              transition:'slide'">
        </div>
    </div>
</div>
<script src="js/initOptions.js"></script>
<script src="js/PhoneGapDemo.js"></script>
<script src="js/messages.js"></script>

问题：列表中的第一项隐藏在标题后面且不可见。（IBM Rich Page Editor、IBM Mobile App Simulator、Apple iOS Simulator 和 iPhone iOS6 中的渲染相同）

我刚开始这个项目，我没有花哨的 CSS 或其他......只是从头开始，添加了 ScrollableView、Header、EdgeToEdgeList 和 ListItems。

解决方法是在 EdgeToEdgeList 上应用一种样式，将其向下移动 40 像素。但它不干净并且破坏了跨平台兼容性（如果标题不总是 40px 高度怎么办？）

我正在使用 DoJo 1.8

谢谢

塞布

4

2 回答 2

0

嗨，即使我是这个 Worklight 的新手，我也不确定，但进入了属性（转到设计并右键单击边到边列表并选择属性），您可以看到标签、样式、布局、所有选项。转到样式并单击属性并更改位置/布局。它可能会有所帮助。如果你做对了，请告诉我。

于 2012-10-30T13:42:22.183 回答
0

解决方案是双重的

  1. 在元素中使用 style="visibility:hidden"，如下

    <body id="content" style="visibility:hidden">

  2. 用一个元素显式加载“mobileDeviceTheme”，而不是让 Dojo 异步加载它（这个模块需要提前加载以允许正确的高度计算）

    <script type="text/javascript" src="dojox/mobile/deviceTheme.js"></script>

之前（dojo/dojo.js 的负载）

塞布

于 2012-12-23T21:12:10.413 回答