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

解決策は2つあります

  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 に答える
0

こんにちは、このワークライトは初めてです。よくわかりませんが、プロパティに行きました (デザインに移動し、端から端までのリストを右クリックしてプロパティを選択します)。タグ、スタイル、レイアウト、すべてのオプションが表示されます。スタイルに移動してプロパティをクリックし、位置/レイアウトを変更します。それは役立つかもしれません。あなたがそれを正しく理解したら私に知らせてください。

于 2012-10-30T13:42:22.183 に答える