Question

I am currently using Sencha Touch 2 to create an image gallery. I have already been successful in loading the images from a JSON store in the main gallery, which features thumbnails of the images. I want to be able to have the user click/tap on each of the images in the main gallery and have the TAP EVENT push the image into a new view, which will display the image in its full-size.

Currently, this is my view:

Ext.define("tumblrPhotos.view.SampleView", {
extend: 'Ext.dataview.DataView',
xtype:'sampleviewtest',
requires: [
    'tumblrPhotos.store.PhotoStore',
],

config: {
    title: 'Photos',
    layout: 'card',
    id: 'gallerythumbnail',
    store: 'PhotoStore',
    styleHTMLContent: true,
    fullscreen: true,
    scrollable: 'vertical',
    baseCls: 'gallery-image',
    itemTpl: new Ext.XTemplate ([
        '<div class="gallery-thumbnail">',
        '<tpl for="photos[0].alt_sizes[0]">',
            '<img src="{url}" class="test" />',
        '</tpl>',
        '</div>'
    ].join('')
    ),
},  

});

And this is my controller so far. This part is not working:

Ext.define('tumblrPhotos.controller.GalleryController',{
extend: 'Ext.app.Controller',

config: {
    refs: {
         nav: 'galleryview', //the xtype

    }, 
    control: {
        '#gallerythumbnail': { //the xtype
            itemtap: 'viewFullScreen',
        }
    }
},

viewFullScreen : function(dv,index,target,record,e,eOpts){
    Ext.ComponentManager.get('galleryview').push('tumblrPhotos.view.FullView');
    console.log(record);
}

});

Thank you so much to all who can help me! I really appreciate it!

Answer 1

Per your comment, the error is relatively obvious…

Ext.ComponentManager.get('galleryview')

…doesn’t return anything.

Looking in the API docs for Sencha Touch, I see that Ext.ComponentManager is a private class – so you really shouldn’t be using it. Perhaps you should be using Ext.ComponentQuery or something else to grab ahold of that component.

And considering you have a “ref” defined for that xtype on the controller, you could use the auto-created getter for it (getNav() in your case, I think).

Last but not least, you didn’t post any code for that particular component (galleryview), so I can’t really speculate beyond what I’ve just said.