this package is not working
Closed this issue · 2 comments
gisawebdev commented
Bug
i'm practicing in an expo app i follow all the instructions in the package and i get this error:
Possible Unhandled Promise Rejection (id: 0):
Error: Cannot find native module 'ImageColors', js engine: hermes
Environment info
Library | Version |
---|---|
expo | ~49.0.6 |
react-native | 0.72.3 |
react-native-image-colors | ^2.3.0 |
Steps To Reproduce
import { View, ActivityIndicator, Dimensions, ScrollView } from 'react-native';
import React from 'react';
import { useSafeAreaInsets } from 'react-native-safe-area-context';
import Carousel from 'react-native-snap-carousel';
import ImageColors from 'react-native-image-colors';
import { useMovies } from '../hooks/useMovies';
import { MoviePoster } from '../components/MoviePoster';
import HorizontalSlider from '../components/HorizontalSlider';
import GradientBackground from '../components/GradientBackground';
const windowWidth = Dimensions.get('window').width;
const HomeScreen = () => {
const { top } = useSafeAreaInsets();
const { nowPlaying, popular, topRated, upcoming, isLoading } = useMovies();
const getPosterColors = (index: number) => {
const movie = nowPlaying[index];
const uri = `https://image.tmdb.org/t/p/w500${movie.poster_path}`;
const colors = await ImageColors.getColors(uri, {});
console.log(colors)
};
if (isLoading) {
return (
<View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
<ActivityIndicator color='red' size={20} />
</View>
);
}
return (
<GradientBackground>
<ScrollView>
<View style={{ marginTop: top + 20 }}>
{/* Main Carousel */}
<View style={{ height: 440 }}>
<Carousel
data={nowPlaying}
renderItem={({ item }) => <MoviePoster movie={item} />}
sliderWidth={windowWidth}
itemWidth={300}
inactiveSlideOpacity={0.9}
onSnapToItem={(index) => getPosterColors(index)}
/>
</View>
{/* Popular Movie */}
<HorizontalSlider title='Popular' movies={popular} />
<HorizontalSlider title='Top Rated' movies={topRated} />
<HorizontalSlider title='Upcoming' movies={upcoming} />
</View>
</ScrollView>
</GradientBackground>
);
};
export default HomeScreen;
DevRequena commented
I have the same issue, do you resolve this problem?
khorark commented
Default import is deprecated in new version this lib. Use
import { getColors } from 'react-native-image-colors';
instead
import ImageColors from 'react-native-image-colors';