2013-04-17 14 views
11

Olaylarım için hammer.js kitaplığını uyguladım. Sorun, aynı anda birden fazla olayın tetiklenmesidir.Hammer.js olay önceliği

Etkinlik önceliğinin bir kısmını ayarlayabilir miyim? Diyelim ki dönüştürme yapılırken tüm diğer olaylar yok sayılır. Dönüşüm durduğunda başka olaylar yapılabilir. Biz

hammertime.on("transform", function(evt) { 
      //transform 
      hammertime.options.drag="false"; 
} 

dönüştüren Ve tamamlandığında dönüşümü zaman geri enabeling başladığında

hammertime.on("transformend", function(evt) { 
      //transformend 
      hammertime.options.drag="true"; 
} 

Bu yaklaşım dışında çalışıyor sürükle engelleyecek seviyede :

hammertime.on("transform", function(evt) { 
     //transform 
    } 

    hammertime.on("drag", function(ev) { 
     //drag 
    } 

Zaten böyle bir şey denedim bazı şeylerde sürükleme geri alınamaz. % 100 çalışan bir iş istiyorum.

var transforming = false; 
hammertime.on("transformstart", function (ev) { transforming = true; ... }); 
hammertime.on("transformend", function (ev) { transforming = false; }); 
hammertime.on("drag", function (ev) { if (!transforming) { ... } }); 

Çekiç her zaman transformend arayarak değilse, o zaman maalesef yapabileceğin tek hata, bir çözüm için: Lütfen yardım ... Bunu yapmanın

+1

set yapıyorsun ederken 'Transform' o? Teşekkür ederim! – Jacob

+0

Evt.stopPropagation() 'veya' evt.preventDefault() 'işlevini denediniz mi? Hammer.JS üzerinde mevcut olup olmadığını bilmiyorum ama jQuery desteğine sahip olduğu gibi düşünüyorum ... – gustavohenke

cevap

7

Tek ucuz yolu olay işleyicileri işbirliği sahip olmaktır Belirli bir süre geçtikten sonra dönüşümünüzü sona erdiren bir çeşit zamanlayıcı kullanır. Mükemmel değil, ama sen Hammer olası hata kurtulmasına yardımcı olabilir:

var transformTimer = undefined, 
    transforming = false; 
hammertime.on("transform", function (ev) { 
    transforming = true; 
    if (transformTimer !== undefined) clearTimeout(transformTimer); 
    transformTimer = setTimeout(function() { 
     transformTimer = undefined; 
     transforming = false; 
    }, 1000); // end the transform after 1s of idle time. 

    // your transform code goes here 
}); 
hammertime.on("transformend", function() { 
    if (transformTimer !== undefined) { 
     clearTimeout(transformTimer); 
     transformTimer = undefined; 
    } 
    transforming = false; 
}); 
hammertime.on("drag", function (ev) { if (!transforming) { ... } }); 
+0

Bunu denemek için gidiyor .... – Jacob

+0

Yolsuzluk benim yukarıdaki gibi çalışır. Genellikle çalışır ama bazı şeyleri geri dönüşümü yanlış yapmaktan vazgeçirir ve bu yüzden sürüklemeyi devre dışı bırakır ... – Jacob

+0

Ah "Dönüştürme" yerine "transformstart" işlevini kullanmak için kodu değiştirdim. Çekiçde hatalar vardır, ya “dönüştür” den sonra “dönüştürme” yi çağırırız (bu değişim etrafta çalışır), ya da her zaman sabitleme gerektiren Hammer'de bir hata olacak “dönüşümü” olarak adlandırmaz. Her "başlangıç" için bir "son" elde edip edemeyeceğinizi görmek için 'transformstart' ve' transformend''e bazı 'console.log' ifadeleri eklemeyi deneyin. – Brandon

2

Sadece bu hatayı düzeltmeyi başardım.

  var transforming = false; 
      var transformTimer = null;   

      hammertime2.on('touch drag dragend transform', function(ev) { 
       manageMultitouch(ev); 
      }); 

      hammertime2.on("transformstart", function(evt) {      
       transforming = true; 
      }); 

      hammertime2.on("transformend", function(evt) { 
       setTimeout(function() {  
        transforming = false; 
       }, 1000); 
      }); 

     function manageMultitouch(ev){    

      if (transforming && (ev.type == 'drag' || ev.type =='dragend')) return; 

      switch(ev.type) { 
       case 'touch':      
        break; 

       case 'drag': 
        break; 

       case 'transform': 
        transforming = true;      
        break; 

       case 'dragend': 
        break; 
      } 

     } 

burada önemli bir parçası

hep eksiler vermek yerine lütfen yorum Can transforming = true;