1. #1
    Sencha User
    Join Date
    Sep 2010
    Posts
    28
    Answers
    1
    Vote Rating
    0
    ultraman69 is on a distinguished road

      0  

    Default Unanswered: Event raised everytime a panel gets focus

    Unanswered: Event raised everytime a panel gets focus


    I have 1 Main view, and 2 other views. Main view extends Ext.tab.Panel and the other 2 extends Ext.Panel.

    The main view is basically a bottom tabbar that contains the 2 other.

    Code:
    Ext.define("MyProject.view.Main", {
        extend: 'Ext.tab.Panel',
        requires: [
            'Ext.TitleBar'
        ],
        config: {
            fullscreen: true,
            tabBarPosition: 'bottom',
            layout: {
                type: 'card',
                animation: 'fade'
            },
    
    
            items: [
                {
                    xtype: 'picpanel'
                },
                {
                    xtype: 'calpanel'
                },
                {
                    xtype: 'bonuspanel'
                }
            ]
        }
    });
    The 2 other views (almost identical) both contains a Carousel

    Code:
    Ext.define("MyProject.view.PicViewer", {
        extend: 'Ext.Panel',
        xtype: 'picpanel',
        requires: [
            'Ext.carousel.Carousel',
            'Ext.Img', 
            'Ext.MessageBox'
        ],
    
    
        config: {
            title: 'Photos',
            iconCls: 'photos2',
            cls: 'cards',
            layout: {
                type: 'vbox',
                align: 'stretch'
            },
            defaults: {
                flex: 1
            },
    
    
            items: [
                {
                    xtype: 'carousel',
    
    
                    id: 'picViewerCarousel',
    
    
                    direction: 'horizontal',
                    
                    initialize: function() {
                        this.setActiveItem(MyProject.app.getCarouselCurrentIndex());
                    },
    
    
                    //and the horizontalCarousels array
                    items: [
                        {
                            xtype: 'image',
                            cls: 'my-carousel-item-img',
                            src: 'resources/photos/01b.jpg'
                        },
                        {
                            xtype: 'image',
                            cls: 'my-carousel-item-img',
                            src: 'resources/photos/02b.jpg'
                        },
                        {
                            xtype: 'image',
                            cls: 'my-carousel-item-img',
                            src: 'resources/photos/03b.jpg'
                        }
                    ],
                    
                    listeners: {
                        
                        activeitemchange: function(container, value, oldValue, eOpts) {
                            var activeItemIndex = container.getActiveIndex();
                            MyProject.app.setCarouselCurrentIndex(activeItemIndex);
                        }
                    },    
                }
            ],
        }
        
    });
    As you see, I have set a global variable in my Ext.application. This variable is set whenever a Carousel active index change. That works perfectly fine.

    I would like to synchronise both Carousels so that when I changed tab with the menu, they'll be on the same page. So I need to be able to set the active item to the value of the global variable whenever the panel gets the focus. I tried the initialize event, the painted event, the activate event... So far no luck. Can anyone help me ?

  2. #2
    Sencha User
    Join Date
    Apr 2010
    Location
    China
    Posts
    227
    Answers
    64
    Vote Rating
    20
    haduki will become famous soon enough haduki will become famous soon enough

      0  

    Default


    Code:
    Ext.define("MyProject.view.PicViewer", {
        extend: 'Ext.Panel',
        xtype: 'picpanel',
        requires: [
            'Ext.carousel.Carousel',
            'Ext.Img', 
            'Ext.MessageBox'
        ],
        changeCarouselIndex: function(index){
            this.down('carousel').setActiveItem(index);
        },
    
    
        config: {
            title: 'Photos',
            iconCls: 'photos2',
            cls: 'cards',
            layout: {
                type: 'vbox',
                align: 'stretch'
            },
            defaults: {
                flex: 1
            },
    
    
    
    
            items: [
                {
                    xtype: 'carousel',
    
    
    
    
                    id: 'picViewerCarousel',
    
    
    
    
                    direction: 'horizontal',
                
                    initialize: function() {
                        this.setActiveItem(MyProject.app.getCarouselCurrentIndex());
                    },
                    
    
    
                    //and the horizontalCarousels array
                    items: [
                        {
                            xtype: 'image',
                            cls: 'my-carousel-item-img',
                            src: 'resources/photos/01b.jpg'
                        },
                        {
                            xtype: 'image',
                            cls: 'my-carousel-item-img',
                            src: 'resources/photos/02b.jpg'
                        },
                        {
                            xtype: 'image',
                            cls: 'my-carousel-item-img',
                            src: 'resources/photos/03b.jpg'
                        }
                    ],
                    
                    listeners: {
                        
                        activeitemchange: function(container, value, oldValue, eOpts) {
                            var activeItemIndex = container.getActiveIndex(),
                                carousels=Ext.ComponentQuery.query('carousel[id]'),
                                i;
                            MyProject.app.setCarouselCurrentIndex(activeItemIndex);
                            for (i=0;i<carousels.length;i++){
                                carousels.setActiveItem(activeItemIndex);
                            }
                        }
                    },    
                }
            ],
        }
        
    });
    I write English by translator.

Thread Participants: 1

Tags for this Thread

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..." hd porno faketaxi