2017-03-14 13 views
1

最初に、私が達成しようとしていることを私の目的に伝えます。私はハイブリッドアプリを持っており、スワイプアクションはネイティブアプリの感触を与えていません。ネイティブアプリのタブ間をスワイプするときと同様に、現在のタブのスライドと新しいタブが表示されます。これはあまり急ではありません。ネイティブアプリに触れないと最初のタブの半分と2番目のタブの半分を見る状態にすることができます。 (whatsAppタブのスライドアクションを確認してください)。

今私は、ngTouchngSwipeLeftngSwipeRightを使用しています。スライドが完了したときにアニメーションを追加すると、非常に突然ですが、UIが悪いです。 startmoveendcancel:あなたは$swipedocumentationを読んでいる場合

は、swipeアクションの4つのイベントがあります。 どのようにこれらのイベントをオーバーライドして、カスタムCSSをフローに追加することができますか?

スワイプイベントを取得してその時点で機能を追加するにはどうすればよいですか。私は別の方法で私の問題を解決したものの、

enter image description here

+0

はnormaly、それは非常に単純でなければなら役立つかもしれない

angular.module('xpresso') .directive('customizableswipe',['$swipe','$window', function($swipe,$window){ return { restrict: 'EA', link: function(scope,ele,attrs,ctrl){ var startX,startY; $swipe.bind(ele,{ 'start' : function(coords){ console.log("Coord start is :: ",coords.x); }, 'move' : function(coords){ console.log("Coord move is :: ",coords.x); }, 'end' : function(coords){ console.log("Coord end is :: ",coords.x); }, 'cancel' : function(coords){ console.log("Coord cancel is :: ",coords.x); } }); } } }]); 

希望を。独自のリスナー関数で 'event.preventDefault'と' event.stopPropgination'を使ってデフォルトイベントを止めてください。 – mtizziani

+0

@mtizzianiしかし、私はちょうどそのような4つのイベントの呼び出しで、自分自身のCSS機能を追加したいと思います。これらのイベントが呼び出された時点で、何かを追加したいだけです。 – arqam

+0

@arqumあなたはあなたのCSS文を重要な声明を試してみましたか?例えば'.classOfSomething {色:赤!重要; } 'これは、cssにインライン文よりも強力に扱うように指示します。おそらくこれは、CSS機能を操作したいだけの場合に役立ちます。それ以外の場合は、すべての処理が完了して元のイベントが呼び出されるまで元のイベントを停止するjsイベントを使用する必要があります。 – mtizziani

答えて

0

だから、私は$swipebindメソッドをオーバーライドする方法を共有することになり。

ディレクティブcustomizableswipeが作成されたと言うならば、以下のように、4つの方法がoverridenことができます。これは誰か:)

関連する問題