Results 1 to 2 of 2

Thread: In Sencha built app testing/production -Swipe event on carousel is not caught

  1. #1
    Sencha User
    Join Date
    Oct 2012
    Vote Rating

    Default In Sencha built app testing/production -Swipe event on carousel is not caught

    i have successfully build my app in Testing and Production mode, but the swipe event of carousel is not catch.
    I can only navigate throw the carrousel when i click on the Indicator dots and when i try to swipe with fingers nothing appends.

    I made a simple example with the KitcheSink Carousel . The swipe event works fine only in Development mode.
    Here the script :

    * Demonstrates how use an Ext.Carousel in vertical and horizontal configurations
    Ext.define('NotesApp.view.CarouselTest', {
    extend: 'Ext.Container',
    alias: "widget.carouselTest",//ou xtype

    requires: [
    'Ext.carousel.Carousel', 'Ext.event.*'

    config: {
    cls: 'cards',
    layout: {
    type: 'vbox',
    align: 'stretch'
    defaults: {
    flex: 1
    items: [{
    xtype: 'carousel',
    items: [{
    html: '<p>Swipe left to show the next card&hellip;</p>',
    cls: 'card'
    html: '<p>You can also tap on either side of the indicators.</p>',
    cls: 'card'
    html: 'Card #3',
    cls: 'card'
    }, {
    xtype: 'carousel',
    ui: 'light',
    direction: 'vertical',
    items: [{
    html: '<p>Carousels can also be vertical <em>(swipe up)&hellip;</p>',
    cls: 'card dark'
    html: 'And can also use <code>ui:light</code>.',
    cls: 'card dark'
    html: 'Card #3',
    cls: 'card dark'

    Here is my Index.html :

    For the moment, i don't use Saas/Compass to build my CSS, so i had them manually in the index.htm

    <html manifest="" lang="en-US">
    <meta charset="UTF-8">

    <!-- The line below must be kept intact for Sencha Command to build your application -->

    <!--CSS de base utiliser pour Carousel points de nav ... -->
    <link href="resources/css/sencha-touch.css" rel="stylesheet" type="text/css" />

    <!--CSS custom ...toujours a mettre apres l'autre pour redefinir des types -->
    <link href="resources/css/app.css" rel="stylesheet" type="text/css" />

    <script type="text/javascript" src="touch/sencha-touch-debug.js"></script>
    <script type="text/javascript" src="app.js"></script>

    <!-- On a remplacer les script par le Microlaoder qui va chercher la config dans app.json -->
    <script type="text/javascript">(function(h){function f(c,d){document.write('<meta name="'+c+'" content="'+d+'">')}if("undefined"===typeof g)var g=h.Ext={};g.blink=function(c){var d=c.js||[],c=c.css||[],b,e,a;f("viewport","width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no");f("apple-mobile-web-app-capable","yes");f("apple-touch-fullscreen","yes");b=0;for(e=c.length;b<e;b++)a=c[b],"string"!=typeof a&&(a=a.path),document.write('<link rel="stylesheet" href="'+a+'">');b=0;for(e=d.length;b<
    e;b++)a=d[b],"string"!=typeof a&&(a=a.path),document.write('<script src="'+a+'"><\/script>')}})(this);;Ext.blink({"id":"0d7245bd-531c-4a03-b9ff-ddc74f55aacc","js":[{"type":"js","path":"touch/sencha-touch.js"},{"update":"full","path":"app.js","type":"js","bundle":true}],"css":[{"update":"full","type":"css","path":"resources/css/app.css"}]})</script>

    <script type="text/javascript" src=""></script>


    I really don't understand what's wrong and what can i do
    Hope you can help me !

  2. #2
    Sencha Premium User mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Gainesville, FL
    Vote Rating


    I just generated a new app and did a production build after adding a carousel to is and it worked for me with ST 2.1.0
    Mitchell Simoens @LikelyMitch
    Modus Create, Senior Frontend Engineer
    Need any sort of Ext JS help? Modus Create is here to help!

    Check out my GitHub:

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts