diff --git a/components/ListItemComponent.tsx b/components/ListItemComponent.tsx index e9b4d7d..aab3d50 100644 --- a/components/ListItemComponent.tsx +++ b/components/ListItemComponent.tsx @@ -10,8 +10,9 @@ export function ListItemComponent(props : ItemProps){ return ( + source={{uri: props.url}} + style={{flex:1, minHeight:250, minWidth:180}} + /> ) } diff --git a/navigation/DetailStackNav.tsx b/navigation/DetailStackNav.tsx new file mode 100644 index 0000000..8a07f37 --- /dev/null +++ b/navigation/DetailStackNav.tsx @@ -0,0 +1,17 @@ + +import { NavigationContainer } from '@react-navigation/native'; +import { createStackNavigator } from '@react-navigation/stack'; +import {createNativeStackNavigator} from '@react-navigation/native-stack'; + +import ListScreen from '../screens/ListScreen'; +import DetailCard from '../screens/DetailCard'; + +export default function DetailStackNav() { + const Stack = createStackNavigator(); + return ( + + + + + ) +} \ No newline at end of file diff --git a/navigation/Navigation.tsx b/navigation/Navigation.tsx index 6c18b78..f85e780 100644 --- a/navigation/Navigation.tsx +++ b/navigation/Navigation.tsx @@ -11,6 +11,7 @@ import ListFav from '../screens/ListFav'; import TabBarIcon from '../components/TabBarIcon'; import StackNavigation from './StackNavigation'; +import DetailStackNav from './DetailStackNav'; @@ -20,7 +21,7 @@ export default function Navigation() { return ( - , diff --git a/redux/actions/actionSelection.tsx b/redux/actions/actionSelection.tsx index 533a5d9..ecc85d6 100644 --- a/redux/actions/actionSelection.tsx +++ b/redux/actions/actionSelection.tsx @@ -60,8 +60,9 @@ export const getAllCards = () => { } //'pageSize':'100' }; - //! Actualisation de l'API (16/03) : - const CardsPromise = await fetch('https://us.api.blizzard.com/hearthstone/cards?locale=en_US&access_token=EU1AbKy9Q7sOUjQYC5AFF1O1JPuoAgCNxk', options); + //! Actualisation de l'API (29/03) : + const CardsPromise = await fetch('https://us.api.blizzard.com/hearthstone/cards?locale=en_US&access_token=EUrREr6QW0VZJgpRDgedTYqvX4P2BokjcC ', options); + //const CardsPromise = await fetch('https://us.api.blizzard.com/hearthstone/cards?locale=en_US&access_token=EUZvGOfXsMKYrjqLJp5mE7IJlhQuELMiPk ', options); //const CardsPromise = await fetch('https://us.api.blizzard.com/hearthstone/cards?locale=en_US&access_token=EURTWhjBC2SRb4Ez42BT1kx8R2NcJc07kL', options); //console.log("FETCH") //console.log(CardsPromise) diff --git a/screens/DetailCard.tsx b/screens/DetailCard.tsx new file mode 100644 index 0000000..6193df2 --- /dev/null +++ b/screens/DetailCard.tsx @@ -0,0 +1,62 @@ +import { StyleSheet, Text, View, Button, FlatList } from 'react-native'; +import { StatusBar } from 'expo-status-bar'; +import React, { useState } from "react"; +import { Card } from '../models/Card'; + +//* Components +import {ListItemComponent} from '../components/ListItemComponent' + +//@ts-ignore +export default function DetailMain({ route }){ + + const { card, other } = route.params; + + let pressed : Boolean = false + const [titleText, setTitleText] = useState(card.name) + const onPressTitle = () => { + pressed ? setTitleText(titleText + '\n' + 'Id : ' + card.id) : setTitleText(card.name) + pressed ? pressed = false :pressed = true + }; + return ( + + + {titleText} + + + + + + ); +} + + + +const styles = StyleSheet.create({ + container: { + flex: 1, + backgroundColor: '#fff', + alignItems: 'center', + justifyContent: 'center', + }, + item: { + borderRadius : 15, + backgroundColor: '#efefef', + padding: 15, + maxHeight:300, + maxWidth:350, + }, + title: { + fontStyle: "italic", + fontSize: 20, + }, + titleView: { + flex: 1, + justifyContent: 'center', + padding: 10, + backgroundColor: '#fff', + borderRadius : 10, + borderWidth: 10, + borderColor: '#efefef', + maxHeight: 100, + } +}); diff --git a/screens/ListScreen.tsx b/screens/ListScreen.tsx index 7c68a24..a417efe 100644 --- a/screens/ListScreen.tsx +++ b/screens/ListScreen.tsx @@ -77,7 +77,10 @@ export default function ListScreen({navigation}){ numColumns={2} data={filteredList} renderItem={({item}) => - navigation.navigate("ListFav")}> + // ("DetailCard", {card :item})}> + // + // + navigation.navigate("DetailCard", {card :item, other : 'anything'})}> }