Fix the view alignment along the cross axis. (#167)

This PR fixes the view alignment along the cross axis when RV scrolls toward
the start position and view's sizes along the cross axis in a same line are
not the same.

flexbox/src/androidTest/java/com/google/android/flexbox/test/FlexboxLayoutManagerTest.java

@@ -1740,6 +1740,67 @@ public class FlexboxLayoutManagerTest {
 
         assertThat(layoutManager.getChildAt(positionInSecondLine).getBottom(),
                 isEqualAllowingError(TestUtil.dpToPixel(activity, 210))); // 80 + 130
+        // Verify that the view in the same line's cross axis position is correct
+        assertThat(layoutManager.getChildAt(positionInSecondLine - 1).getBottom(),
+                isEqualAllowingError(TestUtil.dpToPixel(activity, 160))); // 80 + 80
+    }
+
+    @Test
+    @FlakyTest
+    public void testScrollToLeft_middleItem_as_anchorPosition() throws Throwable {
+        final FlexboxTestActivity activity = mActivityRule.getActivity();
+        final FlexboxLayoutManager layoutManager = new FlexboxLayoutManager();
+        final TestAdapter adapter = new TestAdapter();
+        final int positionInSecondLine = 6;
+        mActivityRule.runOnUiThread(new Runnable() {
+            @Override
+            public void run() {
+                activity.setContentView(R.layout.recyclerview);
+                RecyclerView recyclerView = (RecyclerView) activity.findViewById(R.id.recyclerview);
+                layoutManager.setFlexDirection(FlexDirection.COLUMN);
+                recyclerView.setLayoutManager(layoutManager);
+                recyclerView.setAdapter(adapter);
+                for (int i = 0; i < 50; i++) {
+                    FlexboxLayoutManager.LayoutParams lp = createLayoutParams(activity, 80, 50);
+                    if (i == positionInSecondLine) {
+                        // Change the width from other items in the second line, not the first item
+                        // in the second line
+                        lp = createLayoutParams(activity, 130, 50);
+                    }
+                    adapter.addItem(lp);
+                }
+                // RecyclerView width: 320, height: 240.
+                // Each line has 4 (240 / 50) flex items and 12 (50 / 4) lines in total
+            }
+        });
+        InstrumentationRegistry.getInstrumentation().waitForIdleSync();
+        assertThat(layoutManager.getFlexDirection(), is(FlexDirection.COLUMN));
+
+        onView(withId(R.id.recyclerview)).perform(swipe(GeneralLocation.CENTER_RIGHT,
+                GeneralLocation.CENTER_LEFT));
+        onView(withId(R.id.recyclerview)).perform(swipe(GeneralLocation.CENTER_RIGHT,
+                GeneralLocation.CENTER_LEFT));
+        onView(withId(R.id.recyclerview)).perform(swipe(GeneralLocation.CENTER_RIGHT,
+                GeneralLocation.CENTER_LEFT));
+        onView(withId(R.id.recyclerview)).perform(swipe(GeneralLocation.CENTER_RIGHT,
+                GeneralLocation.CENTER_LEFT));
+        // By this moment reached to the right edge
+
+        // Now scrolling to the left to see if the views in the first flex line is correctly placed
+        onView(withId(R.id.recyclerview)).perform(swipe(GeneralLocation.CENTER_LEFT,
+                GeneralLocation.CENTER_RIGHT));
+        onView(withId(R.id.recyclerview)).perform(swipe(GeneralLocation.CENTER_LEFT,
+                GeneralLocation.CENTER_RIGHT));
+        onView(withId(R.id.recyclerview)).perform(swipe(GeneralLocation.CENTER_LEFT,
+                GeneralLocation.CENTER_RIGHT));
+        onView(withId(R.id.recyclerview)).perform(swipe(GeneralLocation.CENTER_LEFT,
+                GeneralLocation.CENTER_RIGHT));
+
+        assertThat(layoutManager.getChildAt(positionInSecondLine).getRight(),
+                isEqualAllowingError(TestUtil.dpToPixel(activity, 210))); // 80 + 130
+        // Verify that the view in the same line's cross axis position is correct
+        assertThat(layoutManager.getChildAt(positionInSecondLine - 1).getRight(),
+                isEqualAllowingError(TestUtil.dpToPixel(activity, 160))); // 80 + 80
     }
 
     @Test

flexbox/src/main/java/com/google/android/flexbox/FlexboxLayoutManager.java

@@ -825,9 +825,10 @@ public class FlexboxLayoutManager extends RecyclerView.LayoutManager implements
         int paddingRight = getPaddingRight();
         int parentWidth = getWidth();
 
-        // Either childTop or childBottom is used depending on the layoutState.mLayoutDirection
         int childTop = layoutState.mOffset;
-        int childBottom = layoutState.mOffset;
+        if (layoutState.mLayoutDirection == LayoutDirection.START) {
+            childTop = childTop - flexLine.mCrossSize;
+        }
         int startPosition = layoutState.mPosition;
 
         float childLeft;
@@ -903,29 +904,16 @@ public class FlexboxLayoutManager extends RecyclerView.LayoutManager implements
                 indexInFlexLine++;
             }
 
-            if (layoutState.mLayoutDirection == LayoutDirection.END) {
-                if (mIsRtl) {
-                    mFlexboxHelper.layoutSingleChildHorizontal(view, flexLine,
-                            Math.round(childRight) - view.getMeasuredWidth(),
-                            childTop, Math.round(childRight),
-                            childTop + view.getMeasuredHeight());
-                } else {
-                    mFlexboxHelper.layoutSingleChildHorizontal(view, flexLine,
-                            Math.round(childLeft), childTop,
-                            Math.round(childLeft) + view.getMeasuredWidth(),
-                            childTop + view.getMeasuredHeight());
-                }
+            if (mIsRtl) {
+                mFlexboxHelper.layoutSingleChildHorizontal(view, flexLine,
+                        Math.round(childRight) - view.getMeasuredWidth(),
+                        childTop, Math.round(childRight),
+                        childTop + view.getMeasuredHeight());
             } else {
-                if (mIsRtl) {
-                    mFlexboxHelper.layoutSingleChildHorizontal(view, flexLine,
-                            Math.round(childRight) - view.getMeasuredWidth(),
-                            childBottom - view.getMeasuredHeight(), Math.round(childRight),
-                            childBottom);
-                } else {
-                    mFlexboxHelper.layoutSingleChildHorizontal(view, flexLine,
-                            Math.round(childLeft), childBottom - view.getMeasuredHeight(),
-                            Math.round(childLeft) + view.getMeasuredWidth(), childBottom);
-                }
+                mFlexboxHelper.layoutSingleChildHorizontal(view, flexLine,
+                        Math.round(childLeft), childTop,
+                        Math.round(childLeft) + view.getMeasuredWidth(),
+                        childTop + view.getMeasuredHeight());
             }
             childLeft += (view.getMeasuredWidth() + lp.rightMargin + getRightDecorationWidth(view)
                     + spaceBetweenItem);
@@ -949,7 +937,9 @@ public class FlexboxLayoutManager extends RecyclerView.LayoutManager implements
 
         // Either childLeft or childRight is used depending on the layoutState.mLayoutDirection
         int childLeft = layoutState.mOffset;
-        int childRight = layoutState.mOffset;
+        if (layoutState.mLayoutDirection == LayoutDirection.START) {
+            childLeft = childLeft - flexLine.mCrossSize;
+        }
         int startPosition = layoutState.mPosition;
 
         float childTop;
@@ -1026,28 +1016,15 @@ public class FlexboxLayoutManager extends RecyclerView.LayoutManager implements
                 indexInFlexLine++;
             }
 
-            if (layoutState.mLayoutDirection == LayoutDirection.END) {
-                if (mFromBottomToTop) {
-                    mFlexboxHelper.layoutSingleChildVertical(view, flexLine, mIsRtl,
-                            childLeft, Math.round(childBottom) - view.getMeasuredHeight(),
-                            childLeft + view.getMeasuredWidth(), Math.round(childBottom));
-                } else {
-                    mFlexboxHelper.layoutSingleChildVertical(view, flexLine, mIsRtl,
-                            childLeft, Math.round(childTop),
-                            childLeft + view.getMeasuredWidth(),
-                            Math.round(childTop) + view.getMeasuredHeight());
-                }
+            if (mFromBottomToTop) {
+                mFlexboxHelper.layoutSingleChildVertical(view, flexLine, mIsRtl,
+                        childLeft, Math.round(childBottom) - view.getMeasuredHeight(),
+                        childLeft + view.getMeasuredWidth(), Math.round(childBottom));
             } else {
-                if (mFromBottomToTop) {
-                    mFlexboxHelper.layoutSingleChildVertical(view, flexLine, mIsRtl,
-                            childRight - view.getMeasuredWidth(),
-                            Math.round(childBottom) - view.getMeasuredHeight(), childRight,
-                            Math.round(childBottom));
-                } else {
-                    mFlexboxHelper.layoutSingleChildVertical(view, flexLine, mIsRtl,
-                            childRight - view.getMeasuredWidth(), Math.round(childTop),
-                            childRight, Math.round(childTop) + view.getMeasuredHeight());
-                }
+                mFlexboxHelper.layoutSingleChildVertical(view, flexLine, mIsRtl,
+                        childLeft, Math.round(childTop),
+                        childLeft + view.getMeasuredWidth(),
+                        Math.round(childTop) + view.getMeasuredHeight());
             }
             childTop += (view.getMeasuredHeight() + lp.topMargin + getTopDecorationHeight(view)
                     + spaceBetweenItem);