Merge pull request 'Views_navigation' (#2) from Views_navigation into master
Reviewed-on: #2pull/7/head
After Width: | Height: | Size: 36 KiB |
@ -0,0 +1,15 @@
|
|||||||
|
> Why do I have a folder named ".expo" in my project?
|
||||||
|
|
||||||
|
The ".expo" folder is created when an Expo project is started using "expo start" command.
|
||||||
|
|
||||||
|
> What do the files contain?
|
||||||
|
|
||||||
|
- "devices.json": contains information about devices that have recently opened this project. This is used to populate the "Development sessions" list in your development builds.
|
||||||
|
- "packager-info.json": contains port numbers and process PIDs that are used to serve the application to the mobile device/simulator.
|
||||||
|
- "settings.json": contains the server configuration that is used to serve the application manifest.
|
||||||
|
|
||||||
|
> Should I commit the ".expo" folder?
|
||||||
|
|
||||||
|
No, you should not share the ".expo" folder. It does not contain any information that is relevant for other developers working on the project, it is specific to your machine.
|
||||||
|
|
||||||
|
Upon project creation, the ".expo" folder is already added to your ".gitignore" file.
|
@ -0,0 +1,8 @@
|
|||||||
|
{
|
||||||
|
"hostType": "lan",
|
||||||
|
"lanType": "ip",
|
||||||
|
"dev": true,
|
||||||
|
"minify": false,
|
||||||
|
"urlRandomness": null,
|
||||||
|
"https": false
|
||||||
|
}
|
Before Width: | Height: | Size: 22 KiB After Width: | Height: | Size: 52 KiB |
After Width: | Height: | Size: 834 KiB |
After Width: | Height: | Size: 579 KiB |
Before Width: | Height: | Size: 46 KiB After Width: | Height: | Size: 16 KiB |
@ -0,0 +1,59 @@
|
|||||||
|
import React, {Component} from 'react';
|
||||||
|
import { Animated, StyleSheet, Text, View, FlatList , Image} from 'react-native';
|
||||||
|
|
||||||
|
type CustomCardMusic = { //Props
|
||||||
|
image: any;
|
||||||
|
title: string;
|
||||||
|
description: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export default function CardMusic(CBP: CustomCardMusic) {
|
||||||
|
return (
|
||||||
|
<View style={styles.container}>
|
||||||
|
<View style={styles.imageContainer}>
|
||||||
|
<Image source={require('../assets/jul.png')} style={styles.image}/>
|
||||||
|
</View>
|
||||||
|
<View style={styles.textContainer}>
|
||||||
|
<Text style={styles.title}>{CBP.title}</Text>
|
||||||
|
<Text style={styles.description}>{CBP.description}</Text>
|
||||||
|
</View>
|
||||||
|
</View>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
const styles = StyleSheet.create({
|
||||||
|
container: {
|
||||||
|
flexDirection: 'row',
|
||||||
|
alignItems: 'center',
|
||||||
|
justifyContent: 'space-between',
|
||||||
|
margin: 20
|
||||||
|
},
|
||||||
|
imageContainer: {
|
||||||
|
width: 80,
|
||||||
|
height: 80,
|
||||||
|
alignItems: 'center',
|
||||||
|
justifyContent: 'center',
|
||||||
|
marginRight: 20
|
||||||
|
},
|
||||||
|
image: {
|
||||||
|
width: '100%',
|
||||||
|
height: '100%',
|
||||||
|
borderRadius: 10
|
||||||
|
|
||||||
|
},
|
||||||
|
textContainer: {
|
||||||
|
flex: 1,
|
||||||
|
alignItems: 'flex-start',
|
||||||
|
justifyContent: 'center',
|
||||||
|
},
|
||||||
|
title: {
|
||||||
|
fontWeight: 'bold',
|
||||||
|
color: 'white',
|
||||||
|
fontSize: 20,
|
||||||
|
marginBottom: 10
|
||||||
|
},
|
||||||
|
description: {
|
||||||
|
color: 'white',
|
||||||
|
fontSize: 16
|
||||||
|
}
|
||||||
|
});
|
@ -0,0 +1,41 @@
|
|||||||
|
import React, {Component} from 'react';
|
||||||
|
import { Animated, StyleSheet, Text, View, FlatList, ScrollView } from 'react-native';
|
||||||
|
import Card from '../components/Card';
|
||||||
|
import CardMusic from '../components/CardMusic';
|
||||||
|
|
||||||
|
|
||||||
|
export default function favoritePage() {
|
||||||
|
return (
|
||||||
|
<View>
|
||||||
|
<View style={styles.titleContainer}>
|
||||||
|
<Text style={styles.title}>Favoris</Text>
|
||||||
|
<Text style={styles.description}>Retrouvez ici vos musiques favorites</Text>
|
||||||
|
</View>
|
||||||
|
<ScrollView>
|
||||||
|
<CardMusic image="../assets/jul.png" title="La pharmacie" description="Jul"/>
|
||||||
|
<CardMusic image="../assets/pnl.png" title="deux frères" description="PNL"/>
|
||||||
|
<CardMusic image="../assets/jul.png" title="La pharmacie" description="Jul"/>
|
||||||
|
<CardMusic image="../assets/pnl.png" title="deux frères" description="PNL"/>
|
||||||
|
<CardMusic image="../assets/jul.png" title="La pharmacie" description="Jul"/>
|
||||||
|
<CardMusic image="../assets/pnl.png" title="deux frères" description="PNL"/>
|
||||||
|
</ScrollView>
|
||||||
|
</View>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
const styles = StyleSheet.create({
|
||||||
|
titleContainer: {
|
||||||
|
marginLeft: 20,
|
||||||
|
marginVertical: 50,
|
||||||
|
},
|
||||||
|
title: {
|
||||||
|
fontSize: 24,
|
||||||
|
fontWeight: 'bold',
|
||||||
|
color: 'white',
|
||||||
|
},
|
||||||
|
description: {
|
||||||
|
marginTop: 10,
|
||||||
|
fontSize: 18,
|
||||||
|
color: '#787878',
|
||||||
|
},
|
||||||
|
});
|