1. #1
    Sencha User
    Join Date
    Mar 2012
    Posts
    3
    Vote Rating
    0
    sivajan.kumaran is on a distinguished road

      0  

    Default Answered: Rendering issue with Ext.plugin.PullRefresh

    Answered: Rendering issue with Ext.plugin.PullRefresh


    Hi guys,

    I am having problems where the pull down to refresh plugin appears above the list. I have a Ext.Container with a Ext.List within it and it always seems to render the plugin above the list not within it.

    My code is as follows:

    Code:
    Ext.define("MyApp.view.Feeds", {
        id: 'feedsContainer',
        xtype: 'feeds',
        extend: "Ext.Container",
        alias: "widget.feedscontainer",
        config: {
            layout : 'fit'
        },
        initialize: function () {
    
    
            // Initialise parent.
            this.callParent(arguments);
    
    
            var feedsPanel = Ext.create('Ext.List', {
                id: 'feedsPanel',
                store: 'FeedsStore',
                ui: 'round',
                emptyText: 'No feeds found',
                plugins: [
                    { xclass: 'Ext.plugin.ListPaging' },
                    { xclass: 'Ext.plugin.PullRefresh' }
                ],
                itemTpl: Ext.create('Ext.XTemplate',
                    '<img src="{ImageUrl}" />',
                    '<div class="tweet">',
                        '<span class="posted">jana</span>',
                        '<h2>{Parent}</h2>',
                        '<p>{Description}</p>',
                    '</div>',
                    {
                        //posted: timeAgoInWords
                    }
                ),
    
    
                listeners:{
                    itemtap: function(view, index, item, e) {
                        var rec = view.getStore().getAt(index);
                        detailPanel.setData(rec.data.Link, 'mainContainer');
                        Ext.Viewport.setActiveItem('detailPanel');
                    }
                }
    
    
            });
    
    
            var detailPanel = new Rolio.view.Content({
                id: 'detailPanel'
            });
    
    
    
    
            var feedsScreen = new Ext.Panel ({
                id: 'feedsScreen',
                fullscreen: true,
                layout: 'card',
                cardSwitchAnimation: 'slide',
                items: [feedsPanel, detailPanel]
            });
    
    
            this.add([feedsScreen]);
    
    
        }
    
    
    
    
    });
    Any help would be much appreciated.

    Thanks
    Jana
    Last edited by sivajan.kumaran; 18 Apr 2012 at 6:58 AM. Reason: Spelling mistake

  2. Are you using SASS? If so then you need to @include the pullrefresh sass

  3. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,525
    Vote Rating
    871
    Answers
    3564
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    The pullrefresh is within the list but outside the list data rows
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  4. #3
    Sencha User
    Join Date
    Mar 2012
    Posts
    3
    Vote Rating
    0
    sivajan.kumaran is on a distinguished road

      0  

    Default


    Hi Mitchell,

    Thanks for your prompt reply. Whenever I have seen the pull down to refresh plugin working, it normall appears when you scroll down on the top element, whereby it appears at the top. It is normally not visible until you scroll down. On my screen shot below, the 'Pull down to refresh' is always visible. I want th behaviour similar to twitter and facebook where it is activated on touch scroll down at top of list. Is that possible?

    pulldown.jpg

    Thanks
    Jana

  5. #4
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,525
    Vote Rating
    871
    Answers
    3564
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    Are you using SASS? If so then you need to @include the pullrefresh sass
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  6. #5
    Sencha User
    Join Date
    Mar 2012
    Posts
    3
    Vote Rating
    0
    sivajan.kumaran is on a distinguished road

      0  

    Default


    Hi Mitchell,

    Solved. That worked!!!

    Thanks
    Jana