search

tom95 / Pheno

A morphic-based UI framework with a lot of Bootstrap-like widgets.
MIT License
7 stars 2 forks source link

Layout of collapsed collapsible #38

Open codeZeilen opened 6 years ago

codeZeilen commented 6 years ago

The following example:

initialize

    | fieldRows |
    super initialize.

    self
        withLayout;
        vertical: true;
        extent: self initialExtent.

    fieldRows := (1 to: 10) collect: [:i | {
        PHLabel text: i asString. 
        (PHPage column) 
            add: (PHBadge text: i asString); 
            add: (PHCollapsible new collapsed: true; add: (PHLabel text: (10 - i) asString); yourself);
            yourself} ].

    self add: (PHDescriptionList items: fieldRows).

Is rendered as following:

collapsiblelayout

The spacing between the list items is a result of the PHPage having empty space below the Badge. Without the collapsible below the badge the extra space is not added.

codeZeilen commented 6 years ago

Oddly enough I manged to reproduce this now without a collapsible so probably just a styling property I am missing :)

Maybe another insight coming out of this: Figuring out which visual effects result from which styling property is sometimes a little hard. However, any solution to that would probably involve a major tool building effort.