Предотвращение прокрутки из CordovaView в Кордове для Windows Phone 8

В приложении Windows Phone 8 Cordova я могу щелкнуть и перетащить по горизонтали в приложение и панорамировать/прокрутить мимо горизонтального края дисплея. См. Приложение автономного шаблона Windows Phone 8 от Cordova:

Panning horizontally past the edge of the Cordova app

HTML за этим приложением шаблона имеет правильную спецификацию видового экрана, насколько я могу видеть:

<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />

Эта ошибка препятствует тому, чтобы любой вид распознавания жестов был полезен. Элемент управления iOS UIScrollView имеет свойство bounces, которое позволяет несколько смягчить эффект.

Это ошибка Кордовы? Есть ли какая-то настройка, которая может быть помещена в контейнер Cordova WebBrowser таким образом, что это панорамирование не может произойти?

Ответы

Ответ 1

Два дополнительных свойства CSS в теге body исправили проблему панорамирования как в отдельном приложении шаблона, так и в исходном приложении, над которым я работал:

body {
  overflow: hidden;
  -ms-content-zooming: none; }

Это свойство ms-content-zooming не ограничивает вертикальную прокрутку в элементах, являющихся дочерними элементами элемента body.

Ответ 2

пожалуйста, используйте это в теге body вашего HTML... я исправил эффекты подпрыгивания и резинки.

 backface-visibility:hidden;
-webkit-backface-visibility:hidden;
 overflow: hidden;
-ms-content-zooming: none;
-ms-touch-action:none;

Ответ 3

Это действительно работающее решение:

 <style>
    html {
        -ms-touch-action: pan-x;
        touch-action: pan-x;
    }

    body {
        -ms-touch-action: pan-y;
        touch-action: pan-y;
        -ms-content-zooming: none;
    }
</style>

Это предполагает, что ваше приложение не имеет горизонтальной прокрутки (какие гибридные приложения, подобные родным, не должны иметь)

Ответ 4

Вы можете добавить следующий код в файл MainPage.xaml.cs:

    // Constructor
    public MainPage()
    {
        InitializeComponent();
        .... // some default initialization code was here
        // and disable bouncy scrolling option:
        this.CordovaView.DisableBouncyScrolling = true;
    }

Ответ 5

Правильный ответ заключается в добавлении this.CordovaView.DisableBouncyScrolling = true; к вашему файлу MainPage.xaml.cs, но в этом случае вы не можете использовать его для сборки Adobe Phonegap, поскольку этот файл xaml не может быть отправлен.

Ответ 6

body {-ms-touch-action: none; }

Ответ 7

Мы использовали положение абсолютное на главной обертке, и оно зафиксировало наш прецедент.

Ответ 8

это решило мою проблему с телефонной связью:

if (navigator.userAgent.match(/IEMobile/))
    {
        var ieBodyHeight = $("body").outerHeight();
        var ieBodyHeightNew = ieBodyHeight - 55;
        $("head").append('<meta name="viewport" content="height=' + ieBodyHeightNew + '" />');
    }