💄 Update UI code, remove somes un-used import

part3
Antoine PEREDERII 1 year ago
parent 6195b1a95e
commit 37f093fc75

@ -1,7 +1,6 @@
import { SafeAreaView } from 'react-native'
import {StyleSheet, Text, View, FlatList, Image} from 'react-native';
import {StyleSheet} from 'react-native';
import NavigationBar from "./navigation/NavigationBar";
import Catalogue from "./screens/Catalogue";
import {indigoColor} from "./assets/Theme";
export default function App() {

@ -1,4 +1,4 @@
import {StyleSheet, Text, View, FlatList, Image} from 'react-native';
import {StyleSheet, Text, View} from 'react-native';
import {SampleJoke} from "../model/SampleJoke";
import {CustomJoke} from "../model/CustomJoke";
import {greyColor} from "../assets/Theme";

@ -7,7 +7,7 @@ type JokeListItemProps = {
jokes: (CustomJoke | SampleJoke)[];
};
export default function CategList(props: JokeListItemProps) {
export default function Categs(props: JokeListItemProps) {
return (
<FlatList showsHorizontalScrollIndicator={false} horizontal={true}
data={props.jokes}

@ -2,6 +2,7 @@ import {StyleSheet, Text, View, Image} from 'react-native';
import {SampleJoke} from "../model/SampleJoke";
import {CustomJoke} from "../model/CustomJoke";
import {darksalmonColor, whiteColor, greyColor, indigoColor} from "../assets/Theme";
import Categ from "./Categ";
type JokeListItemProps = {
joke: (CustomJoke | SampleJoke);
@ -15,9 +16,7 @@ export default function JokeItem(prop: JokeListItemProps) {
<View style={styles.columnContainer}>
<Text style={styles.text}>Résumé de la blague</Text>
<Text style={styles.text}>{prop.joke.description()}</Text>
<View style={styles.bottomContainer}>
<Text style={{color:'white'}}>{prop.joke.type}</Text>
</View>
<Categ joke={prop.joke}/>
</View>
</View>
);

@ -7,7 +7,7 @@ type JokeListItemProps = {
jokes: (CustomJoke | SampleJoke)[];
};
export default function JokeListItem(props: JokeListItemProps) {
export default function JokeItems(props: JokeListItemProps) {
return (
<FlatList
data={props.jokes}

@ -7,7 +7,7 @@ type JokeListItemProps = {
jokes: (CustomJoke | SampleJoke)[];
};
export default function JokeListHomeSquare(props: JokeListItemProps) {
export default function JokesHomeSquare(props: JokeListItemProps) {
return (
<FlatList showsHorizontalScrollIndicator={false} horizontal={true}
data={props.jokes}

@ -96,6 +96,9 @@ export abstract class Joke {
* @return {string} Un résumé de la blague.
*/
public summary(): string {
if(this.punchline.length <= 25){
return this.punchline;
}
return this.punchline.substring(0, 24) + "...";
}

@ -1,6 +1,6 @@
import { NavigationContainer } from '@react-navigation/native';
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
import {Image, SafeAreaView, View} from 'react-native';
import {Image, View} from 'react-native';
import HomeScreen from "../screens/HomeScreen";
import Catalogue from "../screens/Catalogue";
@ -8,7 +8,7 @@ import Favorites from "../screens/Favorites";
import Add from "../screens/AddScreen";
import Settings from "../screens/Settings";
import {darksalmonColor, greyColor, indigoColor, purpleColor} from "../assets/Theme";
import {darksalmonColor, greyColor, indigoColor} from "../assets/Theme";
export default function NavigationBar() {

@ -1,20 +1,20 @@
import {createStackNavigator} from "@react-navigation/stack";
import Accueil from "../screens/HomeScreen";
import Catalogue from "../screens/Catalogue";
import Add from "../screens/AddScreen";
import Favorites from "../screens/Favorites";
import Settings from "../screens/Settings";
export default function StackNavigation() {
const Stack = createStackNavigator();
return (
<Stack.Navigator initialRouteName="Home">
<Stack.Screen name="Accueil" component={Accueil}/>
<Stack.Screen name="Catalogue" component={Catalogue}/>
<Stack.Screen name="Ajouter" component={Add}/>
<Stack.Screen name="Favoris" component={Favorites}/>
<Stack.Screen name="Paramètres" component={Settings}/>
</Stack.Navigator>
)
}
// import {createStackNavigator} from "@react-navigation/stack";
// import Accueil from "../screens/HomeScreen";
// import Catalogue from "../screens/Catalogue";
// import Add from "../screens/AddScreen";
// import Favorites from "../screens/Favorites";
// import Settings from "../screens/Settings";
//
//
// export default function StackNavigation() {
// const Stack = createStackNavigator();
// return (
// <Stack.Navigator initialRouteName="Home">
// <Stack.Screen name="Accueil" component={Accueil}/>
// <Stack.Screen name="Catalogue" component={Catalogue}/>
// <Stack.Screen name="Ajouter" component={Add}/>
// <Stack.Screen name="Favoris" component={Favorites}/>
// <Stack.Screen name="Paramètres" component={Settings}/>
// </Stack.Navigator>
// )
// }

@ -1,41 +1,11 @@
import { StatusBar } from 'expo-status-bar';
import { StyleSheet, Text, View } from 'react-native';
import { customJokeStub } from '../data/stub/CustomJokeStub';
import { sampleJokeStub } from '../data/stub/SampleJokeStub';
import { SafeAreaView } from 'react-native'
import JokeListItem from "../components/JokeListItem";
import JokeItems from "../components/JokeItems";
import '../types/extension';
import {darksalmonColor, indigoColor, purpleColor} from "../assets/Theme";
export default function Catalogue() {
const allJokes = [...customJokeStub, ...sampleJokeStub];
return (
<>
<SafeAreaView style={styles.topSafeArea}/>
<SafeAreaView style={styles.container}>
<StatusBar style="light" />
<JokeListItem jokes={allJokes}/>
</SafeAreaView>
</>
<JokeItems jokes={allJokes}/>
)
};
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: purpleColor,
},
centered: {
color:darksalmonColor,
fontSize:24,
textAlign: "center",
paddingBottom:20,
},
title: {
backgroundColor: indigoColor
},
topSafeArea: {
flex: 0,
backgroundColor: indigoColor
}
});

@ -1,39 +1,11 @@
import { StatusBar } from 'expo-status-bar';
import { StyleSheet, Text, View } from 'react-native';
import { customJokeStub } from '../data/stub/CustomJokeStub';
import { sampleJokeStub } from '../data/stub/SampleJokeStub';
import { SafeAreaView } from 'react-native'
import JokeListItem from "../components/JokeListItem";
import JokeItems from "../components/JokeItems";
import '../types/extension';
import {darksalmonColor, indigoColor, purpleColor} from "../assets/Theme";
export default function Catalogue() {
const allJokes = [...customJokeStub, ...sampleJokeStub];
return (
<>
<SafeAreaView style={styles.container}>
<JokeListItem jokes={allJokes}/>
</SafeAreaView>
</>
<JokeItems jokes={allJokes}/>
)
};
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: purpleColor,
},
centered: {
color:darksalmonColor,
fontSize:24,
textAlign: "center",
paddingBottom:20,
},
title: {
backgroundColor: indigoColor
},
topSafeArea: {
flex: 0,
backgroundColor: indigoColor
}
});

@ -1,41 +1,11 @@
import { StatusBar } from 'expo-status-bar';
import { StyleSheet, Text, View } from 'react-native';
import { customJokeStub } from '../data/stub/CustomJokeStub';
import { sampleJokeStub } from '../data/stub/SampleJokeStub';
import { SafeAreaView } from 'react-native'
import JokeListItem from "../components/JokeListItem";
import JokeItems from "../components/JokeItems";
import '../types/extension';
import {darksalmonColor, indigoColor, purpleColor} from "../assets/Theme";
export default function Catalogue() {
const allJokes = [...customJokeStub, ...sampleJokeStub];
return (
<>
<SafeAreaView style={styles.topSafeArea}/>
<SafeAreaView style={styles.container}>
<StatusBar style="light" />
<JokeListItem jokes={allJokes}/>
</SafeAreaView>
</>
<JokeItems jokes={allJokes}/>
)
};
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: purpleColor,
},
centered: {
color:darksalmonColor,
fontSize:24,
textAlign: "center",
paddingBottom:20,
},
title: {
backgroundColor: indigoColor
},
topSafeArea: {
flex: 0,
backgroundColor: indigoColor
}
});

@ -1,15 +1,10 @@
import { StatusBar } from 'expo-status-bar';
import {FlatList, Image, StyleSheet, Text, View} from 'react-native';
import {Image, StyleSheet, Text, View} from 'react-native';
import { customJokeStub } from '../data/stub/CustomJokeStub';
import { sampleJokeStub } from '../data/stub/SampleJokeStub';
import { SafeAreaView } from 'react-native'
import JokeListItem from "../components/JokeListItem";
import '../types/extension';
import {darksalmonColor, indigoColor, purpleColor, whiteColor} from "../assets/Theme";
import JokeListHomeSquare from "../components/JokeListHomeSquare";
import CategList from "../components/CategList";
import {CustomJoke} from "../model/CustomJoke";
import {SampleJoke} from "../model/SampleJoke";
import {darksalmonColor, purpleColor, whiteColor} from "../assets/Theme";
import JokesHomeSquare from "../components/JokesHomeSquare";
import Categs from "../components/Categs";
export default function Catalogue() {
const allJokes = [...customJokeStub, ...sampleJokeStub];
@ -22,7 +17,7 @@ export default function Catalogue() {
</View>
<View style={styles.Jokes}>
<Text style={styles.textLastJokes}>Dernières blagues</Text>
<JokeListHomeSquare jokes={allJokes} />
<JokesHomeSquare jokes={allJokes} />
</View>
<View style={styles.bestCateg}>
<View style={styles.horizBestCateg}>
@ -30,7 +25,7 @@ export default function Catalogue() {
<Image source={require("../assets/fire_icon.png")}/>
</View>
<View style={styles.horizChip}>
<CategList jokes={allJokes}/>
<Categs jokes={allJokes}/>
</View>
</View>
</View>

@ -1,41 +1,11 @@
import { StatusBar } from 'expo-status-bar';
import { StyleSheet, Text, View } from 'react-native';
import { customJokeStub } from '../data/stub/CustomJokeStub';
import { sampleJokeStub } from '../data/stub/SampleJokeStub';
import { SafeAreaView } from 'react-native'
import JokeListItem from "../components/JokeListItem";
import JokeItems from "../components/JokeItems";
import '../types/extension';
import {darksalmonColor, indigoColor, purpleColor} from "../assets/Theme";
export default function Catalogue() {
const allJokes = [...customJokeStub, ...sampleJokeStub];
return (
<>
<SafeAreaView style={styles.topSafeArea}/>
<SafeAreaView style={styles.container}>
<StatusBar style="light" />
<JokeListItem jokes={allJokes}/>
</SafeAreaView>
</>
<JokeItems jokes={allJokes}/>
)
};
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: purpleColor,
},
centered: {
color:darksalmonColor,
fontSize:24,
textAlign: "center",
paddingBottom:20,
},
title: {
backgroundColor: indigoColor
},
topSafeArea: {
flex: 0,
backgroundColor: indigoColor
}
});
Loading…
Cancel
Save