Sencha Touch / HTML5从左到右滑动事件/效果

时间:2011-03-16 19:40:16

标签: html5 sencha-touch swipe

我尝试在Sencha Touch或HTML5中从左到右进行滑动事件/效果。 因此,如果HTML页面在iOS上运行,那么如果用户用手指从屏幕左侧向右移动/滑动,它应该开始动画。

任何想法如何“轻松”完成?

3 个答案:

答案 0 :(得分:7)

如果我理解正确,您可以在用户向左/向右滑动屏幕时切换内容。我认为最简单的方法是使用Carousel。请查看Sencha Touch Kitchen Sink示例(用户界面 - > Carousel): http://dev.sencha.com/deploy/touch/examples/kitchensink/

以下是从Kitcen Sink中获取的代码示例,该示例演示了Carousel的使用:

new Ext.Panel({
    cls: 'cards',
    layout: {
        type: 'vbox',
        align: 'stretch'
    },
    defaults: {
        flex: 1
    },
    items: [{
        xtype: 'carousel',
        items: [{
            html: '<p>Navigate the carousel on this page by swiping left/right.</p>',
            cls: 'card card1'
        },
        {
            html: '<p>Clicking on either side of the indicators below</p>',
            cls: 'card card2'
        },
        {
            html: 'Card #3',
            cls: 'card card3'
        }]
    }]
});

答案 1 :(得分:3)

您可以添加类似这样的手势滑动事件。

tabpanel.element.on('swipe', function(e) {
  if(e.direction === 'left') {
    // left slide event here
  }
  if(e.direction === 'right') {
    // right slide event here
  }
  if(e.direction === 'up') {
    // up slide event here
  }
  if(e.direction === 'down') {
    // down slide event here
  }
}, tabpanel);

希望这对你有所帮助。

答案 2 :(得分:0)

嗯...所以,在旋转木马中,如果想要捕获滑动事件,当用户实际从左向右滑动屏幕或反之亦然...并捕获该数据时,该怎么办呢?被刷了?