Merge pull request #22 from tsdmrfth/develop

v4
tsdmrfth · Apr 14, 2021 · a627a1d · a627a1d
2 parents 5442025 + fb0eccb
commit a627a1d
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 8 deletions.
diff --git a/README.md b/README.md
@@ -120,7 +120,6 @@ export default function App() {
             <Steve
                 isRTL={false}
                 data={topics}
-                itemSpacing={10}
                 renderItem={renderTopic}
                 itemStyle={{ margin: 5 }}
                 containerStyle={steveContainer}

diff --git a/src/Steve.js b/src/Steve.js
@@ -160,13 +160,7 @@ export const Steve = ({ data, renderItem, keyExtractor, containerStyle, isRTL, i
             .values(itemLayoutsCache.current)
             .reduce((accumulator, current, index) => {
                 if (index === 0) {
-                    const firstIndex = isRTL ? 1 : 0
-                    const secondIndex = isRTL ? 0 : 1
-                    const firstKey = keyExtractor(data[firstIndex], firstIndex)
-                    const secondKey = keyExtractor(data[secondIndex], secondIndex)
-                    const firstItem = itemLayoutsCache.current[firstKey]
-                    const secondItem = itemLayoutsCache.current[secondKey]
-                    spacingBetweenItems = secondItem.layout.x - firstItem.layout.width - firstItem.layout.x
+                    spacingBetweenItems = getSpacingBetweenItems()
                 }
 
                 if (!accumulator.sumWidthOfLayer) {
@@ -183,6 +177,20 @@ export const Steve = ({ data, renderItem, keyExtractor, containerStyle, isRTL, i
         setItemLayouts(itemLayoutsCache.current)
     }
 
+    const getSpacingBetweenItems = () => {
+        if (data.length < 2) {
+            return 0
+        }
+
+        const firstIndex = isRTL ? 1 : 0
+        const secondIndex = isRTL ? 0 : 1
+        const firstKey = keyExtractor(data[firstIndex], firstIndex)
+        const secondKey = keyExtractor(data[secondIndex], secondIndex)
+        const firstItem = itemLayoutsCache.current[firstKey]
+        const secondItem = itemLayoutsCache.current[secondKey]
+        return secondItem.layout.x - firstItem.layout.width - firstItem.layout.x
+    }
+
     return (
         <PanGestureHandler
             activeOffsetX={[-10, 10]}