DaddyFrosty/yoga
1
0
Fork 0
Code Issues 96 Pull Requests 31 Actions Packages Projects Releases 33 Wiki Activity

Fix CSSLayout to Support RTL

Browse Source 
Summary:
@public The current CSSLayout can't support RTL because wrong calculation for absolute position.
This change is mainly to fix the issue: https://github.com/facebook/css-layout/issues/197
Three main problems I fixed:
1. Calculate the position in the same way as margin, boarder, and padding. So that to fix the absolute problem.
2. Fix one wrong calculation for leading value when we only know the trailing value. It was hard code for the LTR situation. Now I changed it to depends on the main Axis.
3. Expose getter and setter function for RN to read layout direction and start/end position value.

Reviewed By: fkgozali

Differential Revision: D3616949

fbshipit-source-id: ae7a47cc0a5d02b42b95f87232be51ab144056d9
This commit is contained in:
Mengjue Wang
2016-07-28 14:43:40 -07:00
committed by Facebook Github Bot 1
parent b26794a375
commit 46c842c71a
7 changed files with 260 additions and 194 deletions
Download Patch File Download Diff File Expand all files Collapse all files

118
tests/java/com/facebook/csslayout/LayoutEngineTest.java
View File

@@ -2957,8 +2957,8 @@ public class LayoutEngineTest {
TestCSSNode root_node = new TestCSSNode();
{
TestCSSNode node_0 = root_node;
node_0.style.position[POSITION_LEFT] = 5;
node_0.style.position[POSITION_TOP] = 5;
node_0.setPosition(Spacing.LEFT, 5);
node_0.setPosition(Spacing.TOP, 5);
}
TestCSSNode root_layout = new TestCSSNode();
@@ -3016,7 +3016,7 @@ public class LayoutEngineTest {
TestCSSNode root_node = new TestCSSNode();
{
TestCSSNode node_0 = root_node;
node_0.style.position[POSITION_BOTTOM] = 5;
node_0.setPosition(Spacing.BOTTOM, 5);
}
TestCSSNode root_layout = new TestCSSNode();
@@ -3037,8 +3037,8 @@ public class LayoutEngineTest {
TestCSSNode root_node = new TestCSSNode();
{
TestCSSNode node_0 = root_node;
node_0.style.position[POSITION_TOP] = 10;
node_0.style.position[POSITION_BOTTOM] = 5;
node_0.setPosition(Spacing.TOP, 10);
node_0.setPosition(Spacing.BOTTOM, 5);
}
TestCSSNode root_layout = new TestCSSNode();
@@ -3333,8 +3333,8 @@ public class LayoutEngineTest {
node_1.style.dimensions[DIMENSION_HEIGHT] = 100;
node_1 = node_0.getChildAt(1);
node_1.style.positionType = CSSPositionType.ABSOLUTE;
node_1.style.position[POSITION_LEFT] = 10;
node_1.style.position[POSITION_TOP] = 10;
node_1.setPosition(Spacing.LEFT, 10);
node_1.setPosition(Spacing.TOP, 10);
}
}
@@ -3381,7 +3381,7 @@ public class LayoutEngineTest {
TestCSSNode node_1;
node_1 = node_0.getChildAt(0);
node_1.style.positionType = CSSPositionType.ABSOLUTE;
node_1.style.position[POSITION_LEFT] = 5;
node_1.setPosition(Spacing.LEFT, 5);
}
}
@@ -3418,7 +3418,7 @@ public class LayoutEngineTest {
node_1 = node_0.getChildAt(0);
node_1.style.positionType = CSSPositionType.ABSOLUTE;
node_1.setMargin(Spacing.TOP, 5);
node_1.style.position[POSITION_TOP] = 5;
node_1.setPosition(Spacing.TOP, 5);
}
}
@@ -3455,7 +3455,7 @@ public class LayoutEngineTest {
node_1 = node_0.getChildAt(0);
node_1.style.positionType = CSSPositionType.ABSOLUTE;
node_1.setMargin(Spacing.LEFT, 5);
node_1.style.position[POSITION_LEFT] = 5;
node_1.setPosition(Spacing.LEFT, 5);
}
}
@@ -4028,7 +4028,7 @@ public class LayoutEngineTest {
TestCSSNode node_1;
node_1 = node_0.getChildAt(0);
node_1.style.positionType = CSSPositionType.ABSOLUTE;
node_1.style.position[POSITION_TOP] = -1;
node_1.setPosition(Spacing.TOP, -1);
}
}
@@ -4070,7 +4070,7 @@ public class LayoutEngineTest {
TestCSSNode node_1;
node_1 = node_0.getChildAt(0);
node_1.style.positionType = CSSPositionType.ABSOLUTE;
node_1.style.position[POSITION_LEFT] = 5;
node_1.setPosition(Spacing.LEFT, 5);
}
}
@@ -5199,10 +5199,10 @@ public class LayoutEngineTest {
TestCSSNode node_1;
node_1 = node_0.getChildAt(0);
node_1.style.positionType = CSSPositionType.ABSOLUTE;
node_1.style.position[POSITION_LEFT] = 0;
node_1.style.position[POSITION_TOP] = 0;
node_1.style.position[POSITION_RIGHT] = 0;
node_1.style.position[POSITION_BOTTOM] = 0;
node_1.setPosition(Spacing.LEFT, 0);
node_1.setPosition(Spacing.TOP, 0);
node_1.setPosition(Spacing.RIGHT, 0);
node_1.setPosition(Spacing.BOTTOM, 0);
}
}
@@ -5384,8 +5384,8 @@ public class LayoutEngineTest {
node_1.style.dimensions[DIMENSION_HEIGHT] = 100;
node_1 = node_0.getChildAt(1);
node_1.style.positionType = CSSPositionType.ABSOLUTE;
node_1.style.position[POSITION_LEFT] = 0;
node_1.style.position[POSITION_RIGHT] = 0;
node_1.setPosition(Spacing.LEFT, 0);
node_1.setPosition(Spacing.RIGHT, 0);
}
}
@@ -5427,8 +5427,8 @@ public class LayoutEngineTest {
TestCSSNode node_1;
node_1 = node_0.getChildAt(0);
node_1.style.positionType = CSSPositionType.ABSOLUTE;
node_1.style.position[POSITION_TOP] = 0;
node_1.style.position[POSITION_BOTTOM] = 20;
node_1.setPosition(Spacing.TOP, 0);
node_1.setPosition(Spacing.BOTTOM, 20);
}
}
@@ -5467,10 +5467,10 @@ public class LayoutEngineTest {
node_1 = node_0.getChildAt(0);
node_1.style.justifyContent = CSSJustify.CENTER;
node_1.style.positionType = CSSPositionType.ABSOLUTE;
node_1.style.position[POSITION_LEFT] = 0;
node_1.style.position[POSITION_TOP] = 0;
node_1.style.position[POSITION_RIGHT] = 0;
node_1.style.position[POSITION_BOTTOM] = 0;
node_1.setPosition(Spacing.LEFT, 0);
node_1.setPosition(Spacing.TOP, 0);
node_1.setPosition(Spacing.RIGHT, 0);
node_1.setPosition(Spacing.BOTTOM, 0);
addChildren(node_1, 1);
{
TestCSSNode node_2;
@@ -5523,7 +5523,7 @@ public class LayoutEngineTest {
TestCSSNode node_1;
node_1 = node_0.getChildAt(0);
node_1.style.positionType = CSSPositionType.ABSOLUTE;
node_1.style.position[POSITION_BOTTOM] = 0;
node_1.setPosition(Spacing.BOTTOM, 0);
}
}
@@ -5560,7 +5560,7 @@ public class LayoutEngineTest {
TestCSSNode node_1;
node_1 = node_0.getChildAt(0);
node_1.style.positionType = CSSPositionType.ABSOLUTE;
node_1.style.position[POSITION_RIGHT] = 0;
node_1.setPosition(Spacing.RIGHT, 0);
}
}
@@ -5598,7 +5598,7 @@ public class LayoutEngineTest {
node_1 = node_0.getChildAt(0);
node_1.style.positionType = CSSPositionType.ABSOLUTE;
node_1.style.dimensions[DIMENSION_HEIGHT] = 10;
node_1.style.position[POSITION_BOTTOM] = 0;
node_1.setPosition(Spacing.BOTTOM, 0);
}
}
@@ -5636,7 +5636,7 @@ public class LayoutEngineTest {
node_1 = node_0.getChildAt(0);
node_1.style.positionType = CSSPositionType.ABSOLUTE;
node_1.style.dimensions[DIMENSION_WIDTH] = 10;
node_1.style.position[POSITION_RIGHT] = 0;
node_1.setPosition(Spacing.RIGHT, 0);
}
}
@@ -5673,7 +5673,7 @@ public class LayoutEngineTest {
node_1 = node_0.getChildAt(0);
node_1.style.positionType = CSSPositionType.ABSOLUTE;
node_1.style.dimensions[DIMENSION_HEIGHT] = 10;
node_1.style.position[POSITION_BOTTOM] = 0;
node_1.setPosition(Spacing.BOTTOM, 0);
}
}
@@ -5710,7 +5710,7 @@ public class LayoutEngineTest {
node_1 = node_0.getChildAt(0);
node_1.style.positionType = CSSPositionType.ABSOLUTE;
node_1.style.dimensions[DIMENSION_WIDTH] = 10;
node_1.style.position[POSITION_RIGHT] = 0;
node_1.setPosition(Spacing.RIGHT, 0);
}
}
@@ -5890,7 +5890,7 @@ public class LayoutEngineTest {
{
TestCSSNode node_1;
node_1 = node_0.getChildAt(0);
node_1.style.position[POSITION_LEFT] = 5;
node_1.setPosition(Spacing.LEFT, 5);
addChildren(node_1, 1);
{
TestCSSNode node_2;
@@ -7297,10 +7297,10 @@ public class LayoutEngineTest {
node_1.style.positionType = CSSPositionType.ABSOLUTE;
node_1.style.maxWidth = 500;
node_1.style.maxHeight = 600;
node_1.style.position[POSITION_LEFT] = 100;
node_1.style.position[POSITION_TOP] = 100;
node_1.style.position[POSITION_RIGHT] = 100;
node_1.style.position[POSITION_BOTTOM] = 100;
node_1.setPosition(Spacing.LEFT, 100);
node_1.setPosition(Spacing.TOP, 100);
node_1.setPosition(Spacing.RIGHT, 100);
node_1.setPosition(Spacing.BOTTOM, 100);
}
}
@@ -7340,10 +7340,10 @@ public class LayoutEngineTest {
node_1.style.positionType = CSSPositionType.ABSOLUTE;
node_1.style.minWidth = 900;
node_1.style.minHeight = 1000;
node_1.style.position[POSITION_LEFT] = 100;
node_1.style.position[POSITION_TOP] = 100;
node_1.style.position[POSITION_RIGHT] = 100;
node_1.style.position[POSITION_BOTTOM] = 100;
node_1.setPosition(Spacing.LEFT, 100);
node_1.setPosition(Spacing.TOP, 100);
node_1.setPosition(Spacing.RIGHT, 100);
node_1.setPosition(Spacing.BOTTOM, 100);
}
}
@@ -7478,19 +7478,19 @@ public class LayoutEngineTest {
node_1.setPadding(Spacing.BOTTOM, 10);
node_1.setPadding(Spacing.START, 10);
node_1.setPadding(Spacing.END, 10);
node_1.style.position[POSITION_LEFT] = 100;
node_1.style.position[POSITION_TOP] = 100;
node_1.style.position[POSITION_RIGHT] = 100;
node_1.style.position[POSITION_BOTTOM] = 100;
node_1.setPosition(Spacing.LEFT, 100);
node_1.setPosition(Spacing.TOP, 100);
node_1.setPosition(Spacing.RIGHT, 100);
node_1.setPosition(Spacing.BOTTOM, 100);
addChildren(node_1, 1);
{
TestCSSNode node_2;
node_2 = node_1.getChildAt(0);
node_2.style.positionType = CSSPositionType.ABSOLUTE;
node_2.style.position[POSITION_LEFT] = 10;
node_2.style.position[POSITION_TOP] = 10;
node_2.style.position[POSITION_RIGHT] = 10;
node_2.style.position[POSITION_BOTTOM] = 10;
node_2.setPosition(Spacing.LEFT, 10);
node_2.setPosition(Spacing.TOP, 10);
node_2.setPosition(Spacing.RIGHT, 10);
node_2.setPosition(Spacing.BOTTOM, 10);
}
}
}
@@ -7550,19 +7550,19 @@ public class LayoutEngineTest {
node_1.setBorder(Spacing.BOTTOM, 1);
node_1.setBorder(Spacing.START, 1);
node_1.setBorder(Spacing.END, 1);
node_1.style.position[POSITION_LEFT] = 100;
node_1.style.position[POSITION_TOP] = 100;
node_1.style.position[POSITION_RIGHT] = 100;
node_1.style.position[POSITION_BOTTOM] = 100;
node_1.setPosition(Spacing.LEFT, 100);
node_1.setPosition(Spacing.TOP, 100);
node_1.setPosition(Spacing.RIGHT, 100);
node_1.setPosition(Spacing.BOTTOM, 100);
addChildren(node_1, 1);
{
TestCSSNode node_2;
node_2 = node_1.getChildAt(0);
node_2.style.positionType = CSSPositionType.ABSOLUTE;
node_2.style.position[POSITION_LEFT] = 10;
node_2.style.position[POSITION_TOP] = 10;
node_2.style.position[POSITION_RIGHT] = 10;
node_2.style.position[POSITION_BOTTOM] = 10;
node_2.setPosition(Spacing.LEFT, 10);
node_2.setPosition(Spacing.TOP, 10);
node_2.setPosition(Spacing.RIGHT, 10);
node_2.setPosition(Spacing.BOTTOM, 10);
}
}
}
@@ -7621,10 +7621,10 @@ public class LayoutEngineTest {
TestCSSNode node_2;
node_2 = node_1.getChildAt(0);
node_2.style.positionType = CSSPositionType.ABSOLUTE;
node_2.style.position[POSITION_LEFT] = 10;
node_2.style.position[POSITION_TOP] = 10;
node_2.style.position[POSITION_RIGHT] = 10;
node_2.style.position[POSITION_BOTTOM] = 10;
node_2.setPosition(Spacing.LEFT, 10);
node_2.setPosition(Spacing.TOP, 10);
node_2.setPosition(Spacing.RIGHT, 10);
node_2.setPosition(Spacing.BOTTOM, 10);
}
}
}