Add scrollview

src/view/com/lightbox/ImageViewing/index.tsx

@@ -130,14 +130,40 @@ function ImageViewing({
             <ImageDefaultHeader onRequestClose={onRequestCloseEnhanced} />
           )}
         </Animated.View>
-        <ImageItem
+        <VirtualizedList
-          onZoom={onZoom}
+          ref={imageList}
-          imageSrc={images[0]}
+          data={images}
-          onRequestClose={onRequestCloseEnhanced}
+          horizontal
-          onLongPress={onLongPress}
+          pagingEnabled
-          delayLongPress={delayLongPress}
+          showsHorizontalScrollIndicator={false}
-          swipeToCloseEnabled={swipeToCloseEnabled}
+          showsVerticalScrollIndicator={false}
-          doubleTapToZoomEnabled={doubleTapToZoomEnabled}
+          getItem={(_, index) => images[index]}
+          getItemCount={() => images.length}
+          getItemLayout={(_, index) => ({
+            length: SCREEN_WIDTH,
+            offset: SCREEN_WIDTH * index,
+            index,
+          })}
+          renderItem={({item: imageSrc}) => (
+            <ImageItem
+              onZoom={onZoom}
+              imageSrc={imageSrc}
+              onRequestClose={onRequestCloseEnhanced}
+              onLongPress={onLongPress}
+              delayLongPress={delayLongPress}
+              swipeToCloseEnabled={swipeToCloseEnabled}
+              doubleTapToZoomEnabled={doubleTapToZoomEnabled}
+            />
+          )}
+          onMomentumScrollEnd={onScroll}
+          //@ts-ignore
+          keyExtractor={(imageSrc, index) =>
+            keyExtractor
+              ? keyExtractor(imageSrc, index)
+              : typeof imageSrc === 'number'
+              ? `${imageSrc}`
+              : imageSrc.uri
+          }
         />
         {typeof FooterComponent !== 'undefined' && (
           <Animated.View style={[styles.footer, {transform: footerTransform}]}>