normalise scroller, add vertical scroll position when changing from h…

…orizontal
flexn-io · Jun 7, 2023 · 416013c · 416013c
1 parent f02702b
commit 416013c
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 36 deletions.
diff --git a/packages/app-harness/src/screens/scrollToTop.tsx b/packages/app-harness/src/screens/scrollToTop.tsx
@@ -91,7 +91,7 @@ const ScrollToTop = () => {
                             style={{ ...styles.button, ...styles.button5 }}
                             title="Button5"
                             textStyle={styles.buttonTextStyle}
-                            focusOptions={{ animatorOptions: border }}
+                            focusOptions={{ animatorOptions: border, forbiddenFocusDirections: ['down'] }}
                         />
                     </View>
                     <View>
@@ -117,6 +117,7 @@ const ScrollToTop = () => {
                             type="row"
                             estimatedItemSize={Ratio(150)}
                             style={{ flex: 1 }}
+                            focusOptions={{ forbiddenFocusDirections: ['down'] }}
                         />
                     </View>
                 </View>

diff --git a/packages/create/src/focusManager/service/scroller.ts b/packages/create/src/focusManager/service/scroller.ts
@@ -63,63 +63,50 @@ class Scroller {
             y: scrollView.getScrollOffsetY(),
         };
 
+        const x = [
+            currentLayout.xMin - scrollView.getLayout().xMin - horizontalViewportOffset,
+            scrollView.getScrollOffsetX(),
+        ];
+
+        const y = [
+            currentLayout.yMin - scrollView.getLayout().yMin - verticalViewportOffset,
+            scrollView.getScrollOffsetY(),
+        ];
+
         switch (true) {
             case DIRECTION_RIGHT.includes(direction):
                 {
-                    if (!scrollView.isHorizontal() && currentLayout.yMin < scrollView.getScrollOffsetY()) {
-                        scrollTarget.y = currentLayout.yMin - verticalViewportOffset - scrollView.getLayout().yMin;
-                    }
-
-                    scrollTarget.x = Math.max(
-                        currentLayout.xMin - scrollView.getLayout().xMin - horizontalViewportOffset,
-                        scrollView.getScrollOffsetX()
-                    );
+                    const mathFunc = currentFocus.getLayout().absolute.yMax >= screenHeight ? Math.max : Math.min;
+                    scrollTarget.x = Math.max(...x);
+                    scrollTarget.y = mathFunc(...y);
                 }
                 break;
             case DIRECTION_LEFT.includes(direction):
                 {
-                    if (!scrollView.isHorizontal() && currentLayout.yMin < scrollView.getScrollOffsetY()) {
-                        scrollTarget.y = currentLayout.yMin - verticalViewportOffset - scrollView.getLayout().yMin;
-                    }
-
-                    scrollTarget.x = Math.min(
-                        currentLayout.xMin - scrollView.getLayout().xMin - horizontalViewportOffset,
-                        scrollView.getScrollOffsetX()
-                    );
+                    const mathFunc = currentFocus.getLayout().absolute.yMax >= screenHeight ? Math.max : Math.min;
+                    scrollTarget.x = Math.min(...x);
+                    scrollTarget.y = mathFunc(...y);
                 }
                 break;
             case DIRECTION_UP.includes(direction):
                 {
+                    const mathFunc = currentFocus.getLayout().absolute.xMax >= screenWidth ? Math.max : Math.min;
                     // If element is on the top and there is no more elements above which is higher than verticalViewportOffset
                     // then we move whole viewport to the 0 position
                     const lowestFocusableYMin = currentFocus.getScreen()?.getPrecalculatedFocus()?.getLayout()?.yMin;
-                    const targetY = currentLayout.yMin - verticalViewportOffset - scrollView.getLayout().yMin;
 
                     scrollTarget.y = Math.min(
-                        targetY,
-                        scrollView.getScrollOffsetY(),
-                        targetY < lowestFocusableYMin && currentLayout.yMax < screenHeight ? 0 : targetY
-                    );
-
-                    const mathFunc = currentFocus.getLayout().absolute.xMax >= screenWidth ? Math.max : Math.min;
-                    scrollTarget.x = mathFunc(
-                        currentLayout.xMin - scrollView.getLayout().xMin - horizontalViewportOffset,
-                        scrollView.getScrollOffsetX()
+                        y[0] < lowestFocusableYMin && currentLayout.yMax < screenHeight ? 0 : y[0],
+                        y[1]
                     );
+                    scrollTarget.x = mathFunc(...x);
                 }
                 break;
             case DIRECTION_DOWN.includes(direction):
                 {
-                    scrollTarget.y = Math.max(
-                        currentLayout.yMin - verticalViewportOffset - scrollView.getLayout().yMin,
-                        scrollView.getScrollOffsetY()
-                    );
-
                     const mathFunc = currentFocus.getLayout().absolute.xMax >= screenWidth ? Math.max : Math.min;
-                    scrollTarget.x = mathFunc(
-                        currentLayout.xMin - scrollView.getLayout().xMin - horizontalViewportOffset,
-                        scrollView.getScrollOffsetX()
-                    );
+                    scrollTarget.y = Math.max(...y);
+                    scrollTarget.x = mathFunc(...x);
                 }
                 break;
             default: