1. #1
    Sencha User
    Join Date
    Aug 2011
    Posts
    6
    Vote Rating
    0
    mprovencher is on a distinguished road

      0  

    Default Unanswered: Floating Panel Issue

    Unanswered: Floating Panel Issue


    Hello again,

    Still new at Sencha Touch and having issues with adding a navigation "toolbar" to my app (which is basically a horizontally-scrolling carousel of 17 sections, with several sections containing simple panels and others containing vertically scrolling carousels).

    If I don't add "floating:true" to my navigation bar, it displays behind the carousel. If I add "floating:true", it displays correctly, but I can't get any "buttons" within it to display at all—doesn't even render (if I inspect it with a browser).

    I don't know whether or not to include the buttons via the items[] array of my navBar Panel (I've tried switch it to Toolbar, Container, etc. Nothing works), and I get this error:

    "Uncaught TypeError: Property '1' of object function (j,f){e.call(h,j,g,c,b,a,h,arguments.callee,f)} is not a function"

    Here's my code for the navigation bar and the "toolbar home" button I'm trying to add to it (basically a clear div over the background image to add a listener to):

    Code:
    var tb_home = new Ext.Panel({
        id:'tb_home',
        cls:'tb_btn',
        width:40,
        height:32,
        layout: {type: 'vbox', align: 'start', pack: 'end'},
        floating:true,
        hidden: true,
        showAnimation:{ type: 'slide', direction:'down'},
        style:'position:relative; cursor:pointer; z-index:21000; width:40px; height:32px;',
        listeners: { tap: {element: 'el', fn: function(){
            if (navBar.isVisible()){
                navBar.hide();
                tb_home.hide();
                } else {
                navBar.show();
                tb_home.show();
            }
                 mainPages.setActiveItem(s01);
             }}}
    });
    
    
    var navBar = new Ext.Panel({
        id:'navbar',
        showAnimation:{ type: 'slide', direction:'down'},
        layout: {type: 'vbox', align: 'start', pack: 'start'},
        fullscreen: false,
        hidden: true,
        floating: true,
        width: 1024,
        height:32,
        items: [/*tb_home*/],
        style:'background:url(app/images/00_top_bar.png) no-repeat 0 0; position:relative; z-index:20000;    width:1024px; height:32px;'
    });
    And here's an example of one of the panels I'm trying to use to fire the show/hide on the navigation bar:

    Code:
    var s01_pg01_bg = new Ext.Panel({
        id:'s01_pg01_bg',
        style: "background:#000 url(app/images/sec01_pg01_cover.jpg) no-repeat 0 0;",
        width:1024,
        height:748,
        listeners: { tap: {element: 'el', fn: function(){
            if (navBar.isVisible()){
                navBar.hide();
                tb_home.hide(); // this appears to be where the error is being generated from
            } else {
                navBar.show();
                tb_home.show();
            }
        }}}
    });
    Are their any tutorials that walk through all these types of things? I feel like the "Hello World" tutorials and screencasts are overly simple and don't adequately set up a real-life application, but then things like the kitchen sink only show one example of a feature and don't elaborate on options or multiple examples—and the screencasts and tutorials seem to skip up to a way-over-my-head-you-need-to-be-a-good-developer-to-understand-this-stuff level.

  2. #2
    Sencha User
    Join Date
    Nov 2010
    Posts
    11
    Vote Rating
    1
    frostfang is on a distinguished road

      0  

    Default Bump

    Bump


    I was wondering if there was a solution to this ?

  3. #3
    Sencha User
    Join Date
    Nov 2010
    Posts
    11
    Vote Rating
    1
    frostfang is on a distinguished road

      0  

    Default Possible solution

    Possible solution


    I have discussed a possible solution here.

    http://www.sencha.com/forum/showthre...292#post653292

Thread Participants: 1

Tags for this Thread