-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 回答