Commit Graph

206 Commits

Author SHA1 Message Date
David Vacca
f0edefdbb7 Rename YogaNode.parent -> YogaNode.owner
Summary:
In the persistent version of Yoga, a YogaNode can be shared between two YogaTrees, that means that a YogaNode could have more than one Parent at one point in time. That's why the concept of Parent of a YogaNode is not a 1-1 relationship anymore.
This diff changes the semantic of Parent of a YogaNode to Owner of a Yoga Node. CC sebmarkbage and priteshrnandgaonkar for more context.

Technically this diff renames the field YogaNode.parent to YogaNode.owner (and every internal field, Getter and Setter that is related to parent)

Note that as part of this diff I also modified the CSSLayoutDEPRECATED version of Yoga in order to keep compatibility with the C++ implementation.

Reviewed By: priteshrnandgaonkar

Differential Revision: D7352778

fbshipit-source-id: dcf1af5e72bfc3063b5c4bda197d7952a9194768
2018-04-01 18:35:13 -07:00
Jonathan Dann
187fc54596 Add YGNodeSetChildren(), YGNodeTraversePreOrder()
Summary:
We had functions for inserting/removing a specific child, but not for simply replacing the child set with another list.

`YGNodeSetChildren()` will unhook child nodes from the parent that don't appear in the new set. We set the disconnected child node layouts to `YGLayout()` b/c that's what the rest of the code does.

`YGTraversePreOrder()` walks the tree and calls a labmda for each node. We could very easily add a post-order traversal and the ability to stop traversal if we ever want, but for now this is an MVP.

Reviewed By: Woody17

Differential Revision: D7360203

fbshipit-source-id: 32df8e1213ead03bc0a026ec4bf453bc799bb9ce
2018-03-25 13:59:44 -07:00
Pritesh Nandgaonkar
ae86824636 Fixed a typo and added a test case
Summary: Fixed a typo of flexshrink and added a test case

Reviewed By: emilsjolander

Differential Revision: D7289221

fbshipit-source-id: 48ee9ccfac4adee51d515a366b5a11790f7236fc
2018-03-15 13:04:51 -07:00
Pritesh Nandgaonkar
52f2cf319a Move YGStyle to seperate file and add constructors
Summary: Moved YGStyle to separate file and added default constructor to it. This diff also gets rid off of the default values, which were earlier declared in Yoga-interna.h and instead uses default constructor. This diff also addresses https://github.com/facebook/yoga/pull/700

Reviewed By: emilsjolander

Differential Revision: D7016575

fbshipit-source-id: eb28df0ffb4cc813b23edaff80d7d4ebc56ce6af
2018-02-20 06:22:17 -08:00
Sophie Alpert
a2b6ddb7b1 Update license headers for MIT license
Summary:
Includes React Native and its dependencies Fresco, Metro, and Yoga. Excludes samples/examples/docs.

