-1

worklight 5.0 を使用して簡単なアプリを作成しようとしています。
これは私のデバイス上の私のアプリのスクリーンショットです:

ここに画像の説明を入力

問題はほとんど無視できますが、これを修正したいと思います。

スクリーンショットでは見えにくいので、押したままドラッグする必要があります。タブバーの下に空白があります。

私の CSS では、既に高さを 100% に定義していますが、それでもこの 10 ～ 20 ピクセルのマージンが下部にあります。

以下は私の、

CSS:

#content{
height:100%;
width:100%;
margin:0;
background: -moz-linear-gradient(top,  #1e5799 0%, #7db9e8 49%, #2989d8 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1e5799),
color-stop(49%,#7db9e8), color-stop(100%,#2989d8));
background: -webkit-linear-gradient(top,  #1e5799 0%,#7db9e8 49%,#2989d8 100%);
background: -o-linear-gradient(top,  #1e5799 0%,#7db9e8 49%,#2989d8 100%);
background: -ms-linear-gradient(top,  #1e5799 0%,#7db9e8 49%,#2989d8 100%); /* IE10+ */
background: linear-gradient(to bottom,  #1e5799 0%,#7db9e8 49%,#2989d8 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e5799', endColorstr='#2989d8',GradientType=0 ); 
}

HTML:

<body id="content">
<div data-dojo-type="dojox.mobile.View" id="oneTwoTest"
    data-dojo-props="selected:true" >
    <div data-dojo-type="dojox.mobile.Heading"
        data-dojo-props="label:'HTML'"></div>
    <div data-dojo-type="dojox.mobile.ScrollableView" id="aboutView"
        data-dojo-props="scrollDir:'v'">
        <div data-dojo-type="dojox.mobile.ContentPane" id="aboutViewContentPane" href="pages/about.html" ></div>
    </div>
</div>
4

1 に答える 1

1

Worklight 6.1 を使用して、ヘッダーとナビゲーションバーが固定された単純な Dojo アプリを作成しました。
プレビュー時:

  • Eclipse では、ナビゲーション バーの下にこの白いスペースが表示されます (アプリのバージョンでこれが発生する理由についての質問に対する私のコメントを参照してください)。
  • Worklight Console の MBS または Android エミュレーター/デバイス (Android 4.4.2 を実行) では、空白は表示されません。

ここにエラーがあるとは確信していません。


bodyindex.html 内 のタグの Dojo 関連コンテンツ:
サンプル・プロジェクトのダウンロード

<div data-dojo-type="dojox.mobile.ScrollableView" id="view0" data-dojo-props="selected:true">
    <div data-dojo-type="dojox.mobile.Heading" data-dojo-props="label:'Heading'" fixed="top">
    </div>

    <div data-dojo-type="dojox.mobile.View" id="view1" data-dojo-props="selected:false">
        test
    </div>

    <ul data-dojo-type="dojox.mobile.TabBar" fixed="bottom" data-dojo-props="barType:'tabBar'">
        <li data-dojo-type="dojox.mobile.TabBarButton">Label</li>
        <li data-dojo-type="dojox.mobile.TabBarButton">Label</li>
        <li data-dojo-type="dojox.mobile.TabBarButton">Label</li>
        <li data-dojo-type="dojox.mobile.TabBarButton">Label</li>
    </ul>
</div>


Worklight Studio の RPE 内部:
ここに画像の説明を入力


Worklight Console の MBS で:
ここに画像の説明を入力


Nexus 5 (Android 4.4.x) デバイスの場合:
ここに画像の説明を入力

于 2014-01-09T10:30:28.757 に答える