React Native Gesture Image Viewer
Guide
2.x
Guide
English
2.x

GestureViewer State

GestureViewer provides a state management system to track the current state of the viewer. You can use the useGestureViewerState hook to access the state of the viewer.

useGestureViewerState

import { GestureViewer, useGestureViewerState } from 'react-native-gesture-image-viewer';

function App() {
  const { currentIndex, totalCount } = useGestureViewerState();

  return (
    <View>
      <GestureViewer
        data={images}
        renderItem={renderImage}
      />
      <View>
        <Text>{`${currentIndex + 1} / ${totalCount}`}</Text>
      </View>
    </View>
  );
}

Parameters

  • id?: string
    • The ID of the GestureViewer instance.
    • Default: "default"

API Reference

PropertyDescriptionTypeDefault Value
currentIndexThe index of the currently displayed item.number0
totalCountThe total number of items.number0