1. #1
    Sencha Touch Premium User
    Join Date
    Oct 2010
    Location
    Portland, Maine USA
    Posts
    66
    Vote Rating
    1
    gordonjl is on a distinguished road

      0  

    Default Show/Hide Toolbar, docked panel briefly renders incorrectly

    Show/Hide Toolbar, docked panel briefly renders incorrectly


    All,

    I'm showing/hiding a toolbar and a docked item when a panel is tapped. It works, but the docked panel on the bottom flashes briefly at the top of the screen before going to its correct position. Is there a way I can prevent this? It works fine in Chrome and Safari on the desktop, btw. See amazing video below.

    Video Location (small, don't worry): http://gordonjl.com/files/pf.m4v

    Here's the code I'm calling to do the show/hide:

    Code:
      setToolbarVisibility: function(visibility) {
    
            this.toolbar.setVisible(visibility);
    
            this.infopanel.setVisible(visibility);
       
            this.doComponentLayout();
        },
    Here's the docked panel on the bottom:

    Code:
    {
                xtype:'panel',
                hidden:true,
                dock:'bottom',
                overlay:true,
                showAnimation:{type:'slide',direction:'up'},
                 html:"<div class='photo-info'>[Caption Goes Here]</div>"
            };
    Thanks!

  2. #2
    Touch Premium Member Philip Murphy's Avatar
    Join Date
    Oct 2011
    Location
    Dublin, Ireland
    Posts
    27
    Vote Rating
    1
    Philip Murphy is on a distinguished road

      0  

    Default


    Did u ever get an answer to this as I have the same problem? Only a problem on iOS for me.

    Answering my own question: Solution for me was to add and remove docked bar from main viewport instead of nested list panel.

    Code:
    myapp.views.MyView = Ext.extend(Ext.Panel, {
        layout: 'fit',
    
        initComponent: function() {
            ...
            this.myToolbar = new Ext.Toolbar({...});
    
                this.items = [{
                    xtype : 'list',
                ....
                    listeners: {
                         scope: this,
                         selectionchange: function(selectionModel) {
                               if(selectionModel.getCount() !== 0) {
                                     myapp.views.viewport.addDocked(this.myToolbar);
                               } else {
                                     myapp.views.viewport.removeDocked(this.myToolbar, false);
                             }
                    },
               ...
    myapp.views.viewport is a cardlayout (fullscreen = true), where the above code snippet is from a panel that is used within it.
    Last edited by Philip Murphy; 22 Mar 2012 at 9:07 AM. Reason: answering my own question.

  3. #3
    Sencha User Skynet-tx's Avatar
    Join Date
    May 2012
    Location
    Sevastopol, Russia
    Posts
    20
    Vote Rating
    1
    Skynet-tx is on a distinguished road

      0  

    Default This my instance

    This my instance


    This is simple solutions. You should take panel and after making the appearance and disappearance of the panel.

    //The action for the appearance and disappearance of the panel
    Ext.select('.compose').on('click', function(){


    if(changed_view == false) { //tabs on
    //tsvb.stat.timerButtonPanel.show();


    tsvb.statPanel.dockedItems.items[0].show();
    tsvb.statPanel.items.items[0].dockedItems.items[0].show();
    if (tsvb.statPanel.items.items[2].dockedItems.items[0]) {
    tsvb.statPanel.items.items[2].dockedItems.items[0].show();
    }


    changed_view = true;
    }


    else if (changed_view == true) {//tabs off


    tsvb.statPanel.dockedItems.items[0].hide();
    tsvb.statPanel.items.items[0].dockedItems.items[0].hide();


    if (tsvb.statPanel.items.items[2].dockedItems.items[0]) {
    tsvb.statPanel.items.items[2].dockedItems.items[0].hide();
    }
    console.log(tsvb.statPanel.dockedItems.items[0]);


    changed_view = false;
    }


    tsvb.statPanel.doComponentLayout();


    });

    If you don't understand how it's done, ask from me.

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..."