react-native-gallery-preview/lib/module/components/GalleryPreviewForChildren/GalleryChildrenItem.js

<div> <img align="right" height="720" src="example.gif"> </div>

"use strict";

import React, { memo, useCallback, useState } from "react";
import { GestureItemComponent } from "../GestureItemComponent/GestureItemComponent";
import { StyleSheet, View } from "react-native";
import { jsx as _jsx } from "react/jsx-runtime";
export const GalleryChildrenItem = /*#__PURE__*/memo(({
  width,
  height,
  children,
  ...props
}) => {
  const [state, setState] = useState({
    width: 0,
    height: 0,
    contentCenterX: 0,
    contentCenterY: 0
  });
  const onChildrenLayout = useCallback(event => {
    const {
      layout
    } = event.nativeEvent;
    const center = {
      x: layout.x + width / 2,
      y: layout.y + height / 2
    };
    setState({
      width: layout.width,
      height: layout.height,
      contentCenterX: center.x,
      contentCenterY: center.y
    });
  }, [height, width]);
  return /*#__PURE__*/_jsx(GestureItemComponent, {
    contentCenterX: state.contentCenterX,
    contentCenterY: state.contentCenterY,
    contentContainerSize: {
      width: state.width,
      height: state.height
    },
    width: width,
    height: height,
    ...props,
    children: /*#__PURE__*/_jsx(View, {
      style: styles.children,
      onLayout: onChildrenLayout,
      children: children
    })
  });
});
const styles = StyleSheet.create({
  children: {
    justifyContent: "center",
    alignItems: "center"
  }
});
//# sourceMappingURL=GalleryChildrenItem.js.map