Sencha Touch v2ズームレイアウトの問題

Question

v2のSencha Touch Framework（RC）を使用した、本当に簡単なズームの例を得るのに問題があります。私はいくつかの異なるレイアウトの種類とその組み合わせで遊んだことがありますが、スクロールのサイズが更新されていないか、画像を表す実際のdivが拡大表示されていないようです。正直言って、私は現時点では完全に敗北しています!!

var testImage = Ext.create('Ext.Img', { 
    src: 'images/Food/2.jpg' 
}); 

Ext.Viewport.add({ 
    layout: 'card', 
    scrollable: { 
    direction: 'both', 
    directionLock: false 
    }, 
    items: [testImage] 
}); 

Ext.Viewport.element.on({ 
    doubletap: function(e , node, options, eOpts) { 
    var transformDetails = { scale: 2, angle: 0 }; 
    testImage.element.setStyle('-webkit-transform', 'scaleX(' + transformDetails.scale + ') scaleY(' + transformDetails.scale + ') rotate(' + transformDetails.angle + 'deg)'); 
    } 
}); 

スケールが画像に適用された後、この非常に単純な例を正しくパンするには、誰も洞察力がありませんか？現時点ではかなり無能であると感じます。

Answer 1

これらの行をコードに追加すると、パン、ズーム、ピンチなどのイベントを実行できます。

Ext.Viewport.setPreventPanning(false); 
Ext.Viewport.setPreventZooming(false);