find: ^(?:( *)|( *(?:[\*~#]|::))( )? *)?Copyright (?:\(c\) )?(\d{4})\b.+Facebook[\s\S]+?BSD[\s\S]+?(?:this source tree|the same directory)\.$
replace: $1$2$3Copyright (c) $4-present, Facebook, Inc.\n$2\n$1$2$3This source code is licensed under the MIT license found in the\n$1$2$3LICENSE file in the root directory of this source tree.

Reviewed By: TheSavior, yungsters

Differential Revision: D7007050

fbshipit-source-id: 37dd6bf0ffec0923bfc99c260bb330683f35553e
2018-02-16 18:27:33 -08:00
Yuichi ONO
44622912a2 Fix main size calculation from the aspect ratio
Summary:
When the following conditions are met, the main size become smaller by the margins in the main axis.
* The aspect ratio is defined
* The main size is not defined
* The cross size is defined
* The main margin is defined

This is because the main margin size is not included when calculating the main size from the aspect ratio.
Closes https://github.com/facebook/yoga/pull/715

Reviewed By: emilsjolander

Differential Revision: D6998988

Pulled By: priteshrnandgaonkar

fbshipit-source-id: f6f69c47ece17bd7c5e41517b96032bf0c149356
2018-02-15 07:40:34 -08:00
Pritesh Nandgaonkar
402ee11273 Fix memory leak by not duplicating the YGConfig
Summary:
YGConfig isn't owned by the YGNode, and thus isn't freed when freeing the node (`YGNodeFreeRecursive`)

This fixes a memory leak caused by D6856812

Reviewed By: emilsjolander

Differential Revision: D6945022

fbshipit-source-id: 5fd3c3e2ac1cd94d459d5aa06e0daa8f107779ac
2018-02-09 05:00:13 -08:00
Pritesh Nandgaonkar
63be3ff84c Remove the use of legacy flag and log the diff if its used
Summary: Check if the layout tree is different if we do not use legacy flags. If they are different then report to the client

Reviewed By: emilsjolander

Differential Revision: D6856812

fbshipit-source-id: e4724d80702cc75c1894e348e137b24e663573d2
2018-02-02 07:43:26 -08:00
Pritesh Nandgaonkar
4f92ae46ef Yoga android news feed benchmark tests
Summary: Added a benchmark tests along with the usual gentest in yoga for a complex yoga android news feed view.

Reviewed By: emilsjolander

Differential Revision: D6753544

fbshipit-source-id: 23b8da9785990a86248ff4708ac61e12411eb489
2018-01-22 04:30:26 -08:00
Valentin Shergin
1eb9a5edd9 Tests for YGNodeSetDirtiedFunc
Summary: testallthethings

Reviewed By: gkassabli

Differential Revision: D6687460

fbshipit-source-id: bebae3604212cb10e7ac43d10cfebd4978834d69
2018-01-10 10:09:38 -08:00
Pritesh Nandgaonkar
fbd332dee8 Make YGNode as c++ struct with properties exposed through accessors
Summary: Moved c implementation of `YGNode` to C++ struct. Not moving to C++ class as the React Classes dependent on `Yoga.h` assume it to be C. Thats why keeping `Yoga.h` C compatible. Sorry for the long diff, didn't thought that it will turn out to be this much big.Will keep an eye on number of lines next time 😉

Reviewed By: emilsjolander

Differential Revision: D6592257

fbshipit-source-id: 641e8b9462ad00731a094511f9f5608b23a6bb21
2017-12-19 11:33:07 -08:00
Pritesh Nandgaonkar
03dd1d23fa vector instead of YGNodeList
Summary: Replaced YGNodeList with std::vector

Reviewed By: jonathandann, emilsjolander

Differential Revision: D6442379

fbshipit-source-id: d2d48ef0676351d2eeaa2d427dcd72e082cd15a1
2017-12-05 08:28:54 -08:00
Lukas Wöhrl
ad1240e276 Fix min/max percentage constraints on measured nodes
Summary:
Fix min/max percentage constraints on measured nodes. Currently we passed in the available size instead of the parent size.
Fixes #611
Closes https://github.com/facebook/yoga/pull/649

Reviewed By: priteshrnandgaonkar

Differential Revision: D6408019

Pulled By: emilsjolander

fbshipit-source-id: 18be5056dbc0dc179970ec231ab8b4e2cdba65c5
2017-11-30 08:02:05 -08:00
Lukas Wöhrl
afaafb4126 Measure nodes which have margin: auto and align-item: stretch
Summary:
If you have a measurable node and set ```marign-left: auto``` + ```align-item:stretch``` on it, it won't get measured and they get a width/height of ```-(nan)```. This change fixes that behaviour. Fixes #644.
Closes https://github.com/facebook/yoga/pull/645

Differential Revision: D6413512

Pulled By: emilsjolander

fbshipit-source-id: 755febeb33bb0d4520ca6b3c28d56ac333e4a14d
2017-11-27 05:36:48 -08:00
Lukas Wöhrl
7e3be21811 Add justify-content: space-evenly
Summary:
Adds new ```space-evenly``` for ```justify-content```.

Also adds a typofix in one of the other justify-content tests.

Fixes #657
Closes https://github.com/facebook/yoga/pull/658

Differential Revision: D6407996

Pulled By: emilsjolander

fbshipit-source-id: cc837409e1345624b4bd72c31e25fe68dcb0f6a3
2017-11-27 03:47:23 -08:00
Lukas Wöhrl
5e39f1a57c Fix shrinking in non strech alignments while retaining legacy behaviour
Summary:
This fixes shrinking of elements which are in a non stretch alignment, but keeps the legacy stretch behaviour in place. Additionally this adds a testcase for ```useLegacyStretchBehaviour```

Fixes #633
Closes https://github.com/facebook/yoga/pull/635

Differential Revision: D6408037

Pulled By: emilsjolander

fbshipit-source-id: 377ab0308dd3a75a148a0af31ab5eb3ffb5b5d83
2017-11-27 03:14:59 -08:00
Lukas Wöhrl
5aa0f44a9b Do not mark node as dirty if, new and old values are undefined
Summary:
If we have a values already set to undefined and set it to undefined again, we invalidate the layout. This change takes this case into account and keeps the layout valid.
Fixes #630
Closes https://github.com/facebook/yoga/pull/648

Differential Revision: D6408013

Pulled By: emilsjolander

fbshipit-source-id: dc2a848d84d3de9f4650fac9e41d7c8169446406
2017-11-27 03:14:54 -08:00
Lukas Wöhrl
a69545a6ae Fix justify content with min/max constraint parent
Summary:
The min/max inner width shouldn't take the margins into account.
Adds a test for both cases.

Fixes #664
Closes https://github.com/facebook/yoga/pull/665

Differential Revision: D6407982

Pulled By: emilsjolander

fbshipit-source-id: ffa549a06f802263e3b8488e90756aa3f722d52d
2017-11-24 07:24:51 -08:00
Pritesh Nandgaonkar
d98e5aef97 Deleted YGSetMemoryFucs as it is unused
Summary: Removed YGSetMemoryFuncs, as it is not used internally and barely externally.

Reviewed By: emilsjolander

Differential Revision: D6374147

fbshipit-source-id: 8c896dce23571268a1a52df5cc72486af9d66df7
2017-11-21 03:43:23 -08:00
Georgiy Kassabli
bfb4dabf0c Fixing the edge case in Yoga with percentage absolute position and infinite constraint
Summary: Yoga has an edge case that cause layout to return NaN. This happened when we used absolute position with percentage and infinite constraint in that dimension. This diff fixes that case to default to border+padding

Reviewed By: emilsjolander

Differential Revision: D6199731

fbshipit-source-id: f40ddf00614b2f507848fb35f348a9dfef14b323
2017-11-01 06:40:10 -07:00
Pritesh Nandgaonkar
58d14ee557 Reverting the dirty child optimization
Summary: Reverting D6134754

Reviewed By: emilsjolander

Differential Revision: D6203290

fbshipit-source-id: 8e42abb70e55f0fac90faaa21ecdbe0fbb76ce6b
2017-10-31 23:23:01 -07:00
Pritesh Nandgaonkar
c5182c4bf5 Used hasDirtyChildren tag for the optimization
Summary:
More fine grained dirty marking

Currently a node's dirty flag propagates to the root of the tree ensuring that when any node is invalidated its whole subtree will be re-calculated. This is often times not needed. There are many properties which only effects a node's children and would not need to propagate all the way to the root such as align-items. Also in cases where the style does change layout it may not need to propagate all the way to the root but can often stop at the nearest position: absolute parent.

This change has the potential of greatly improving performance of re-calculating a tree.

This might require adding a second dirty flag named hasDirtyDescendants ensuring that traversal still works even though a parent is not marked as dirty.

Reviewed By: emilsjolander

Differential Revision: D6134754

fbshipit-source-id: bbcfee14058140b946401de756a3f130de0f51cd
2017-10-31 08:22:29 -07:00
Sebastian Markbage
4785e95a0c Persistent Yoga
Summary:
This is meant to show a possible route format for a persistent form of Yoga. Where previous layouts can remain intact while still taking advantage of incremental layout by reusing previous subtrees.

```c
YGNodeRef YGNodeClone(const YGNodeRef node);
```

The core of this functionality is a new API to clone an existing node. This makes a new detached node with all the same values as the previous one. Conceptually this makes the original node "frozen" from that point on. It's now immutable. (This is not yet enforced at runtime in this PR but something we should add.)

Since the original is frozen, we reuse the children set from the original node. Their parent pointers still point back to the original tree though.

The cloned node is still mutable. It can have its styles updated, and nodes can be inserted or deleted. If an insertion/deletion happens on a cloned node whose children were reused, it'll first shallow clone its children automatically.

As a convenience I also added an API to clear all children:

```c
void YGNodeRemoveAllChildren(const YGNodeRef node);
```

During insert/delete, or as a result of layout a set of reused children may need to be first cloned. A kind of copy-on-write. When that happens, the host may want to respond. E.g. by updating the `context` such as by cloning any wrapper objects and attaching them to the new node.

```c
typedef void (*YGNodeClonedFunc)(YGNodeRef oldNode,
                                 YGNodeRef newNode,
                                 YGNodeRef parent,
                                 int childIndex);

void YGConfigSetNodeClonedFunc(YGConfigRef config,
                               YGNodeClonedFunc callback);
```

This PR doesn't change any existing semantics for trees that are not first cloned.

It's possible for a single node to exist in two trees at once and be used by multiple threads. Therefore it's not safe to recursively free a whole tree when you use persistence. To solve this, any user of the library has to manually manage ref counting or tracing GC. E.g. by replicating the tree structure in a wrapper.

In a follow up we could consider moving ref counting into Yoga.
Closes https://github.com/facebook/yoga/pull/636

Reviewed By: emilsjolander

Differential Revision: D5941921

Pulled By: sebmarkbage

fbshipit-source-id: c8e93421824c112d09c4773bed4e3141b6491ccf
2017-10-17 01:11:11 -07:00
Emil Sjolander
3a0a86788e Revert D5874862: [yoga][PR] Fix shrinking in non strech alignments
Summary:
This reverts commit 1426aa6b60f6ba42c2be702e6f24cea935ab7acb

bypass-lint

Differential Revision: D5874862

fbshipit-source-id: 24517d26b18c11fb9f75c6d3b5faae360711ea9e
2017-09-21 03:41:19 -07:00
Lukas Wöhrl
a77aa9a41e Fix shrinking in non strech alignments
Summary:
This fixes shrinking of elements which are in a non stretch alignment

Fixes #633
Closes https://github.com/facebook/yoga/pull/634

Differential Revision: D5874862

Pulled By: emilsjolander

fbshipit-source-id: 1426aa6b60f6ba42c2be702e6f24cea935ab7acb
2017-09-20 13:30:39 -07:00
Mingwei Pan
bcc36cc1b2 Zero out all fields in YGZeroOutLayoutRecursivly using memset
Summary:
Add a new test named YGZeroOutLayoutRecursivlyTest, which verifies that padding and margin of a child node should be set to 0 when the display is set to none.
Modify YGZeroOutLayoutRecursivly function, use memset to clear the layout struct of the node.

Reviewed By: emilsjolander

Differential Revision: D5842351

fbshipit-source-id: d2c2b6f829588a200525b7ccbdb63003cb4dcc4e
2017-09-15 08:32:36 -07:00
Emil Sjolander
35a9f33abb BREAKING: Change aspect ratio behavior
Summary:
@public

== Before ==
- Aspect ratio would do its best to fit within it's parent constraints
- Aspect ratio would prioritize `alignItems: stretch` over other sizing properties.

== After ==
- Aspect ratio is allowed to make a node grow past its parent constraints. This matches many other aspects of flexbox where parent constraints are not treated as hard constraints but rather as suggestions.
- Aspect ratio only takes `alignItems: stretch` into account if no other size definition is defined. This matches the interaction of other properties with `alignItems: stretch`.

== Updating your code ==

**You probably don't need to do anything** but in case something does break in your product it should be as easy as  adding `{width: '100%', height: '100%', flexShrink: 1}` to the style declaring the `aspectRatio`.

Reviewed By: gkassabli

Differential Revision: D5639187

fbshipit-source-id: 603e8fcc3373f0b7f2461da2dad1625ab59dcb19
2017-08-21 03:12:00 -07:00
Georgiy Kassabli
f45059e1e6 Fixing edge case issue in Yoga where text node was unnecessary rounded down
Summary: There was an uncovered edge case where number close to the whole was forced to round down because it was considered non-whole and had forced flooring. This diff covers that + adds a bunch of test cases to cover rounding function

Reviewed By: emilsjolander

Differential Revision: D5465632

fbshipit-source-id: 57e11092a97eba5dd76daad15fa8619535ff9c1b
2017-07-26 19:38:31 -07:00
Lukas Wöhrl
7640cd667f Reset the hadOverflow flag at the beginning of the algorithm
Summary:
This fixes the case where we change the layout, so that it doesn't overflow anymore.

This also improves the readability by using `|=` instead of referencing the value twice.
Closes https://github.com/facebook/yoga/pull/587

Differential Revision: D5388657

Pulled By: emilsjolander

fbshipit-source-id: ce1b1ded1feed7314a2c16bf695f62b866c19ea0
2017-07-10 12:00:37 -07:00
Lukas Wöhrl
24e2fc95dd Fix text node rounding with fractional dimensions matching the rounding factor
Summary:
If we have a fractional measure output which matches the subpixel rounding factor, we still should round both dimension into the same direction.

Fixes facebook/yoga#580.
Closes https://github.com/facebook/yoga/pull/583

Reviewed By: marco-cova

Differential Revision: D5274212

Pulled By: emilsjolander

fbshipit-source-id: 1febf9194210437ab77f91319d10d4da9b284b79
2017-07-04 06:27:24 -07:00
Andrey Mishanin
ce3f99939f Overflow detection in Yoga
Summary:
We need to provide Yoga clients with means of detecting overflow in flexbox layout. This information can be used later to identify a non-overflowing layout variant among others.

Flexbox layout considered overflown if (this is *not* an exhaustive list):

- if any child node overflows
- [no-wrap] total flex basis of all child nodes is greater than available space in parent and there are no flexible children
- [no-wrap] after flexing there is still not enough space to layout all child nodes

Reviewed By: gkassabli

Differential Revision: D5336645

fbshipit-source-id: c4f87d1754d7bac848e8d347b31d619393b94d2c
2017-06-30 09:26:57 -07:00
Lukas Wöhrl
ca2c607f90 The total flex factores need to be a minimum of 1 if any
Summary:
The only thing I found in the spec for this change is the following. Not exactly sure if this is the thing this PR is about:

> For each flex item, subtract its outer flex base size from its max-content contribution size. If that result is not zero, divide it by (if the result was positive) its **flex grow factor floored at 1** or (if the result was negative) by its scaled flex shrink factor, having **floored the flex shrink factor at 1**. This is the item’s max-content flex fraction.

But at least it seems a required change.

Fixes facebook/yoga#566
Closes https://github.com/facebook/yoga/pull/572

Differential Revision: D5264388

Pulled By: emilsjolander

fbshipit-source-id: 0004d1c3b9bad070a98cd6766c1adc06a54475f8
2017-06-16 07:46:06 -07:00
Lukas Wöhrl
a20bde8444 Fix absolute position if wrap-reverse and align-items: flex-end
Summary:
This is a fix on top of 56b10fc. It takes the case into account were you have `wrap-reverse` and `align-items: flex-end` set.
Closes https://github.com/facebook/yoga/pull/568

Differential Revision: D5155521

Pulled By: emilsjolander

fbshipit-source-id: 7e5fcfa2fbb48b6c6279da46cc648a071ff2b079
2017-06-01 05:41:25 -07:00
Emil Sjolander
56b10fc35b Fix absolute positioning in reverse wrapping container
Summary: aligning with odd web behaviour

Reviewed By: gkassabli

Differential Revision: D5144145

fbshipit-source-id: da6ef999ec0aabacf499017d1cfa81fc8f66e4bd
2017-05-29 07:57:00 -07:00
Georgiy Kassabli
cd1dbc3f0f Fixing potential measure call with negative size value
Summary: There is a case when measure() function will be called with negative width/height because of margin/padding. This diff fixes that scenario

Reviewed By: emilsjolander

Differential Revision: D5111534

fbshipit-source-id: 99f09b85f0c6a0e5dec89a26baba8f9d560100da
2017-05-23 11:12:10 -07:00
yihuang
629e401deb Fix right/bottom in absolute layout.
Summary:
1, Change bottom to be based� on height of parent.
2, Respect margin value when layout with right/bottom.
Closes https://github.com/facebook/yoga/pull/552

Differential Revision: D5102090

Pulled By: emilsjolander

fbshipit-source-id: dca291413ffc2027d7628f4c8b8eeeb0b4823bc2
2017-05-22 02:56:41 -07:00
Georgiy Kassabli
f2612192c5 Fixing using flex in root node
Summary: We should always try to make root node as small as possible, while previously this wasn't functioning this way

Reviewed By: emilsjolander

Differential Revision: D5071164

fbshipit-source-id: b8afef42477d0ed87d0c9fcfd26349e0a0babd6e
2017-05-17 07:28:30 -07:00
Emil Sjolander
b2b0c7ee37 Fix typo causing wrapped children to be sized by wrong axis margin
Summary: Fixes https://github.com/facebook/yoga/issues/548

Reviewed By: passy

Differential Revision: D5044470

fbshipit-source-id: 7d203dd48b258a5fe5c4b3c493099092a1d334db
2017-05-12 09:12:51 -07:00
Emil Sjolander
488a7c1fe0 Include margin when calculating if children overflow
Summary: Include margin when calculating if children overflow

Reviewed By: passy

Differential Revision: D5044471

fbshipit-source-id: e7c1eb694445ffb898bcf375d9deefc558c49f11
2017-05-12 09:12:51 -07:00
Emil Sjolander
85c2e406e4 Fix flex basis not accounting for max size constraint
Summary: Fix flex basis not being constraint to the max size in the main direction. Previously this caused the added test to fail due to NaN in child dimensions.

Reviewed By: gkassabli

Differential Revision: D5044314

fbshipit-source-id: d9f9db832e4943a57a89c9d162ff6077b709795a
2017-05-12 09:12:51 -07:00
Lukas Wöhrl
91230ae177 Move YGLogger into YGConfig and associate YGNodeRef with log events
Summary:
Moves the `YGLogger` into `YGConfig` and pass the `YGNodeRef` into the logger to be able to associate the log messages and assertions with the specific node.

Tackles facebook/yoga#530 and facebook/yoga#446
Closes https://github.com/facebook/yoga/pull/531

Reviewed By: astreet

Differential Revision: D4970149

Pulled By: emilsjolander

fbshipit-source-id: b7fcdaa273143ea2fa35861620b2e4d79f04f0af
2017-05-03 09:30:25 -07:00
Emil Sjolander
40e1bf6ce3 Treat measured nodes size as a minimun contraint when rounding
Summary: We need to treat measurements from nodes with measure functions as minimum values as to not truncate text.

Reviewed By: shergin

Differential Revision: D4972290

fbshipit-source-id: 0a7bcc7f47b3e5acb8745da5286abcb9c4e44a38
2017-04-30 03:11:58 -07:00
Lukas Wöhrl
203577724e Fix sizing of non strech items
Summary:
Fixes the sizing of items so that under most scenarios it calcultes its height by it's content for non exact measurings. This introduces a new useLegacyStretchBehaviour flag on the config to opt out of this change as it is breaking.

See facebook/yoga#505
Closes https://github.com/facebook/yoga/pull/506

Reviewed By: astreet

Differential Revision: D4954016

Pulled By: emilsjolander

fbshipit-source-id: d28bd5d174cd76951fb94df85e3b0cfab7f81ff7
2017-04-28 06:27:14 -07:00
Emil Sjolander
3db38f2a80 Remove rounding from experimental features
Summary: Rounding has been successfully adopted by multiple products and frameworks. Time to move it out of experimental mode. Rounding can still be turned of by setting the point scale factor to 0 on the config.

Reviewed By: gkassabli

Differential Revision: D4953838

fbshipit-source-id: 3ee5f27d92f95b3ed4a01c98bc35e9157f2e91c5
2017-04-27 07:14:29 -07:00
Lukas Wöhrl
f6b17183c5 Let measure behave more like on the web
Summary:
Nodes with a measure function needs to be measured even so it seems there is no available space. So it behaves more like on the web. Fix facebook/yoga#488
Closes https://github.com/facebook/yoga/pull/499

Reviewed By: astreet

Differential Revision: D4954008

Pulled By: emilsjolander

fbshipit-source-id: 5b6d9afae0cdebe33f8b82b67620b3b4527d1efc
2017-04-27 07:14:29 -07:00
Lukas Wöhrl
3178e3bf15 Fix flex-wrap with max constraint
Summary:
Fixes `flex-wrap` with a max constraint and `justify-content`. Fixes facebook/yoga#514.
Closes https://github.com/facebook/yoga/pull/519

Differential Revision: D4953727

Pulled By: emilsjolander

fbshipit-source-id: 32dec48220be1392ea8dac5f34871d407eb8d49b
2017-04-26 11:46:23 -07:00
Valentin Shergin
aa5b296ac7 New round-to-pixel-grid algorithm that fixes possible subpixel gaps between sibling nodes
Summary:
This diff introduces new, little bit sophisticated round-to-pixel-grid algorithm.

**Motivation:**

Previous simple and straightforward solution works in most cases but sometimes produce the not-so-great result. A while ago Nick Lockwood described this problem and proposed the solution in RN's RCTShadowView class:

For example, say you have the following structure:

  // +--------+---------+--------+
  // |        |+-------+|        |
  // |        ||       ||        |
  // |        |+-------+|        |
  // +--------+---------+--------+

Say the screen width is 320 pts so the three big views will get the following x bounds from our layout system:
{0, 106.667}, {106.667, 213.333}, {213.333, 320}
Assuming screen scale is 2, these numbers must be rounded to the nearest 0.5 to fit the pixel grid:
{0, 106.5}, {106.5, 213.5}, {213.5, 320}
You'll notice that the three widths are 106.5, 107, 106.5.

This is great for the parent views but it gets trickier when we consider rounding for the subview. When we go to round the bounds for the subview in the middle, it's relative bounds are {0, 106.667} which gets rounded to {0, 106.5}. This will cause the subview to be one pixel smaller than it should be. This is why we need to pass in the absolute position in order to do the rounding relative to the screen's grid rather than the view's grid. After passing in the absolutePosition of {106.667, y}, we do the following calculations:
absoluteLeft = round(absolutePosition.x + viewPosition.left) = round(106.667 + 0) = 106.5
absoluteRight = round(absolutePosition.x + viewPosition.left + viewSize.width) + round(106.667 + 0 + 106.667) = 213.5
width = 213.5 - 106.5 = 107

You'll notice that this is the same width we calculated for the parent view because we've taken its position into account.

I believe this is awesome. I also believe that we have to decouple this logic from RN and put it into awesome Yoga. So I did it in this diff.

**Fun fact:**
The original implementation of this algorithm in RN had (and still have) a bug, which was found by Dustin dshahidehpour and fixed in D4133643. Therefore that diff was unlanded because it broke something unrelated inside RN text engine. I will fix that problem in RN later.

**Why do we need to change test methodology?**
Because the way we receive layout metrics from Chrome browser actually directly related to rounding problem. Previously we used `offsetHeight` and `offsetWidth` properties of the DOM node, which contain naively rounded values from `computedStyle` or `getBoundingClientRect`. (Which is we are trying to fix!) So, I added the new function that computes node size using two-step-rounding approach, conceptually similar to one that implemented in Yoga. Note: Chrome browser performs rounding layout as part of rendering process and actual values that can ve computed by counting actual pixel are different from these natively rounded ones.

**Why do some tests now have different desired values?**
These changes actually prove that my approach is correct and more useful for actual view rendering goals. So, let's take a look at test with changed values `rounding_fractial_input_3`:
Previously: 64+25+24=114 (Incorrect!)
Now: 65+24+25=114 (Correct!)
Previously: 64+25+24=114 (Incorrect!)
Now: 65+24+25=114 (Correct!)

Reviewed By: emilsjolander

Differential Revision: D4941266

fbshipit-source-id: 07500f5cc93c628219500e9e07291438e9d5d36c
2017-04-25 17:43:13 -07:00
Georgiy Kassabli
cb612bcfbe Correcting Flex fix within Experimental feature
Summary: This diff corrects the fix to be limited only to cases when either element itself or all of it's children can't be flexed

Reviewed By: emilsjolander

Differential Revision: D4915189

fbshipit-source-id: efccee2fe39ed0f474a41dc3250d24c546f3f5d9
2017-04-19 13:27:52 -07:00
George Xu
3292337754 Revert D4875343: Correct fix for flexing grandchildren
Summary: This reverts commit 634e961f9798dff43eae2c6564b28c6629b816e0

Differential Revision: D4875343

fbshipit-source-id: 2949762bf47e151c8c0ff923d501859b3e0a567a
2017-04-13 18:15:40 -07:00
Emil Sjolander
eb4af86e3c Revert D4850458: [yoga][PR] Let measure behave more like on the web
Summary: This reverts commit be5e35a670ddcbf3cd426fc3c2a0c9b60a874cdc

Differential Revision: D4850458

fbshipit-source-id: 2ecb6c8627a84b52ade968fd18331a7473369ebe
2017-04-13 15:41:55 -07:00