0

Phonegap + Durandal を使用してハイブリッド アプリを開発します。これまでのところ、私は従来の Web アプリを開発しており、アプリの機能セットに満足したらすぐにハイブリッドへの切り替えを計画しています。

これまでのところ、Nexus 4 または Nexus 7 タブレットを使用している場合、あるビューから別のビューに切り替えるときにデュランダルが実行しているトランジションがかなりずさんで非流動的であることに気付きました。

スピードアップする方法を知っている人はいますか？最後のオプションは、トランジションをまったくオフにすることですが、それはかなり悲しいことです =(

更新: たとえば、entry.js が CSS3 アニメーションの代わりに Javascript アニメーションを使用しているように見えることがわかりました。修正を開始する場所を推測します

4

1 に答える 1

1

私はこのライブラリを使用しました： css3トランジットはデフォルトよりもはるかに高速です

entry.jsを変更します（おそらくあなたに適応する必要がありますが、これは私にとってはうまくいきました）

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;

});

私の悪い英語でごめんなさい。

于 2014-01-10T19:27:17.637 に答える