Coder Social home page Coder Social logo

sleen / flexlayout Goto Github PK

View Code? Open in Web Editor NEW
93.0 7.0 11.0 59 KB

an implementation of Flexbox(Flexible Box) layout algorithm

License: MIT License

CMake 0.42% C 89.26% C++ 6.21% Python 1.12% HTML 0.57% JavaScript 2.43%
flexbox layout flex-layout css-flexbox

flexlayout's Issues

when reLayout ui and the result is not change

I want to relayout my ui, but the result is not change. Like this, first I set child1 height is 50, But when the context is too much, I will set child1 is 150. So I set Height is 150, I hope reLayout the root. But is not change. code like as follows:
FlexNodeRef root = Flex_newNode();
Flex_setDirection(root, FlexVertical);
FlexNodeRef child1 = Flex_newNode();
Flex_setWidth(child1, 50);
Flex_setHeight(child1, 50);
Flex_addChild(root, child1);
FlexNodeRef child2 = Flex_newNode();
Flex_setWidth(child2, 50);
Flex_setHeight(child2, 50);
Flex_addChild(root, child2);
Flex_layout(root, FlexUndefined, FlexUndefined, 1);
// re-layout child1
Flex_setHeight(child1, 150);
Flex_layout(root, FlexUndefined, FlexUndefined, 1);
Flex_print(root, FlexPrintDefault);

the running result in vscode like this:
First printLayout:
{
direction: vertical
result-width: 50.0
result-height: 100.0
children: [
{
width: 50.0
height: 50.0
result-width: 50.0
result-height: 50.0
}
{
width: 50.0
height: 50.0
result-y: 50.0
result-width: 50.0
result-height: 50.0
}
]
}
Second printLayout:
{
direction: vertical
result-width: 50.0
result-height: 100.0
children: [
{
width: 50.0
height: 150.0
result-width: 50.0
result-height: 50.0
}
{
width: 50.0
height: 50.0
result-y: 50.0
result-width: 50.0
result-height: 50.0
}
]
}
Second layout child2 result-y is still 50, it should be 150. cause i change child1 height 150. I don't know how to do this, maybe is not use this method to relayout. Can u help me?

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.