pavelbabenko / react-native-awesome-gallery

Performant, native-like, and well-customizable gallery for React Native.
MIT License
495 stars 54 forks source link

how to retrain actual image quality on zoom image #65

Open ast-gourav opened 10 months ago

ast-gourav commented 10 months ago

i have hd image like size is 1 to 2 mb but on zooming its not visible clear how can i retreive actual image quality but in web its showing actual image quality on zoom

my code:-

import React, {useState, useEffect} from 'react';
import {View, Text, TouchableOpacity} from 'react-native';
import Gallery from 'react-native-awesome-gallery';

const SpeechToTextComponent = () => {
  const [index, setIndex] = useState(0);
  const images = [
    'https://d22pqt2na9k0l.cloudfront.net/image/2023/11/11/kka/kol/08/10nov23_pk_kka_kol_8_r1_20231116062003.jpg',
    'https://d22pqt2na9k0l.cloudfront.net/image/2023/11/11/kka/kol/08/10nov23_pk_kka_kol_8_r1_20231116062003.jpg',
    'https://d22pqt2na9k0l.cloudfront.net/image/2023/11/11/kka/kol/08/10nov23_pk_kka_kol_8_r1_20231116062003.jpg',
    'https://d22pqt2na9k0l.cloudfront.net/image/2023/11/11/kka/kol/08/10nov23_pk_kka_kol_8_r1_20231116062003.jpg',
  ];
  const [scale, setScale] = useState(1); // Initial scale

  const handleScaleChange = newScale => {
    console.log("newScale", newScale);
    // Update the scale state
    setScale(newScale);
  };

  return (
    <View>
      {/* <PrabhatKharbharLogoForLightMode height={130} width={270}/> */}
      <Gallery
        data={images}
        onIndexChange={newIndex => {
          console.log(newIndex);
          setIndex(newIndex);
        }}
        key={index?.toString()}
        disableTransitionOnScaledImage={true}
        hideAdjacentImagesOnScaledImage={true}
        onScaleChangeRange={({scale, width, height}) => {
          // Adjust width and height according to scale
          const adjustedWidth = width * scale;
          const adjustedHeight = height * scale;

          return {width: adjustedWidth, height: adjustedHeight};
        }}
      />
    </View>
  );
};

export default SpeechToTextComponent;