在Phonegap IOS中停止过度滚动/反弹

时间:2013-04-29 08:18:15

标签: cordova

我在IOS(ipad)上使用最新版本的Phonegap,我似乎无法在整个应用中禁用垂直过度滚动/反弹。我不介意内部元素,但是当你向上或向下滑动并且整个应用程序上下跳动时它看起来很奇怪。

我已尝试在.plist中将UIWebViewBounce设置为no,但这似乎没有做任何事情。

感谢帮助:)

20 个答案:

答案 0 :(得分:184)

您必须修改config.xml文件中的属性。 只需将以下首选项设置为true

即可
<preference name="DisallowOverscroll" value="true" />

答案 1 :(得分:17)

接受的答案对我不起作用,我必须将UIWebViewBounce设为false

<preference name="UIWebViewBounce" value="false" />

答案 2 :(得分:14)

现在,对于phonegap 3.0以上版本,使用config.xml文件中的以下语法,它将100%

<preference name="DisallowOverscroll" value="true"/>

答案 3 :(得分:6)

如果您在没有运气的情况下将<preference name="DisallowOverscroll" value="true"/>添加到config.xml,则可能是您更改了错误的文件。而是在整个phonegap目录中搜索“DisallowOverscroll”。你应该找到几个实例。将其更改为true.

干杯。

答案 4 :(得分:4)

如果没有其他方法可行,请尝试从您的CSS中移除-webkit-overflow-scrolling: touch ...如果您拥有它!

答案 5 :(得分:4)

使用这种方式: -

function disallowOverscroll(){
  $(document).on('touchmove',function(e){
    e.preventDefault();
  });
  $('body').on('touchstart','.scrollable',function(e) {
    if (e.currentTarget.scrollTop === 0) {
      e.currentTarget.scrollTop = 1;
    } else if (e.currentTarget.scrollHeight
              === e.currentTarget.scrollTop
                  + e.currentTarget.offsetHeight) {
      e.currentTarget.scrollTop -= 1;
    }
  });
  $('body').on('touchmove','.scrollable',function(e) {
    e.stopPropagation();
  });
}
disallowOverscroll();

有关详情或提示&amp;诀窍,请阅读这篇文章click

答案 6 :(得分:3)

在项目的config.xml中,在iOS的首选项下将DisallowOverscroll设置为true。默认情况下,它为false,使整个视图与视图的内部元素一起滚动。

<preference name="DisallowOverscroll" value="true" />

答案 7 :(得分:3)

我有一种方法可以实现这一目标。但它并不常规,因为它处理本机编码。在MainViewController中有一个名为webViewDidFinishLoad的方法。包括这个 theWebView.scrollView.bounces = NO;

在那个方法里面。

- (void)webViewDidFinishLoad:(UIWebView*)theWebView
{
    // Black base color for background matches the native apps
    theWebView.backgroundColor = [UIColor blackColor];
    theWebView.scrollView.bounces= NO;
    return [super webViewDidFinishLoad:theWebView];
}

由于这是ios本机代码,因此可以在任何phonegap / cordova发行版中使用。

答案 8 :(得分:3)

谢谢大家的回答。但如果你在Windows Phone中有问题,这里就是解决方案。 只需转到MainPage.xaml.cs文件并替换下面的函数..

public MainPage()
    {
        InitializeComponent();
        this.CordovaView.DisableBouncyScrolling = true;
        this.CordovaView.Loaded += CordovaView_Loaded;
    }

它适用于我:)

答案 9 :(得分:2)

在项目的config.xml中,在iOS的首选项下将DisallowOverscroll设置为true。

<preference name="DisallowOverscroll" value="true" />

答案 10 :(得分:2)

我有一个类似的问题,但无法解决我到目前为止找到的所有解决方案(比如编辑config.xml)。

但最后,只需编辑正文的CSS属性,然后修复:

html,body
{
  overflow: auto;
  height:100%;
}

答案 11 :(得分:2)

试一试如果您是离子框架用户Abc.html文件内容。

<ion-content has-bouncing="false">

答案 12 :(得分:1)

这对我有用。尝试在phonegap应用的config.xml文件中添加此代码:

<preference name="DisallowOverscroll" value="true">

答案 13 :(得分:1)

这适用于运行phonegap 3.0的我的应用: 将以下行添加到config.xml

<preference name="webviewbounce" value="false"/>

答案 14 :(得分:1)

最好在config.xml中修改两个元素,如下所示:

<preference name="DisallowOverscroll" value="true"/>
<preference name="UIWebViewBounce" value="false" />

答案 15 :(得分:1)

使用此:

<preference name="UIWebViewBounce" value="false" />

答案 16 :(得分:0)

打开xCode - &gt;从左侧菜单中找到并单击config.xml-&gt;并将DisallowOverscroll值false更改为true 或者通过替换之前的代码来使用此代码。

 <preference name="DisallowOverscroll" value="true" />

答案 17 :(得分:0)

对于Cordova 7和iPhone 7 + iOS 11.0.3,修改根目录config.xml并添加它可以很好地工作:

<platform name="ios">
    <preference name="DisallowOverscroll" value="true" />
    <preference name="UIWebViewBounce" value="false" />
    ... (other stuff) ...
</platform>

答案 18 :(得分:0)

更新config.xml之后,我没有运气,如果是你的情况,试试这个。

对于适用于iPhone + iOS 11的iOS,在CDVThemeableBrowser.m文件中,将属性设置为

self.disallowoverscroll = YES;

答案 19 :(得分:0)

DisallowOverscroll对我不起作用。

解决方案是确保无处滚动。

例如,在我的情况下,它比下面的主体宽div(可以更高):

<body>
  <div style="margin: 5%" width: 95%;>something</div>
</div>

现在,div上方的位置比引起滚动的正文大5%。将宽度设置为90%可解决此问题。