lucas.delanier
/
MovieFinder
2
2
Fork 1
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix display homepage

Browse Source
redux_test_david
Lucas Delanier 2 years ago
parent 39ff985d99
commit f243584049
3 changed files with 86 additions and 85 deletions
Show Stats Download Patch File Download Diff File

2
navigation/index.tsx
Unescape View File

@ -61,7 +61,7 @@ function BottomTabNavigator() {
return ( return (
<BottomTab.Navigator <BottomTab.Navigator
initialRouteName="WatchLater" initialRouteName="Home"
screenOptions={{ screenOptions={{
tabBarActiveTintColor: "purple", tabBarActiveTintColor: "purple",

159
screens/HomeScreen.tsx
Unescape View File

@ -73,10 +73,16 @@ export default function HomeScreen({ navigation }: RootStackScreenProps<'Home'>)
}); });
const dispatch = useDispatch(); const dispatch = useDispatch();
useEffect(() => {
const loadTrendingID = async () => {
// @ts-ignore
await dispatch(getTrendingID());
};
console.log("test1:", trendingMovies);
loadTrendingID();
}, [dispatch]);
type ItemProps = { type ItemProps = {
movie : Movie movie : Movie
@ -88,80 +94,83 @@ export default function HomeScreen({ navigation }: RootStackScreenProps<'Home'>)
dispatch(removeMovieTrending(props)); dispatch(removeMovieTrending(props));
} }
return( return(
<SafeAreaView style={styles.background}> <>
<ImageBackground blurRadius={20} {trendingMovies.length !== 0 && (
style={{ <SafeAreaView style={styles.background}>
position: 'absolute', <ImageBackground blurRadius={20}
width: "120%", style={{
height: "120%", position: 'absolute',
justifyContent: "center", width: "120%",
alignItems: "center", height: "120%",
opacity: 0.28 justifyContent: "center",
}} alignItems: "center",
source={{ opacity: 0.28
uri: trendingMovies[0].poster_path, }}
}} source={{
></ImageBackground> uri: trendingMovies[0].poster_path,
<View style={styles.image}> }}
<Image ></ImageBackground>
style={styles.filmCard} <View style={styles.image}>
source={{
uri: trendingMovies[0].poster_path,
}}
/>
</View>
<View style={{height:35, marginTop: 10, marginBottom: 15}}>
<ScrollView
horizontal={true}
showsHorizontalScrollIndicator={false}>
<BadgeGenre name={"cc"} isSelected={false}></BadgeGenre>
<BadgeGenre name={"cc"} isSelected={false}></BadgeGenre>
<BadgeGenre name={"cc"} isSelected={false}></BadgeGenre>
<BadgeGenre name={"cc"} isSelected={true}></BadgeGenre>
<BadgeGenre name={"cc"} isSelected={false}></BadgeGenre>
<BadgeGenre name={"cc"} isSelected={false}></BadgeGenre>
<BadgeGenre name={"cc"} isSelected={false}></BadgeGenre>
<BadgeGenre name={"cc"} isSelected={false}></BadgeGenre>
<BadgeGenre name={"cc"} isSelected={false}></BadgeGenre>
</ScrollView>
</View>
<View style={{ flexDirection: 'column', alignSelf: 'flex-start', alignItems: 'flex-start', paddingHorizontal: 30, flex: 1 }}>
<View style={{ flexDirection: 'row', alignSelf: 'flex-start', justifyContent: 'flex-start', width: "100%"}}>
<BadgeFilm name={"Science-fiction"}></BadgeFilm>
<BadgeFilm name={"Science-fiction"}></BadgeFilm>
<BadgeFilm name={"9:11"}></BadgeFilm>
</View>
<View>
<Text numberOfLines={1} style={{color: "white", fontSize: 28, fontWeight: "bold", paddingTop: 5}}>{trendingMovies[0].original_title}</Text>
</View>
<Text style={{color: "grey", fontSize: 20, fontWeight: "bold"}}>{trendingMovies[0].release_date}</Text>
</View>
<View style={{ flexDirection: 'row' ,alignItems: 'center', justifyContent: "space-evenly", paddingHorizontal: 30, height: '15%', width:'100%'}}>
<TouchableOpacity onPress={() => addWatchLater(trendingMovies[0])}>
<Image
source={require('../assets/images/WatchLater.png')} style={{ resizeMode:"stretch", height:'65%', aspectRatio: 1,}}
/>
</TouchableOpacity>
<TouchableOpacity>
<Image
source={require('../assets/images/Generate.png')} style={{resizeMode:"stretch", height:'85%',aspectRatio: 1,}}
/>
</TouchableOpacity>
<TouchableOpacity>
<Image <Image
source={require('../assets/images/Favorite.png')} style={{ resizeMode:"stretch", height:'65%', aspectRatio: 1,}} style={styles.filmCard}
source={{
uri: trendingMovies[0].poster_path,
}}
/> />
</View>
</TouchableOpacity> <View style={{height:35, marginTop: 10, marginBottom: 15}}>
</View> <ScrollView
</SafeAreaView>); horizontal={true}
showsHorizontalScrollIndicator={false}>
<BadgeGenre name={"cc"} isSelected={false}></BadgeGenre>
<BadgeGenre name={"cc"} isSelected={false}></BadgeGenre>
<BadgeGenre name={"cc"} isSelected={false}></BadgeGenre>
<BadgeGenre name={"cc"} isSelected={true}></BadgeGenre>
<BadgeGenre name={"cc"} isSelected={false}></BadgeGenre>
<BadgeGenre name={"cc"} isSelected={false}></BadgeGenre>
<BadgeGenre name={"cc"} isSelected={false}></BadgeGenre>
<BadgeGenre name={"cc"} isSelected={false}></BadgeGenre>
<BadgeGenre name={"cc"} isSelected={false}></BadgeGenre>
</ScrollView>
</View>
<View style={{ flexDirection: 'column', alignSelf: 'flex-start', alignItems: 'flex-start', paddingHorizontal: 30, flex: 1 }}>
<View style={{ flexDirection: 'row', alignSelf: 'flex-start', justifyContent: 'flex-start', width: "100%"}}>
<BadgeFilm name={"Science-fiction"}></BadgeFilm>
<BadgeFilm name={"Science-fiction"}></BadgeFilm>
<BadgeFilm name={"9:11"}></BadgeFilm>
</View>
<View>
<Text numberOfLines={1} style={{color: "white", fontSize: 28, fontWeight: "bold", paddingTop: 5}}>{trendingMovies[0].original_title}</Text>
</View>
<Text style={{color: "grey", fontSize: 20, fontWeight: "bold"}}>{trendingMovies[0].release_date}</Text>
</View>
<View style={{ flexDirection: 'row' ,alignItems: 'center', justifyContent: "space-evenly", paddingHorizontal: 30, height: '15%', width:'100%'}}>
<TouchableOpacity onPress={() => addWatchLater(trendingMovies[0])}>
<Image
source={require('../assets/images/WatchLater.png')} style={{ resizeMode:"stretch", height:'65%', aspectRatio: 1,}}
/>
</TouchableOpacity>
<TouchableOpacity>
<Image
source={require('../assets/images/Generate.png')} style={{resizeMode:"stretch", height:'85%',aspectRatio: 1,}}
/>
</TouchableOpacity>
<TouchableOpacity>
<Image
source={require('../assets/images/Favorite.png')} style={{ resizeMode:"stretch", height:'65%', aspectRatio: 1,}}
/>
</TouchableOpacity>
</View>
</SafeAreaView>)}
</>
)
} }
type BadgeGenreProps = { type BadgeGenreProps = {
name : String name : String
@ -170,7 +179,7 @@ type BadgeGenreProps = {
} }
export function BadgeGenre(props: BadgeGenreProps) { export function BadgeGenre(props: BadgeGenreProps) {
if(props.isSelected==false){ if(props.isSelected===false){
return ( return (
<View style={{paddingHorizontal: 20, marginHorizontal: 5,height: 35, backgroundColor: '#2E2E2E', borderRadius: 20, justifyContent: "center"}} > <View style={{paddingHorizontal: 20, marginHorizontal: 5,height: 35, backgroundColor: '#2E2E2E', borderRadius: 20, justifyContent: "center"}} >
<Text style={{color: "white"}}>{props.name}</Text> <Text style={{color: "white"}}>{props.name}</Text>

10
screens/WatchLaterScreen.tsx
Unescape View File

@ -42,15 +42,7 @@ export default function WatchLaterScreen({ navigation }: RootTabScreenProps<'Wat
const [isLoading, setLoading] = useState(true); const [isLoading, setLoading] = useState(true);
// @ts-ignore // @ts-ignore
const trendingMovies = useSelector(state => state.appReducer.watchLaterMovies); const trendingMovies = useSelector(state => state.appReducer.watchLaterMovies);
const dispatch = useDispatch();
useEffect(() => {
const loadTrendingID = async () => {
// @ts-ignore
await dispatch(getTrendingID());
};
loadTrendingID();
console.log("test2:", trendingMovies);
}, [dispatch]);
return ( return (
<SafeAreaView style={styles.container}> <SafeAreaView style={styles.container}>
<View style={{height: 50, justifyContent: "flex-start",flexDirection: 'row', paddingHorizontal:20, marginBottom: 15,marginVertical:5, alignItems:"flex-end"}} > <View style={{height: 50, justifyContent: "flex-start",flexDirection: 'row', paddingHorizontal:20, marginBottom: 15,marginVertical:5, alignItems:"flex-end"}} >

Write Preview
Loading…
Cancel
Save