Gelmiş geçmiş en büyük porno sitemiz olan 2pe de her zaman en kaliteli pornoları sunmayı hedefledik. Diğer video sitemiz olan vuam da ise hd porno ağırlıklı çalışmalara başladık.

  1. #1
    Sencha Premium Member
    Join Date
    Dec 2010
    Posts
    37
    Vote Rating
    0
    rchloupe is on a distinguished road

      0  

    Default [OPEN][EXTJSIV-1956]Panel collapse/expand breaks auto height

    [OPEN][EXTJSIV-1956]Panel collapse/expand breaks auto height


    I have an hbox inside of a viewport, then 3 panels. If I only have 2 panels the hbox is resizing with the browser, but with 3 its not.

    Code:
    Ext.create('Ext.container.Viewport', {
        layout: 'fit',
        items: [
            {
                xtype: 'panel',
                title: 'Browse Shopping',
                layout: 'fit',
                items: [
    //                {
    //                    xtype: 'panel',
    //                    title: ' ',
    //                    items: [
                            {
                                xtype: 'panel',
                                title: 'My Panel',
                                items: [
                                    {
                                        xtype: 'container',
                                        layout: 'hbox',
                                        items: [
                                            {
                                                xtype: 'checkbox',
                                                boxLabel: 'BoxLabel',
                                                flex: 1
                                            },
                                            {
                                                xtype: 'radio',
                                                boxLabel: 'BoxLabel'
                                            }
                                        ]
                                    }
                                ]
                            }
    //                    ]
    //               }
                ]
            }
        ]   
    });

  2. #2
    Sencha - Ext JS Dev Team dongryphon's Avatar
    Join Date
    Jul 2009
    Posts
    1,293
    Vote Rating
    121
    dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all

      0  

    Default


    I am assuming that you mean if you uncomment the panel you have commented out, that the hbox breaks?

    If so, the problem is that the commented out panel has no layout. I hope that in your real application, you don't have this kind of unnecessary panel nesting and this was just for demonstration purposes

    If that is not the problem you are having, please post code that demonstrates the problem without modification of your code. Something of the form "if I do X then I see Y but I expected to see Z". A transformed into working piece of code is good in addition: "but if I do X2 then I see Z".
    Don Griffin
    Ext JS Development Team Lead

    Check the docs. Learn how to (properly) report a framework issue and a Sencha Cmd issue

    "Use the source, Luke!"

  3. #3
    Sencha Premium Member
    Join Date
    Dec 2010
    Posts
    37
    Vote Rating
    0
    rchloupe is on a distinguished road

      0  

    Default


    You are correct, I mean that if I uncomment the code it stops resizing. We want panels within panels to show multiple sections inside of sections... is there a better way to get headings on a "section/grouping"?

    Here's an example of what I'm really trying to accomplish, the problem is I don't want to use the vbox layout (or column) due to them requiring a height attribute. I only want the "My Panel" to be as tall as is required for its content which is variable ("auto" is doing perfectly, but no resize). Please, any suggestions on accomplishing this type of format would really be appreciated.

    Code:
    Ext.onReady(function(){
    
    Ext.create('Ext.container.Viewport', {
        layout: 'fit',
        items: [{
    		xtype: 'panel',
    		bodyPadding: 15,
    		title: 'Browse Shopping',
    		items: [{
    			xtype: 'panel',
    			title: 'My Panel',
    			height: 100,  // is there another way to use vbox/column w/out this?
    			layout: {
    				type: 'vbox',
    				align: 'stretch'
    			},
    			items: [{
    				xtype: 'container',
    				layout: 'hbox',
    				items: [
    					{
    						xtype: 'checkbox',
    						boxLabel: 'BoxLabel',
    						flex: 1
    					},
    					{
    						xtype: 'radio',
    						boxLabel: 'BoxLabel'
    					}
    				]
    			}, {
    				xtype: 'container',
    				layout: 'hbox',
    				items: [
    					{
    						xtype: 'checkbox',
    						boxLabel: 'BoxLabel',
    						flex: 1
    					},
    					{
    						xtype: 'radio',
    						boxLabel: 'BoxLabel'
    					}
    				]
    			}]
    		}]
    	}]   
    });
        
    });

  4. #4
    Sencha - Ext JS Dev Team dongryphon's Avatar
    Join Date
    Jul 2009
    Posts
    1,293
    Vote Rating
    121
    dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all

      0  

    Default


    You are correct that nesting panels is the way to accomplish groupings... in other words they serve a purpose in the real world and aren't just nested to create 3 panel headers.

    I believe there is a problem here. The panel expand/collapse logic seems to be locking in a height and thereby losing its ability to auto height around its content.

    Any objection to me renaming the thread along the lines of 'Panel collapse/expand locks height/breaks auto height"? I wouldn't want you to lose track of the thread if I do that.
    Don Griffin
    Ext JS Development Team Lead

    Check the docs. Learn how to (properly) report a framework issue and a Sencha Cmd issue

    "Use the source, Luke!"

  5. #5
    Sencha Premium Member
    Join Date
    Dec 2010
    Posts
    37
    Vote Rating
    0
    rchloupe is on a distinguished road

      0  

    Default


    Not at all, any help is more than appreciated, thank you.
    I'm mostly frustrated that the layout I want to use 99% of the time "auto" doesn't do resizing. Can anyone give me any hints on how I can modify the auto layout to do resizing? It would be really nice to have a property I could set to turn resize on/off.
    I assume until then I really need to just use a template with tables, but can't believe I'm wanting something that most others users wouldn't want to use quite often as well?

  6. #6
    Sencha - Ext JS Dev Team dongryphon's Avatar
    Join Date
    Jul 2009
    Posts
    1,293
    Vote Rating
    121
    dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all

      0  

    Default


    I may not be following you, but the "auto" layout is specifically designed to allow the element's natural size to prevail. Other layouts set width and/or height on the container's components, so "auto" is the one you use if you want content+CSS to do the sizing for you.

    The problem I see so far is that the Panel's collapse/expand feature interferes with the natural sizing by trying to save/restore the size of the panel. If you have another issue in the mix, please clarify.
    Don Griffin
    Ext JS Development Team Lead

    Check the docs. Learn how to (properly) report a framework issue and a Sencha Cmd issue

    "Use the source, Luke!"

  7. #7
    Sencha - Ext JS Dev Team dongryphon's Avatar
    Join Date
    Jul 2009
    Posts
    1,293
    Vote Rating
    121
    dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all

      0  

    Default


    Let's go back to what you were originally trying to achieve. Since vbox is not what you want, please remove it and make the code what you were wanting.

    If it doesn't work, I can either explain what you need to do to make it work or fix the core code preventing it from working.

    I am working on the bug that matches the title, but now I'm not sure that it is what you were after in the first place.

    Thanks for your help (and patience)!
    Don Griffin
    Ext JS Development Team Lead

    Check the docs. Learn how to (properly) report a framework issue and a Sencha Cmd issue

    "Use the source, Luke!"

  8. #8
    Sencha Premium Member
    Join Date
    Dec 2010
    Posts
    37
    Vote Rating
    0
    rchloupe is on a distinguished road

      0  

    Default


    I think my issue was a miss understanding about the layouts on my part.
    At this point I'm really just trying to figure two things out.
    1. Is there a way recreate the auto layout with other layouts so that I can get my containers to resize? Using heights really isn't going to work and I was hoping to use Ext components and to not write my own html and CSS to do floating...
    2. If I can't recreate the auto layout, how can I force a resize on a container using it? I tried listening to Ext.EventManager.onWindowResize and calling doComponentLayout and doLayout but didn't have any luck.
    Thank you for all your help, sorry to waste your time.

  9. #9
    Sencha - Ext JS Dev Team dongryphon's Avatar
    Join Date
    Jul 2009
    Posts
    1,293
    Vote Rating
    121
    dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all

      0  

    Default


    No need to apologize. The bug uncovered was important, so thanks for hanging in there.

    If you are after auto height, I think the fix for this bug will be very helpful. This is the set of panels I have in my test:

    Code:
    Ext.onReady(function () {
        Ext.create('Ext.container.Viewport', {
            layout: 'anchor',
            items: [
                {
                    xtype: 'panel',
                    bodyPadding: 15,
                    title: 'Panel A',
                    items: [
                        {
                            xtype: 'displayfield',
                            value: 'Panel C should have twenty items, but it does not display '+
                                    '(its auto height is not respected).'
                        },
                        {
                            xtype: 'panel',
                            title: 'Panel B',
                            bodyPadding: 10,
                            items: [{
                                xtype: 'panel',
                                title: 'Panel C',
                                bodyPadding: 10,
                                //height: 100,
                                //layout: { type: 'vbox', align: 'stretch' },
                                items: (function () {
                                    var ret = []
                                    for (var i = 0; i < 20; ++i) {
                                        ret.push({
                                            xtype: 'container',
                                            layout: 'hbox',
                                            items: [
                                                { xtype: 'checkbox', boxLabel: 'BoxLabel', flex: 1 },
                                                { xtype: 'radio', boxLabel: 'BoxLabel' }
                                            ]
                                        });
                                    }
                                    return ret;
                                })()
                            }]
                        }
                    ]
                }
            ]
        });
    });
    If this does not work for you in 4.0.1, maybe the fix I have for 4.0.2 will take care of it because the above works for me. I know that if you add "collapsible: true" to any of the above (in 4.0.1), things will break when you expand them because their heights get locked.
    Don Griffin
    Ext JS Development Team Lead

    Check the docs. Learn how to (properly) report a framework issue and a Sencha Cmd issue

    "Use the source, Luke!"

  10. #10
    Sencha Premium Member
    Join Date
    Dec 2010
    Posts
    37
    Vote Rating
    0
    rchloupe is on a distinguished road

      0  

    Default


    Adding the anchor layout to all 3 panel's is working perfectly for the resizing!
    New issue however, in Chrome 11.0.696.68, if I add autoScroll to the viewport and make the browser scroll, I'm getting a bottom scroll bar due to the side scroll bar. It seems to be related to the anchor on the viewport itself.

Similar Threads

  1. [OPEN-1380] TabScroll breaks with TabWidth:'auto'
    By adam.jimenez in forum Ext 3.x: Bugs
    Replies: 2
    Last Post: 7 Oct 2011, 2:34 AM
  2. Replies: 7
    Last Post: 9 May 2011, 12:30 PM
  3. Replies: 2
    Last Post: 10 Apr 2011, 5:37 PM
  4. Replies: 8
    Last Post: 15 Feb 2011, 7:26 AM
  5. Replies: 4
    Last Post: 5 Jan 2011, 12:22 AM

Thread Participants: 2

Tags for this Thread