使用Cordova的Windows Phone 8上的Ionic Slide-Box有什么好的替代方案?(What is a good alternative to Ionic Slide-Box on Windows Phone 8 using Cordova?)

我正在使用Apache Cordova开发应用程序。 它由两页组成。 我使用离子滑片连接这些页面。 虽然Android和iOS版本上的一切似乎都运行良好,但是当我在wp8上调试应用程序时滑动不起作用。

有没有人知道出路/某种解决方法?

I'm using Apache Cordova to develop an app. It consists of two pages. I connect these pages using the ion-slide. While everything seems to work just fine on the Android and iOS Versions, sliding just won't work when I debug the app on wp8.

Does anybody know a way out / some kind of workaround?

最满意答案

Windows具有不同的触摸模型,这会导致幻灯片出现问题。 我以前用它来解决它包括hammer.js。 Hammer.js可以像您期望的那样处理Windows上的滑动/滑动事件。

你可以做的是在包含离子载玻片的容器上创建一个hammer.js处理程序。 当通过锤子检测到滑动时,您可以在容器/控件本身上调用相应的事件:

Hammer图书馆: http : //hammerjs.github.io

以下是我的一个应用程序中的一些代码,用于处理在Windows上滑动。 它是一个使用jQuery移动滑动页面过渡的应用程序。 在iOS和Android上,JQM swiperight事件在直接附加到contentAbout时可以正常工作,但在Windows上我必须创建一个包装内容的Hammer对象:

var caHammer = new Hammer(document.getElementById("contentAbout")); caHammer.on("swiperight", function () { $("#imgExitAbout").click(); });

注意:此代码在iOS / Android上也可以正常工作,因此您不必拥有基于device.OS的特定于平台的代码

Windows has a different touch model which causes issues with slide. What I used to get around it was include hammer.js. Hammer.js handles slide/swipe events on Windows as you would expect.

What you could do is create a hammer.js handler on the container containing the ion-slide. When a swipe is detected by hammer, you can then call the appropriate event on the container / control itself:

Hammer library: http://hammerjs.github.io

Here is some code from one of my apps to handle sliding on windows. It is an app that used jQuery mobile sliding page transitions. On iOS and Android the JQM swiperight event would work fine when attached to the contentAbout directly, but on Windows I have to create a Hammer object wrapping the content:

var caHammer = new Hammer(document.getElementById("contentAbout")); caHammer.on("swiperight", function () { $("#imgExitAbout").click(); });

Note: This code would work fine on iOS / Android as well so you don't have to have platform specific code based on device.OS

使用Cordova的Windows Phone 8上的Ionic Slide-Box有什么好的替代方案?(What is a good alternative to Ionic Slide-Box on Windows Phone 8 using Cordova?)

我正在使用Apache Cordova开发应用程序。 它由两页组成。 我使用离子滑片连接这些页面。 虽然Android和iOS版本上的一切似乎都运行良好,但是当我在wp8上调试应用程序时滑动不起作用。

有没有人知道出路/某种解决方法?

I'm using Apache Cordova to develop an app. It consists of two pages. I connect these pages using the ion-slide. While everything seems to work just fine on the Android and iOS Versions, sliding just won't work when I debug the app on wp8.

Does anybody know a way out / some kind of workaround?

最满意答案

Windows具有不同的触摸模型,这会导致幻灯片出现问题。 我以前用它来解决它包括hammer.js。 Hammer.js可以像您期望的那样处理Windows上的滑动/滑动事件。

你可以做的是在包含离子载玻片的容器上创建一个hammer.js处理程序。 当通过锤子检测到滑动时,您可以在容器/控件本身上调用相应的事件:

Hammer图书馆: http : //hammerjs.github.io

以下是我的一个应用程序中的一些代码,用于处理在Windows上滑动。 它是一个使用jQuery移动滑动页面过渡的应用程序。 在iOS和Android上,JQM swiperight事件在直接附加到contentAbout时可以正常工作,但在Windows上我必须创建一个包装内容的Hammer对象:

var caHammer = new Hammer(document.getElementById("contentAbout")); caHammer.on("swiperight", function () { $("#imgExitAbout").click(); });

注意:此代码在iOS / Android上也可以正常工作,因此您不必拥有基于device.OS的特定于平台的代码

Windows has a different touch model which causes issues with slide. What I used to get around it was include hammer.js. Hammer.js handles slide/swipe events on Windows as you would expect.

What you could do is create a hammer.js handler on the container containing the ion-slide. When a swipe is detected by hammer, you can then call the appropriate event on the container / control itself:

Hammer library: http://hammerjs.github.io

Here is some code from one of my apps to handle sliding on windows. It is an app that used jQuery mobile sliding page transitions. On iOS and Android the JQM swiperight event would work fine when attached to the contentAbout directly, but on Windows I have to create a Hammer object wrapping the content:

var caHammer = new Hammer(document.getElementById("contentAbout")); caHammer.on("swiperight", function () { $("#imgExitAbout").click(); });

Note: This code would work fine on iOS / Android as well so you don't have to have platform specific code based on device.OS