Success! Looks like we've fixed this one. According to our records the fix was applied for TOUCH-1371 in a recent build.
  1. #1
    Sencha User
    Join Date
    Jan 2012
    Posts
    9
    Vote Rating
    0
    JakubM is on a distinguished road

      0  

    Default [PR3] Ext.NavigationView left (back) button not updated properly on each push

    [PR3] Ext.NavigationView left (back) button not updated properly on each push


    REQUIRED INFORMATION


    Ext version tested:
    • Sencha Touch 2 rev PR3
    Browser versions tested against:
    • Chrome 16 (Mac)
    • Safari 5.1.2
    Description:
    • When hiding and showing NavBar in NavigationView depending on underlying view the back button text is not being updated properly the n-th time.
      I've overloaded
      Code:
      Ext.NavigationView.push(view)
      so it will hide/show navigation bar depending on view
      Code:
      hideNavBar = true|false
      .
      The first time push is called the back button gets title of the previous view. When hit back and do the same again it will be short enough to hide the button text.
      The text is actually being set but setWidth call in the button makes no effect so text is not visible.
    Steps to reproduce the problem:
    • Hide navbar of
      Code:
      Ext.NavigationView
    • Push view showing navbar, the left button will contain proper text and size
    • Go back
    • Invoke push again, left button is short and shows no text
    The result that was expected:
    • Left button of navbar having proper width and showing text each time.
    The result that occurs instead:
    • As per desc.

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    36,754
    Vote Rating
    828
    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


    Do you have a runnable test case?
    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.

  3. #3
    Sencha User
    Join Date
    Jan 2012
    Posts
    9
    Vote Rating
    0
    JakubM is on a distinguished road

      0  

    Default


    It goes like this (modified navigation view example):

    Code:
    Ext.setup({
        requires: [
            'Ext.navigation.View',
            'Ext.ActionSheet',
            'Ext.Button',
            'Ext.Toolbar'
        ],
        onReady: function() {
            /**
             * Create an instance of Ext.navigation.View, which is fullscreen so it is inserted into Ext.Viewport
             */
            var view = Ext.create('Test.NavView', {
                fullscreen: true,
    
    
                //true means the back button text will always be 'back'
                // useTitleForBackButtonText: true,
    
    
                items: [
    
    
                    //first item, which is visibile initially
                    {
                        title: 'Ext.navigation.View Example',
                        layout: 'vbox',
                        padding: 10,
                        hideNavBar: true,
                        items: [
                            {
                                xtype: 'button',
                                text: 'Push another view!',
                                handler: function() {
                                    //we already have other items in this navigation view, so we can simply use an index if we want
                                    view.push(1);
                                }
                            }
                        ]
                    },
    
    
                    //Second item. Show when the button above is pressed.
                    {
                        title: 'Second',
                        layout: 'vbox',
                        padding: 10,
                        items: [
                            {
                                xtype: 'button',
                                text: 'Another?',
                                handler: function() {
                                    view.push(2);
                                }
                            }
                        ]
                    },
    
    
                    //Third item. Show when the button above is pressed.
                    {
                        title: 'Third',
                        layout: 'vbox',
                        padding: 10,
                        items: [
                            {
                                xtype: 'button',
                                text: 'Push a new view',
                                handler: function() {
                                    view.push({
                                        title: 'New view',
                                        items: [
                                            {
                                                xtype: 'button',
                                                text: 'Pop this view',
                                                handler: function() {
                                                    view.pop();
                                                }
                                            }
                                        ]
                                    });
                                }
                            }
                        ]
                    }
                ]
            });
    
    
        }
    });
    
    
    Ext.define('Test.NavView', {
        extend: 'Ext.NavigationView',
        config: {
            fullscreen: true,
            navigationBar: {hidden: true},
        },
        
        push: function(view) {
            var me = this;
            if (view.hideNavBar) {
                me.getNavigationBar().hide();
            } else {
                me.getNavigationBar().show();
            }
            
            me.callParent(arguments);
        },
    
    
        pop: function() {
            var me = this, view = me.stack[me.stack.length - 2];
            if (view.hideNavBar) {
                me.getNavigationBar().hide();
            } else {
                me.getNavigationBar().show();
            }
            
            me.callParent(arguments);
        },
    
    
    
    
    });
    Attached full source.
    Attached Files

  4. #4
    Sencha - Sencha Touch Dev Team rdougan's Avatar
    Join Date
    Oct 2008
    Posts
    1,158
    Vote Rating
    6
    rdougan will become famous soon enough

      0  

    Default


    Thanks for the awesome testcase.
    Sencha Inc.
    Robert Dougan - @rdougan
    Sencha Touch 2 and Ext JS 4 Core Team Member, SASS/Theming Wizard.

  5. #5
    Sencha - Sencha Touch Dev Team rdougan's Avatar
    Join Date
    Oct 2008
    Posts
    1,158
    Vote Rating
    6
    rdougan will become famous soon enough

      0  

    Default


    Okay. So I've fixed any issues I can find with the back button when the navigation bar is hidden.

    Just so you know though, it's better practice to listen to events and then put your custom logic in there. In this case, I'd listen to the activeitemchange:

    Code:
    listeners: {
        activeitemchange: function(me, view) {
            if (view.hideNavBar) {
                me.getNavigationBar().hide();
            } else {
                me.getNavigationBar().show();
            }
        }  
    }
    Sencha Inc.
    Robert Dougan - @rdougan
    Sencha Touch 2 and Ext JS 4 Core Team Member, SASS/Theming Wizard.

  6. #6
    Sencha User
    Join Date
    Oct 2011
    Posts
    12
    Vote Rating
    0
    heretic is on a distinguished road

      0  

    Default


    I can't get that to work. If the NavigationBar is dynamically hidden (could be the case even if it's always hidden, but I did not test that), then pop() does not work: canPop() return false, because navigationBar.animating is true. So it appears that the event about animation end is never recieved by the NavigationBar if it's hidden. I tried to prevent that by toggling the animation on the NavigationView:
    Code:
    onActiveItemChange :function(me, view) {
            if (view.hideNavBar) {
                me.getNavigationBar().hide();
                me.getLayout().getAnimation().isAnimation = false;
            } else {
                me.getLayout().getAnimation().isAnimation = true;
                me.getNavigationBar().show();
            }
        },
    After that pop() seems to be working, but there is a different problem.
    After pop() is invoked (programmatically, NavigationBar is not visible) an exception occurs in Abstract.applySize():
    Code:
    Abstract.js:353TypeError: 'undefined' is not an object (evaluating 'dom.offsetWidth')
    , so apparently all this is causing some problems with layout.

    Any comments/suggestions?
    P.S.: Just to clarify, here's my goal.
    I need to be able to customize both right (action) and left (back) NavBar button text. It is possible to set the new text for the back button, but the width of the button is not being recalculated. Another approach was to hide the default NavBar completely so the pushed view would provide it's own toolbar, but that did not work either.
    Am I missing something?

  7. #7
    Sencha User
    Join Date
    Jan 2012
    Posts
    9
    Vote Rating
    0
    JakubM is on a distinguished road

      0  

    Default


    Having animations enabled didn't worked for me either - so I have disabled them for time being, hoping it will get fixed by next PR.

  8. #8
    Sencha User
    Join Date
    Oct 2011
    Posts
    12
    Vote Rating
    0
    heretic is on a distinguished road

      0  

    Default


    How did you disable the animation for NavigationView?

  9. #9
    Sencha User
    Join Date
    Jan 2012
    Posts
    9
    Vote Rating
    0
    JakubM is on a distinguished road

      0  

    Default


    Code:
    navigationView.getLayout().setAnimation()
    or in config:

    Code:
    config: {
       layout: {
          animation: {}
       }
    }
    or second option - override pop and push.

  10. #10
    Sencha User
    Join Date
    Oct 2011
    Posts
    12
    Vote Rating
    0
    heretic is on a distinguished road

      0  

    Default


    Thanks for the suggestions. I wasn't able to make the animation stop, but I'll keep trying.
    Hopefully, the beta will be released soon enough.

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