There are a few issues with compiling SwiftBox in Xcode 7 (mostly around Printable and DebugPrintable no longer being around). Would it be possible to add a Swift 2.0-compatible branch? Thanks!

If you run the example as given, you don't get the indicated output, because the default direction for a Node is ".Column" instead of ".Row".

Hello Josh!

Cool project, first step in bringing technologies from React Native to real native code, without js! I wonder if this can be used to calculate layout of reusable cells in table view. It seems to be nice fit there since you have to provide height of cell before you provide actual cell to table view. Also, it enables easy caching of cells layout and simple reuse model where views and layout of views already separated from each other.

My question is there any way to calculate height with fixed width? Cells can have different heights that depends on content size (text size in my case) so in first we have to have some way to provide information about text size then calculate height and other stuff then apply in to view hierarchy.

As I see I should calculate text size by hand, then create Node hierarchy with that sizes and then ask about final height. Any thoughts how can it be?

Hi,

I am getting

Use of undeclared type 'NodeImpl'

in my project. I have copied all the files and I am able to navigate to NodeImpl file through xcode. Not sure whats causing the error.

Please help me.

Thanks, Kanishka

css-layout has support for position: absolute, i.e. elements that don't participate in the flexbox layout and instead have an explicit position. I don’t see this option exposed anywhere in the SwiftBox API. Am I missing something, or is this just not implemented yet?

Here's the setup I encountered issue

let imageText = Node(
    direction: .Column,
    padding: Edges(top: 20, bottom: 20),
    children: strings.map { (text : String) -> Node in
        let image = Node(
            size: CGSizeMake(100, 100)
        )
        let text = Node(
            measure: { w in
                println("\(w)") // Nan
                label.text = text
                label.preferredMaxLayoutWidth = w
                return label.sizeThatFits(CGSizeMake(w, CGFloat.max))
        })
        let row = Node(
            direction: Direction.Row,
            children:[image, text]
        )
        return row
    }
)
println(imageText.layout(maxWidth: 375).frame)  // (0.0, 0.0, 7704.0, 240.0)

Notice the width wasn't obeying the maxWidth we've put into our layout.

So Basically I want to implement something like this:

I had some sample data setup here:

let strings : [String] = [
    "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam ex dolor, imperdiet vel tellus sollicitudin, ultrices maximus nunc. Ut non vehicula magna. Etiam sit amet varius lectus, et luctus dui. Sed eget blandit turpis. Nullam laoreet at felis non fermentum. Integer elit sem, tempus eget ex non, mattis porta lorem. Sed ut quam vel nibh luctus bibendum quis sed mi.",
    "Fusce scelerisque rhoncus elementum. Maecenas ultricies est ex, ut varius mauris cursus at. Maecenas sollicitudin orci posuere, ultricies lacus vel, scelerisque nibh. Nullam a turpis a urna elementum posuere. Integer porttitor vestibulum urna lobortis tincidunt. Aliquam consectetur sem metus, et laoreet libero rutrum nec. Donec sed justo dapibus, mollis nibh volutpat, sollicitudin sem. Suspendisse tempor, velit ac ullamcorper pretium, sapien risus molestie enim, aliquam cursus ex massa a nisl. Duis gravida, diam eget rutrum sagittis, dui est malesuada mi, a dapibus eros odio sit amet tellus. Nunc porttitor nunc nec massa mollis, et pellentesque est egestas. Vivamus venenatis dignissim massa in euismod. Vestibulum rutrum ex a interdum varius. Donec convallis gravida dui eget viverra. Suspendisse tempor, lorem sit amet consequat mattis, libero ex dictum quam, eget iaculis felis velit eu nunc. Morbi eros lectus, aliquet at pulvinar sed, tempor malesuada elit. Integer blandit gravida felis.",
    ]

// Also setting up a label to calculate the size
let label = UILabel()
label.numberOfLines = 0

I tried a simpler setup and works as expected:

let textOnly = Node(
    direction: .Column,
    padding: Edges(top: 20, bottom: 20),
    children: strings.map { (text : String) -> Node in
        let text = Node(
            measure: { w in
                println("\(w)") // 375
                label.text = text
                label.preferredMaxLayoutWidth = w
                return label.sizeThatFits(CGSizeMake(w, CGFloat.max))
        })
        return text
    }
)

println(textOnly.layout(maxWidth: 375).frame) // (0.0, 0.0, 375.0, 669.0)

So is there something wrong with my setup or it's a bug that I encountered? Thanks for helping out!