Additional library for FlexBox

[ronjunevaldoz]

I have recently implemented the FlexBox widget locally, maybe this could be added as future library?

gdx-flexbox

// my initial implementation
flexBox {
    label("Item 1") {
        setAlignment(Align.center)
    }.flex {
        setSize(100f)
    }
    label("Item 2") {
        setAlignment(Align.center)
    }.flex {
        setWidth(100f).setHeight(100f)
        positionType = YogaPositionType.ABSOLUTE
        setPosition(YogaEdge.LEFT, 10f)
    }
}
or 
flexBox {
    label("Item 1") {
        setAlignment(Align.center)
    }.flex(size = 100f)
    label("Item 2") {
        setAlignment(Align.center)
    }.flex(width = 100f, height = 100f, positionType  = YogaPositionType.ABSOLUTE, positionLeft = 10f)
}

extensions .flex could be implemented like .cell

[czyzby]

How is that different from Scene2D Table? Can you upload a screenshot of an example layout? Perhaps something that would be difficult to achieve in plain Scene2D.

[ronjunevaldoz]

How is that different from Scene2D Table? Can you upload a screenshot of an example layout? Perhaps something that would be difficult to achieve in plain Scene2D.

we can then define position much easier or if we are already using flex we can use this as reference yoga playground. Also can be alternative to the table

In this example, if we want the actors to be centered horizontally and vertically.

flexBox(YogaFlexDirection.ROW) {
    root.justifyContent = YogaJustify.CENTER
    root.alignItems = YogaAlign.CENTER 
    // ... actors
}

If we wanted the 2 actors to overlap

flexBox(YogaFlexDirection.ROW) {
    root.justifyContent = YogaJustify.CENTER
    root.alignItems = YogaAlign.CENTER 
    
    label(1) 
    label(2).flex(absolute = true)
}

If we want the actors to be in a column

flexBox(YogaFlexDirection.COLUMN) {
    root.justifyContent = YogaJustify.CENTER
    root.alignItems = YogaAlign.CENTER 
    // ... actors
}

[czyzby]

I could see it being useful as a separate module that extends ktx-scene2d. Do you think you could implement KTX DSL based on ktx-scene2d/ktx-vis? This section of the contribution guide describes how to add a new module.

[ronjunevaldoz]

I could see it being useful as a separate module that extends ktx-scene2d. Do you think you could implement KTX DSL based on ktx-scene2d/ktx-vis? This section of the contribution guide describes how to add a new module.

I think I could implement it, but there's a problem I think the minimum requirements for flexbox is 1.8 and the current project uis using 1.7 this might blocked the repository download from jitpack.io, I could create a sample patch for you to test locally my initial implementation, maybe you could share your email so I could send the patch file?

java {
    sourceCompatibility = JavaVersion.VERSION_1_8
    targetCompatibility = JavaVersion.VERSION_1_8
}

[czyzby]

That might prevent the library from working correctly on iOS. Are you able to check if the library works correctly on all official platforms other than GWT?