1. #1
    Sencha User
    Join Date
    Apr 2012
    Posts
    81
    Answers
    3
    Vote Rating
    0
    mice-pace is on a distinguished road

      0  

    Default Unanswered: Custom Layout: Rows, with multiple Columns, that Expand

    Unanswered: Custom Layout: Rows, with multiple Columns, that Expand


    I'm hoping someone can help me with this.

    Since upgrading to ExtJS4.1 i need to redo my layouts, and so far my attempts to make a complex expandable form with a specific layout seem to disappear the minute i import them into the existing project... components still all there, but the row shows up empty. (they were visible when previewed in the project i made them in)

    Here's where they have to go:
    • In a Border layout Viewport i have a;
    • Center region Container(3) which contains;
    • A Container(3) which has;
    • A tab-panel and a Form Panel which has;
    • Two Fieldsets(2), one of which has;
    • FieldContainers(1) I've been using for each row
    (1)(2) - I don't *need* to use Fieldsets or FieldContainers, but the web interface i am basing this off breaks stuff down in a visually very similar way... So why not use them? I can replicate the appearence of the FieldContainer if that is causing problems, by putting a label and a container inside another container. If I can continue to use the Fieldset and get the layout i want than i want to that

    (3) - Why am i using a container with nothing but a container in it? ExtJS4.0 wouldn't let you directly touch certain stuff about a border layout, so i needed to encapsulate it. The center region was meant to act like a frame on a web browser, loading different 'pages'... in this case different Panels were created and then replaced the the one that wasn't directly inside a border layout


    What i'd like to do:

    Imagine if you will a web page. You have something that looks like a table, except the cells don't line up. You change the CSS to make the borders visible to find either:
    1. Each line is a different table... The first column of each row is a fixed width, then the rest are broken up based on distribution of percent
    2. The table has only two rows... The first column of each row is a fixed width, but the second column contains a different new table on each row broken up based on distribution of percent
    The titles for each row have the same width, but everything else expands out as it gets more room. Anyone got any suggestions?

  2. #2
    Sencha Premium Member skirtle's Avatar
    Join Date
    Oct 2010
    Location
    UK
    Posts
    3,493
    Answers
    526
    Vote Rating
    283
    skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future

      0  

    Default


    Perhaps I've misunderstood but isn't this just a vbox with hbox children? So that's a vbox on the fieldset and an hbox on the fieldcontainers. The first child of the fieldcontainer would then be fixed width and the others would flex. Alternatively use the label as the first child, which I suspect may be what you're doing already.

    Take a look at the first demo in the docs for fieldcontainer:

    http://docs.sencha.com/ext-js/4-1/#!...FieldContainer

    Isn't that pretty much what you want just with more rows?

Thread Participants: 1

Tags for this Thread