Results 1 to 4 of 4

Thread: Ext 6.2.1 Height of tabpanel is 0!

  1. #1
    Sencha User
    Join Date
    Mar 2017
    Posts
    11
    Answers
    3

    Default Answered: Ext 6.2.1 Height of tabpanel is 0!

    Hey!
    i use the default Application that is build from cmd and i replaced a tabpanel with a leafletmap as following:

    Code:
    Ext.define('myapp.view.main.Main', {    extend: 'Ext.tab.Panel',
    xtype: 'app-main',
    
    requires: [
            'Ext.MessageBox',
    'Ext.layout.Fit',
    'myapp.view.main.MainController',
    'myapp.view.main.MainModel',
    'myapp.view.main.List',
    'Ext.ux.LeafletMap',
    'myapp.view.main.LeafletMapController',
    ],
    
    controller: [
            'main',
    'leafletmap'
    ],
    viewModel: 'main',
    
    defaults: {
            tab: {
                iconAlign: 'top'
    },
    styleHtmlContent: true
    },
    
    tabBarPosition: 'bottom',
    
    
    items: [{
            title: 'locations',
    iconCls: 'x-fa fa-home',
    layout: 'fit',
    items: [{
                xtype: 'mainlist'
    }]
        }, {
            title: 'Users',
    iconCls: 'x-fa fa-user',
    layout: 'fit',
    bind: {
                html: '{loremIpsum}'
    }
        }, {
            title: 'Map',
    iconCls: 'x-fa fa-map-o',
    layout: 'fit',
    items: [{
                xtype: 'leafletmap',
    id: 'map1',
    autoMapCenter: false,
    useCurrentLocation: false,
    mapOptions: {
                    zoom: 14
    }
            }]
        }, {
            title: 'Settings',
    iconCls: 'x-fa fa-cog',
    layout: 'fit',
    bind: {
                html: '{loremIpsum}'
    }
        }
        ]
    });
    The positive thing is that the map is working. negative that the height is 0!! so you cant see it..
    I cant fix the height to a value cause it should be responisve..
    Does anyone have a solution

  2. I got the Problem. For some reason the div class .x-map-container height is 0 and i changed it in my CSS file to 100% which works out.

    I accidentallyhave this thread two times cause of problems with editing first. You can delete one:
    https://www.sencha.com/forum/showthr...ailable-height

  3. #2
    Sencha User
    Join Date
    Feb 2013
    Location
    California
    Posts
    11,985
    Answers
    506

    Default

    Panels get their height from the content when it is not set explicitly. Is the html perhaps not populated at render time?

  4. #3
    Sencha User
    Join Date
    Mar 2017
    Posts
    11
    Answers
    3

    Default

    I got the Problem. For some reason the div class .x-map-container height is 0 and i changed it in my CSS file to 100% which works out.

    I accidentallyhave this thread two times cause of problems with editing first. You can delete one:
    https://www.sencha.com/forum/showthr...ailable-height

  5. #4
    Sencha User
    Join Date
    Feb 2013
    Location
    California
    Posts
    11,985
    Answers
    506

    Default

    Thanks for the update. If you don't mind, I'd prefer to leave both threads active for future users, as the wordings are different.

Similar Threads

  1. TabPanel tab height
    By georgewr3 in forum Ext: Q&A
    Replies: 4
    Last Post: 9 Sep 2011, 12:35 AM
  2. Replies: 2
    Last Post: 9 Dec 2009, 8:24 AM
  3. [2.1] TabPanel Height in IE
    By INeedADip in forum Ext 2.x: Bugs
    Replies: 1
    Last Post: 21 Apr 2008, 10:18 AM
  4. Height tabpanel 100%?
    By michiel in forum Ext 2.x: Help & Discussion
    Replies: 3
    Last Post: 19 Mar 2008, 5:02 AM

Tags for this Thread

Posting Permissions

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