1. #1
    Sencha User cyberwombat's Avatar
    Join Date
    Oct 2011
    Posts
    237
    Vote Rating
    2
    Answers
    6
    cyberwombat is on a distinguished road

      0  

    Default Answered: Actionsheet in a card - off screen

    Answered: Actionsheet in a card - off screen


    My MVC view of a card layout:

    Code:
    Ext.define('SquareRoute.view.Settings', {
        extend: 'Ext.form.Panel',
        title: 'Settings',
        initialize: function() {
          this.down('actionsheet').show();
          this.callParent();
        },
        config: {
    
    
            html: '<div style="height:1000px"></div>',
            items: [
    
    
            {
                xtype: 'actionsheet',
                hideOnMaskTap: true,
                id: 'photography',
                docked: 'top',
                items: [
    
    
                {
                    text: 'Take photo',
                    ui  : 'confirm',
    
    
                },
                {
                    text: 'Browse photo library',
                    ui  : 'confirm',
    
    
                },
                {
                    text: 'Cancel',
                    handler: function() {
                         this.up('actionsheet').hide();
                    }
                }
                ]
            },
    
    
            ]
        }
    });
    The actionsheet is below fold at bottom of the 1000px. 'docked' option does nothing. Suggestions?

  2. Remove the docked configuration and change it to:

    Code:
    {
        xtype: 'actionsheet',
        top: 0,
        left: 0,
        right: 0,
        items: [...]
    }
    This means it will be floating at the top of your container.

  3. #2
    Sencha - Community Support Team jay@moduscreate.com's Avatar
    Join Date
    Mar 2007
    Location
    DC Area =)
    Posts
    16,364
    Vote Rating
    81
    Answers
    102
    jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all

      0  

    Default


    Action sheets are not designed to be docked to a container.

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

      0  

    Default


    Remove the docked configuration and change it to:

    Code:
    {
        xtype: 'actionsheet',
        top: 0,
        left: 0,
        right: 0,
        items: [...]
    }
    This means it will be floating at the top of your container.
    Sencha Inc.
    Robert Dougan - @rdougan
    Sencha Touch 2 and Ext JS 4 Core Team Member, SASS/Theming Wizard.

  5. #4
    Sencha User cyberwombat's Avatar
    Join Date
    Oct 2011
    Posts
    237
    Vote Rating
    2
    Answers
    6
    cyberwombat is on a distinguished road

      0  

    Default


    Aahhhhhh!!! thanks that did the trick!

Thread Participants: 2