pharo-graphics / Bloc

Low-level UI infrastructure & framework for Pharo
MIT License
80 stars 40 forks source link

Bug on margins with a BlFrameLayout aligned with coordinates #419

Open Nyan11 opened 7 months ago

Nyan11 commented 7 months ago

Hello,

I was working with BlFrameLayout and i discover a bug.

Reproduction

No bug

In a playground you can do:

BlFrameLayoutAlignmentExampleTest cheatSheet

image

With bug

Go in the class BlFrameLayoutAlignmentExampleTest on instance side and replace the method child with:

child

    ^ BlElement new
          size: 70 @ 40;
          border: (BlBorder paint: Color black width: 1);
          layout: BlLinearLayout vertical;
          margin: (BlInsets all: 20); "We add a margin of 20 to display the bug"
          yourself

Then go in playground and do:

BlFrameLayoutAlignmentExampleTest cheatSheet

image

Explication of the bug

I will focus on the 4 elements at the center of the image. In BlFrameLayoutAlignmentExampleTest the four elements at the center are in a BlFrameLayout. Each element receive a different frame constraints. For the top left element the constraints are : alignBottom: 0.5 and alignRight: 0.5, For the bottom right the constraints are: alignTop: 0.5 and alignLeft: 0.5.

In the next image i highlighted the two elements and their respective margin.

image

We can see that in the element on the top-left, the margin is taken into account by the BlFrameLayout for the position and in the bottom-right element the margin is not taken into account.

tinchodias commented 7 months ago

Thanks for the detailed report. Today we looked at it with @Enzo-Demeulenaere but still no fix.

IMHO the examples with 0.5 show most evidently that something is wrong, because it should be symmetric.

We can add tests in BlFrameLayoutConstraintTest, which already has covers many cases but not with margins.

A candidate is:

testChildAlignLeft05Top05WithMargin

    child constraintsDo: [ :c |
        c margin: (BlInsets all: 10).
        c frame horizontal alignLeftAt: 0.5.
        c frame vertical alignTopAt: 0.5 ].

    self waitTestingSpaces.
    self assert: child position equals: 55 @ 55

But I'm not sure if we should expect 55@55 or 60@60.

tinchodias commented 7 months ago

I edited the title because there is no issue when no alignment with coordinate.

I played with the child's constraints of this example to check:

"Child has a margin of 5px"
a := 5.
child := BlElement new.
child background: Color blue.
child constraintsDo: [ :c |
    c frame vertical alignTop.
    c frame horizontal alignRight ].
child margin: (BlInsets all: a).

"Parent has padding, shown by it's border"
parent := BlElement new.
parent background: Color red translucent.
parent layout: BlFrameLayout new.   
parent padding: (BlInsets all: a).
parent border: (BlBorder paint: Color red translucent width: a).
parent beOutskirtsInside.
parent addChild: child.
parent position: 50@50.
parent size: 100@100.

s := BlSpace new.
s extent: 200@200.
s root addChild: parent. 
s show.