0

我将使用 Phonegap + Durandal 开发一个混合应用程序。到目前为止,我正在开发一个经典的 Web 应用程序,并计划在我对应用程序的功能集感到满意后立即切换到混合。

到目前为止,我意识到在使用我的 Nexus 4 或 Nexus 7 平板电脑时,Durandal 在从一个视图切换到另一个视图时执行的转换非常草率且不流畅。

有谁知道如何加快速度?最后的选择是完全关闭过渡,但这将是非常可悲的=(

更新:好的,发现 eg entry.js 似乎使用 Javascript 动画而不是 CSS3 动画。猜那是从哪里开始修复

4

1 回答 1

1

I did use this library: css3 transit is much faster that default

and change the entrance.js (probably you need to adapt for you but this worked for me)

define(['../system'], function(system) {
var fadeOutDuration = 100;

var entrance = function(parent, newChild, settings) {
    return system.defer(function(dfd) {
        function endTransition() {
            dfd.resolve();
        }

        function scrollIfNeeded() {
            if (!settings.keepScrollPosition) {
                $(document).scrollTop(0);
            }
        }

        if (!newChild) {
            scrollIfNeeded();

            if (settings.activeView) {
                $(settings.activeView).transition({
                      opacity: 1,
                      scale: 0.3,
                      duration: duration,
                      easing: 'in',
                      complete: function(){
                        $(settings.activeView).css('display' ,'none');
                            if (!settings.cacheViews) {
                                ko.virtualElements.emptyNode(parent);
                            }
                            endTransition();
                        }
                    });


            } else {
                if (!settings.cacheViews) {
                    ko.virtualElements.emptyNode(parent);
                }
                endTransition();
            }
        } else {
            var $previousView = $(settings.activeView);
            var duration = settings.duration || 500;

            function startTransition() {
                scrollIfNeeded();

                if (settings.cacheViews) {
                    if (settings.composingNewView) {
                        ko.virtualElements.prepend(parent, newChild);
                    }
                } else {
                    ko.virtualElements.emptyNode(parent);
                    ko.virtualElements.prepend(parent, newChild);
                }

                var startValues = {
                    //marginLeft: '90%',
                    //marginRight: '-20px',
                    opacity: 0,
                    scale: 0.3,
                    display: 'block'
                };

                var endValues = {
                    //marginRight: 0,
                    //marginLeft: 0,
                    opacity: 1,
                    scale: 1
                };
                $(newChild).page();
                $(newChild).trigger('create');
                $(newChild).css(startValues);
                $(newChild).transition(
                    {
                      marginRight: 0,
                      marginLeft: 0,
                      opacity: 1,
                      scale: 1,
                      duration: duration,
                      easing: 'in',
                      complete: endTransition
                    });
                    //startValues,500, 'ease');
                //$(newChild).transition(endValues, duration, 'swing', endTransition);
                //$(newChild).transition({ opacity: 0.1, scale: 0.3 }, 500, 'in', function() {..});
                //endTransition();
            }

            if ($previousView.length) {
                $previousView.transition({
                      opacity: 0,
                      scale: 0.3,
                      duration: 500,
                      easing: 'in',
                      complete: function(){
                          $previousView.css('display' ,'none');
                          startTransition();
                      }
                });

                //$('.news').css('display','none');

                //$previousView.fadeOut(fadeOutDuration, startTransition);
            } else {
                startTransition();
            }
        }
    }).promise();
};

return entrance;

});

sorry for my bad English.

于 2014-01-10T19:27:17.637 回答