How to use the react-native-size-matters.moderateScale function in react-native-size-matters

arrowLeftContainer: {
    justifyContent: 'flex-end',
    alignItems: 'flex-start'
  },

  arrowRightContainer: {
    justifyContent: 'flex-end',
    alignItems: 'flex-end'
  },

  arrowLeft: {
    left: moderateScale(-6, 0.5)
  },

  arrowRight: {
    right: moderateScale(-6, 0.5)
  }
})

export default style

)
};

MusicSingle.propTypes = {
  title: Proptypes.string,
  artist: Proptypes.string,
  imageUrl: Proptypes.string,
  filename: Proptypes.string,
  id: Proptypes.string,
};

const styles = StyleSheet.create({
  container: {
    flexDirection: "row",
    marginTop: moderateScale(15),
    height: moderateScale(75),
    justifyContent: "space-between",
  },
  imageContainer: {
    height: "100%",
    width: "25%",
    marginRight: moderateScale(20)
  },
  image: {
    borderRadius: moderateScale(10),
    flex: 1,
    width: null,
    height: null,
    resizeMode: 'cover',
  },
  descriptionContainer: {

NowPlaying.navigationOptions = ({ navigation }) => ({
  title: "Now Playing",
  headerTransparent: true,
  headerLeft: (
      
        <img style="{{">
      
  ),
  headerRight: (
      
        
      
  ),
  headerTitleStyle: {
    textAlign:'center',
    alignSelf:'center',
    flex:1,
    fontFamily: "Avenir-Book",
    fontSize: moderateScale(20),
    color: color.white
  },
  headerStyle: {

trackStyle={{ backgroundColor: color.white, height: 8}}
              minimumTrackTintColor={color.green}
              thumbStyle={{ borderRadius: 50, width: 5, backgroundColor:color.green }}
          />
        
      

  )
};

const styles = StyleSheet.create({
  container: {
    width: "80%",
  },
  progressBar: {
    height: moderateScale(8),
    borderRadius: moderateScale(50),
  },
  textStyle: {
    color: color.white
  }
});

export default SeekBar;

import { StyleSheet } from "react-native";
import { moderateScale } from "react-native-size-matters";

const style = StyleSheet.create({
  container: {
    width: moderateScale(12),
    height: moderateScale(12),
    borderRadius: moderateScale(12) / 2,
    borderWidth: 2,
    borderColor: "#FFFFFF",
    margin: 5
  }
});

export default style;

import { StyleSheet } from 'react-native'
import { moderateScale } from 'react-native-size-matters'

const style = StyleSheet.create({
  container: {
    minWidth: moderateScale(40),
    height: moderateScale(40),
    borderRadius: moderateScale(40) / 2,
    backgroundColor: '#FFFFFF',
    justifyContent: 'center',
    alignItems: 'center'
  },
  pin: {
    fontSize: moderateScale(14),
    fontWeight: 'bold',
    color: '#7c7c7c'
  },
  suggestion: {
    fontSize: moderateScale(8),
    fontWeight: 'bold',
    color: '#adadad',
    marginTop: 10
  },
  image: {

return(
      
  )
};

import { StyleSheet } from "react-native";
import { moderateScale } from "react-native-size-matters";

const style = StyleSheet.create({
  container: {
    width: moderateScale(16),
    height: moderateScale(16),
    borderRadius: moderateScale(16) / 2,
    borderWidth: 2,
    borderColor: "#FFFFFF",
    margin: 5
  }
});

export default style;

import { StyleSheet } from 'react-native'
import { moderateScale } from 'react-native-size-matters'

const style = StyleSheet.create({
  container: {
    minWidth: moderateScale(40),
    height: moderateScale(40),
    borderRadius: moderateScale(40) / 2,
    backgroundColor: '#FFFFFF',
    justifyContent: 'center',
    alignItems: 'center'
  },
  pin: {
    fontSize: moderateScale(14),
    fontWeight: 'bold',
    color: '#7c7c7c'
  },
  suggestion: {
    fontSize: moderateScale(8),
    fontWeight: 'bold',
    color: '#adadad',
    marginTop: 10
  },
  image: {
    height: moderateScale(16),
    width: moderateScale(16)
  }
})

export default style

fontWeight: 'bold',
        marginBottom: scale(10),
        color: 'black'
    },
    text: {
        fontSize: moderateScale(14),
        color: 'black'
    },
    buttonsContainer: {
        flex: 1,
        justifyContent: 'flex-end',
        alignItems: 'center'
    },
    button: {
        width: moderateScale(150, 0.3),
        height: moderateScale(45, 0.3),
        borderRadius: 100,
        marginBottom: moderateScale(10, 0.6),
        backgroundColor: '#41B6E6',
        alignItems: 'center',
        justifyContent: 'center',
    },
    buttonText: {
        fontWeight: 'bold',
        fontSize: moderateScale(14),
        color: 'white'
    }
});

export default ScalingExample;