Add initialScale property

[jakub-gonet]

Motivation

Frequently when user zooms too much the contents are pixelated. One way to fix is to use a much bigger image/SVG/etc and set the initial scale to some small value. This PR allows doing that by adding the option to set initialScale.

Changes

Added initialScale prop with types and updated README

Example code and GIF

import React from 'react';
import {SafeAreaView, View, Dimensions, Animated} from 'react-native';
import ImageZoom from 'react-native-image-pan-zoom';
import {Svg, Circle} from 'react-native-svg';

const AnimSvg = Animated.createAnimatedComponent(Svg);
export default () => {
  return (
    <SafeAreaView style={[{flex: 1}, styles.container]}>
      <ImageZoom
        cropWidth={Dimensions.get('window').width}
        cropHeight={Dimensions.get('window').height}
        imageWidth={150}
        imageHeight={150}
        minScale={0.3}
        maxScale={25}
        initialScale={2}
        useNativeDriver={true}>
        <AnimSvg
          viewBox={`0 0 150 ${150}`}
          height="300"
          width="300"
          style={{backgroundColor: 'pink'}}>
          <Circle cx="50" cy="50" r="50" stroke={'black'} />
        </AnimSvg>
      </ImageZoom>
      <View>
        <Svg height="150" width="150" style={{backgroundColor: 'lightblue'}}>
          <Circle cx="50" cy="50" r="50" stroke={'black'} />
        </Svg>
      </View>
    </SafeAreaView>
  );
};
const styles = {
  container: {justifyContent: 'center', alignItems: 'center'},
  rectangle: {
    backgroundColor: 'pink',
    width: 100,
    height: 100,
  },
};

[obsidianart]

thanks a lot, I really needed this change!