Hybrid View

  1. #1
    Sencha Premium Member
    Join Date
    Oct 2010
    Posts
    33
    Answers
    2
    Vote Rating
    0
    adeelmahmood is on a distinguished road

      0  

    Default Unanswered: viewport with vbox layout

    Unanswered: viewport with vbox layout


    I am trying to show a grid on a page with a toolbar immediately below the grid but I dont want to use the dockedItems .. instead i want to add a second component (toolbar) to the viewport and have that show up after the grid .. so i am using vbox layout but for some reason if i set the grid to forceFit: true then the grid disappears and only the bottom toolbar shows up .. but if i remove the forceFit:true then both show up but obviously the grid is not taking the full space available on the page ..

  2. #2
    Sencha - Community Support Team friend's Avatar
    Join Date
    Apr 2011
    Posts
    895
    Answers
    106
    Vote Rating
    27
    friend has a spectacular aura about friend has a spectacular aura about

      0  

    Default


    It sounds like a fairly simple layout issue, but it's hard to say without seeing your code. Can you post a concise code sample which includes your Viewport/Grid/Toolbar layout?

    Thx.

  3. #3
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    8,637
    Answers
    613
    Vote Rating
    400
    scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future

      0  

    Default


    I put this together real quick in Sencha Architect:

    Code:
    Ext.define('MyApp.view.MyViewport', {
        extend: 'Ext.container.Viewport',
    
        layout: {
            align: 'stretch',
            type: 'vbox'
        },
    
        initComponent: function() {
            var me = this;
    
            Ext.applyIf(me, {
                items: [
                    {
                        xtype: 'gridpanel',
                        flex: 1,
                        title: 'My Grid Panel',
                        columns: [
                            {
                                xtype: 'gridcolumn',
                                dataIndex: 'string',
                                text: 'String'
                            },
                            {
                                xtype: 'numbercolumn',
                                dataIndex: 'number',
                                text: 'Number'
                            },
                            {
                                xtype: 'datecolumn',
                                dataIndex: 'date',
                                text: 'Date'
                            },
                            {
                                xtype: 'booleancolumn',
                                dataIndex: 'bool',
                                text: 'Boolean'
                            }
                        ],
                        viewConfig: {
    
                        }
                    },
                    {
                        xtype: 'toolbar',
                        items: [
                            {
                                xtype: 'button',
                                text: 'MyButton'
                            }
                        ]
                    }
                ]
            });
    
            me.callParent(arguments);
        }
    
    });
    
    Ext.create('MyApp.view.MyViewport', {});
    Scott.

Thread Participants: 2

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar