如何更改 resetToPage 的滑动方向？

Question

我正在构建一个包含多个页面堆栈的应用程序每当我想转到第一页时，我都在使用 resetToPage。

navigator.resetToPage("page2.html", { animation: "slide" }):

默认它是从右到左的过渡我需要完全反转这类似于 popPage 过渡。

我有办法实现它。

Answer 1

您可以在这里找到一些相关信息：http://onsen.io/guide/overview.html#Transitionanimation

基本上，您可以创建一个新的动画师并根据需要定义它。这是 OnsenUI 存储库中的基本示例：https://github.com/OnsenUI/OnsenUI/blob/1.3.14/framework/views/simpleSlideTransitionAnimator.js

如您所见，定义了两个函数：推送和弹出动画。 resetToPage() 像 pushPage() 那样使用 "push" 动画，而不像 popPage()。然而，如果你只是想反转它，你可以创建一个新的动画师并定义它的 "push" 函数，与之前的 "pop" 函数完全相同。你在这里有一个简单的例子：

http://codepen.io/frankdiox/pen/azQMZE

如果您更改转换函数的参数，您将获得不同的行为，因此您可以根据需要进行调整。希望对您有所帮助！

Answer 2

如果你这样做navigator.popPage({animation: "slide"})，那么动画就会反转。

因此，在执行此操作之前，您只需在堆栈中的当前页面之前插入一个页面。

如果要模拟resetToPage，也必须自己销毁之前的页面

var pageStack = navigator.getPages();
for(var len = pageStack.length - 2, i = len ; i >= 0 ; i--) {
   pageStack[i].destroy();
}
navigator.insertPage( 0, "page2.html", { animation: "slide" } );
navigator.popPage({animation: "slide"});

如何更改 resetToPage 的滑动方向？

How to change slide direction for resetToPage?

onsen-ui