Results 1 to 5 of 5

Thread: List inside Card Panel not scrolling all the way down

  1. #1
    Ext JS Premium Member
    Join Date
    Dec 2010
    Posts
    15
    Vote Rating
    0
      0  

    Default List inside Card Panel not scrolling all the way down

    I have a list as the activeItem of a panel (layout: 'card'). The list is longer than the window so it vertically scrolls but not all the way to the bottom.

    Anyone know why or what config I can add to the list to make sure it scrolls to the bottom?

    Thanks

  2. #2
    Sencha Premium User mrsunshine's Avatar
    Join Date
    Sep 2008
    Location
    Germany - Darmstadt
    Posts
    693
    Vote Rating
    13
      0  

    Default

    pleas post some code that we can better help you,

    should work with something like

    Code:
    {
                layout: 'fit',
                dockedItems: [
                    {
                        xtype: 'toolbar',
                        dock: 'top',
                        layout: 'fit',
                        title: 'Chat',
                        items: [
                            {
                                xtype: 'spacer'
                            },
                            {
                                iconMask: true,
                                ui: 'plain',
                                iconCls: 'settings',
                                itemId: 'settingsButton'
                            }
                        ]
                    },
                    {
                        xtype: 'toolbar',
                        dock: 'bottom',
                        itemId: 'msgToolbar',
                        layout: 'fit',
                        items: [
                            {
                                xtype: 'textfield',
                                width: '96%'
                            }
                        ]
                    }
                ],
                items: [
                    {
                        xtype: 'list',
                        store: this.store,
                        scroll: 'vertical'
                    }
                ]
    
            }

  3. #3
    Ext JS Premium Member
    Join Date
    Dec 2010
    Posts
    15
    Vote Rating
    0
      0  

    Default

    Thanks...I was missing a layout: 'fit' on the parent panel... that is really strange but fixed the issue. Things really get weird in Sencha when you try to do too much nesting

  4. #4
    Sencha User
    Join Date
    Feb 2011
    Posts
    104
    Vote Rating
    0
      0  

    Default

    hm, my code has the same problem. where is my error here?

    PHP Code:

    Ext
    .ns('simfla.ux.plugins.demo');

    Ext.regModel('Contact', {
        
    fields: ['firstName''lastName']
    });

    simfla.ux.plugins.demo.store = new Ext.data.Store({
        
    model'Contact',
        
    sorters'firstName',

        
    data: [
            {
    firstName'Tommy'lastName'Maintz'},
            {
    firstName'Ed'lastName'Spencer'},
            {
    firstName'Jamie'lastName'Avins'},
            {
    firstName'Aaron'lastName'Conran'},
            {
    firstName'Dave'lastName'Kaneda'},
            {
    firstName'Michael'lastName'Mullany'},
            {
    firstName'Abraham'lastName'Elias'},
            {
    firstName'Tommy'lastName'Maintz'},
            {
    firstName'Ed'lastName'Spencer'},
            {
    firstName'Jamie'lastName'Avins'},
            {
    firstName'Aaron'lastName'Conran'},
            {
    firstName'Dave'lastName'Kaneda'},
            {
    firstName'Michael'lastName'Mullany'},
            {
    firstName'Abraham'lastName'Elias'},
            {
    firstName'Tommy'lastName'Maintz'},
            {
    firstName'Ed'lastName'Spencer'},
            {
    firstName'Jamie'lastName'Avins'},
            {
    firstName'Aaron'lastName'Conran'},
            {
    firstName'Dave'lastName'Kaneda'},
            {
    firstName'Michael'lastName'Mullany'},
            {
    firstName'Abraham'lastName'Elias'},
            {
    firstName'Tommy'lastName'Maintz'},
            {
    firstName'Ed'lastName'Spencer'},
            {
    firstName'Jamie'lastName'Avins'},
            {
    firstName'Aaron'lastName'Conran'},
            {
    firstName'Dave'lastName'Kaneda'},
            {
    firstName'Michael'lastName'Mullany'},
            {
    firstName'Abraham'lastName'Elias'},
            {
    firstName'Jay'lastName'Robinson'}
        ]
    })

    Ext.setup({
        
    tabletStartupScreen'tablet_startup.png',
        
    phoneStartupScreen'phone_startup.png',
        
    icon'icon.png',
        
    glossOnIconfalse,
        
    onReady : function() {
            var 
    app =  new Ext.Panel({
                
    fullscreentrue,
                
    layout'fit',
                
    dockedItems:[{
                    
    xtype'toolbar',
                    
    title'EditableList Plugin',

                }],
                
    items: [
                {
                    
    xtype'panel',
                    
    title:'topPanel',
                    
    items:{
                        
    xtype:'button',
                        
    cls'editChildBtn',
                        
    text'Einstellungen',
                        
    width150,
                        
    handler: function(){}
                    }
                },
                {
                    
    xtype'list',
                    
    style'background-color: Transparent;',
                    
    id'MyList',
                    
    allowDeselecttrue,
                    
    clearSelectionOnDeactivatetrue,
                    
    //layout: 'fit',
                    
    storesimfla.ux.plugins.demo.store,
                    
    itemTpl'{firstName} <strong>{lastName}</strong>',
                    
    groupedfalse,
                    
    indexBarfalse,
                    
    singleSelecttrue,
                    }]
                });

        }
    }); 
    thnx!

  5. #5
    Sencha User
    Join Date
    Aug 2009
    Posts
    1
    Vote Rating
    0
      0  

    Default

    heardkit, try to add scroll property to your list and maybe layout fit to the panel before list:

    Code:
    Ext.setup({
        tabletStartupScreen: 'tablet_startup.png',
        phoneStartupScreen: 'phone_startup.png',
        icon: 'icon.png',
        glossOnIcon: false,
        onReady : function() {
            var app =  new Ext.Panel({
                fullscreen: true,
                layout: 'fit',
                dockedItems:[{
                    xtype: 'toolbar',
                    title: 'EditableList Plugin',
    
                }],
                items: [
                {
                    xtype: 'panel',
                    title:'topPanel',
                    
                    layout: 'fit',
    
                    items:{
                        xtype:'button',
                        cls: 'editChildBtn',
                        text: 'Einstellungen',
                        width: 150,
                        handler: function(){}
                    }
                },
                {
                    xtype: 'list',
                    style: 'background-color: Transparent;',
                    id: 'MyList',
                    allowDeselect: true,
                    clearSelectionOnDeactivate: true,
                    //layout: 'fit',
    
                    scroll: 'vertical',
    
                    store: simfla.ux.plugins.demo.store,
                    itemTpl: '{firstName} <strong>{lastName}</strong>',
                    grouped: false,
                    indexBar: false,
                    singleSelect: true,
                    }]
                });
    
        }
    }); 
    
    that helps me a lot

Similar Threads

  1. Ext.panel inside the card layout of a TabPanel.
    By Shijutv in forum Sencha Touch 1.x: Discussion
    Replies: 1
    Last Post: 13 Dec 2010, 3:14 AM
  2. List inserted into a card panel
    By Eugene Krivopaltsev in forum Sencha Touch 1.x: Discussion
    Replies: 1
    Last Post: 12 Nov 2010, 6:00 PM
  3. Scrolling issue with a list inside a container.
    By johnwards in forum Sencha Touch 1.x: Discussion
    Replies: 5
    Last Post: 2 Nov 2010, 1:12 PM
  4. Adding static panel and list on the same card
    By robertj98 in forum Sencha Touch 1.x: Discussion
    Replies: 5
    Last Post: 19 Jul 2010, 7:27 AM
  5. Card Panel cuts off the display of a ContentPanel with a FormPanel inside
    By nickydavid in forum Ext GWT: Help & Discussion (1.x)
    Replies: 0
    Last Post: 6 Nov 2008, 9:28 AM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •