Skip to content

Commit a60dc49

Browse files
HardeepcoderHardeepcoder
committed
code updated
1 parent 27a9383 commit a60dc49

File tree

11 files changed

+310
-95
lines changed

11 files changed

+310
-95
lines changed

‎.DS_Store

8 KB
Binary file not shown.

‎nativeShop/index.android.js

100644100755
File mode changed.

‎nativeShop/index.ios.js

100644100755
+2-50
Original file line numberDiff line numberDiff line change
@@ -1,53 +1,5 @@
1-
/**
2-
* Sample React Native App
3-
* https://github.com/facebook/react-native
4-
* @flow
5-
*/
6-
71
import React, { Component } from 'react';
8-
import {
9-
AppRegistry,
10-
StyleSheet,
11-
Text,
12-
View
13-
} from 'react-native';
14-
15-
export default class nativeShop extends Component {
16-
render() {
17-
return (
18-
<View style={styles.container}>
19-
<Text style={styles.welcome}>
20-
Welcome to React Native!
21-
</Text>
22-
<Text style={styles.instructions}>
23-
To get started, edit index.ios.js
24-
</Text>
25-
<Text style={styles.instructions}>
26-
Press Cmd+R to reload,{'\n'}
27-
Cmd+D or shake for dev menu
28-
</Text>
29-
</View>
30-
);
31-
}
32-
}
33-
34-
const styles = StyleSheet.create({
35-
container: {
36-
flex: 1,
37-
justifyContent: 'center',
38-
alignItems: 'center',
39-
backgroundColor: '#F5FCFF',
40-
},
41-
welcome: {
42-
fontSize: 20,
43-
textAlign: 'center',
44-
margin: 10,
45-
},
46-
instructions: {
47-
textAlign: 'center',
48-
color: '#333333',
49-
marginBottom: 5,
50-
},
51-
});
2+
import { AppRegistry,View,Text,StyleSheet } from 'react-native';
523

4+
import nativeShop from './pages/app';
535
AppRegistry.registerComponent('nativeShop', () => nativeShop);

‎nativeShop/pages/app.js

100644100755
+8-3
Original file line numberDiff line numberDiff line change
@@ -5,17 +5,22 @@ import { StackNavigator,DrawerNavigator } from 'react-navigation';
55
import HomeScreen from './home';
66
import Products from './products2';
77
import Menu from './menu';
8+
import Details from './details';
9+
import Swipe from './swipe';
810

911
const myDrawer = DrawerNavigator({
1012
Home: { screen: HomeScreen },
11-
Products: { screen: Products },
13+
Products: { screen: Products },
14+
Details: {screen: Details},
15+
Swipe: {screen: Swipe}
16+
1217
},
1318
{
1419
contentComponent: props => <Menu {...props} />
1520
});
1621

1722
const nativeShop = StackNavigator({
1823
Home: { screen: myDrawer },
19-
24+
2025
});
21-
export default nativeShop;
26+
export default nativeShop;

‎nativeShop/pages/design.js

+45
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
import React, { Component } from 'react';
2+
import { AppRegistry,View,Text,StyleSheet
3+
,Button,TouchableOpacity,StatusBar,Image,TextInput } from 'react-native';
4+
5+
export default class design extends Component{
6+
static navigationOptions= ({navigation}) =>({
7+
title: 'New Design',
8+
});
9+
10+
render(){
11+
const { navigate } = this.props.navigation;
12+
return(
13+
<View style={{backgroundColor:'#ededed', alignItems:'center', height:'100%'}}>
14+
<View style={{padding:20, backgroundColor:'white',alignItems:'center'}}>
15+
<Text style={styles.pageName}>Welcome </Text>
16+
<Image source={{uri:'https://yt3.ggpht.com/-dh5qoeGs5h0/AAAAAAAAAAI/AAAAAAAAAAA/aeZUMryTX1U/s288-c-k-no-mo-rj-c0xffffff/photo.jpg'}}
17+
style={{width:120,height:120}}
18+
/>
19+
<Text>EasyCode Sardar</Text>
20+
21+
<View style={{marginTop:20, height:'100%', width:250}}>
22+
23+
<TextInput style={{height:40,borderColor:'gray',borderWidth:1,margin:10}}/>
24+
<Button title="Signup" />
25+
26+
<Text style={{fontSize:10, margin:10}}>some words about your signup policy or something else you can change as you want </Text>
27+
28+
</View>
29+
</View>
30+
31+
32+
</View>
33+
);
34+
}
35+
}
36+
const styles = StyleSheet.create({
37+
pageName:{
38+
margin:10,fontWeight:'bold',
39+
color:'magenta', textAlign:'center',
40+
fontSize:28
41+
},
42+
});
43+
44+
45+
AppRegistry.registerComponent('design', () => design);

‎nativeShop/pages/details.js

+92
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,92 @@
1+
import React, { Component } from 'react';
2+
import { AppRegistry,View,Text,
3+
StyleSheet,FlatList,Image,StatusBar,
4+
TouchableOpacity,Button, RefreshControl } from 'react-native';
5+
6+
export default class details extends Component{
7+
static navigationOptions= ({navigation}) =>({
8+
title: 'Products',
9+
headerRight:<TouchableOpacity onPress={() => navigation.navigate("Home")}
10+
style={{backgroundColor:'orange', margin:10,padding:10}}>
11+
<Text style={{color:'#fff'}}>Home</Text></TouchableOpacity>
12+
});
13+
14+
15+
state={
16+
data:[],
17+
refreshing: false
18+
19+
};
20+
fetchData = async() =>{
21+
const { params } = this.props.navigation.state;
22+
const response = await fetch('https://hardeepwork.000webhostapp.com/laravel/LaraShop55/api/products/' + params.id);
23+
const products = await response.json(); // products have array data
24+
this.setState({data: products}); // filled data with dynamic array
25+
};
26+
componentDidMount(){
27+
this.fetchData();
28+
};
29+
_onRefresh(){
30+
this.setState({refreshing: true});
31+
this.fetchData().then(() =>{
32+
this.setState({refreshing: false})
33+
});
34+
}
35+
36+
render(){
37+
38+
const { params } = this.props.navigation.state;
39+
const {navigate} = this.props.navigation;
40+
41+
return(
42+
<View style={styles.container}>
43+
44+
<FlatList
45+
data={this.state.data}
46+
keyExtractor={(x,i) => i}
47+
renderItem={({item})=>
48+
<View style={styles.productBox}>
49+
<Image style={{height:250, width:'100%'}} source={{uri:
50+
'https://hardeepwork.000webhostapp.com/laravel/LaraShop55//public/img/' +item.pro_img}} />
51+
<Text style={styles.price}>${item.pro_price}</Text>
52+
<Text style={styles.proName}>{item.pro_name}</Text>
53+
<Text>{item.pro_info}</Text>
54+
<Text> Spl Price {item.spl_price} </Text>
55+
</View>
56+
}
57+
refreshControl={
58+
<RefreshControl
59+
refreshing = {this.state.refreshing}
60+
onRefresh={this._onRefresh.bind(this)}
61+
/>
62+
}
63+
/>
64+
</View>
65+
);
66+
}
67+
68+
69+
70+
}
71+
const styles = StyleSheet.create({
72+
container:{
73+
flex: 1,
74+
flexDirection: 'column',
75+
justifyContent: 'center',
76+
77+
},
78+
pageName:{
79+
margin:10,fontWeight:'bold',
80+
color:'#000', textAlign:'center'
81+
},
82+
productBox:{
83+
padding:5,margin:10,borderColor:'orange',borderBottomWidth:1
84+
},
85+
price:{
86+
padding:5, color:'orange',fontWeight:'bold',textAlign:'center'
87+
},
88+
proName:{
89+
padding:5,color:'blue',textAlign:'center'
90+
}
91+
})
92+
AppRegistry.registerComponent('details', () => details);

‎nativeShop/pages/home.js

100644100755
+6
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,8 @@ static navigationOptions= ({navigation}) =>({
3333
onPress={() => navigate('Products',{cat:'Books',id:'4'})}>
3434
<Text style={styles.btnText}> Books > </Text>
3535
</TouchableOpacity>
36+
37+
3638
</View>
3739
);
3840
}
@@ -46,6 +48,10 @@ const styles = StyleSheet.create({
4648
backgroundColor:'orange',
4749
padding:10,margin:10,width:'95%'
4850
},
51+
cat2:{
52+
backgroundColor:'blue',
53+
padding:10,margin:10,width:'95%'
54+
},
4955
pageName:{
5056
margin:10,fontWeight:'bold',
5157
color:'#000', textAlign:'center'

‎nativeShop/pages/menu.js

100644100755
+67-13
Original file line numberDiff line numberDiff line change
@@ -4,25 +4,60 @@ import { AppRegistry,View,Text,StyleSheet
44

55
export default class menu extends Component{
66
static navigationOptions= ({navigation}) =>({
7-
title: 'Side Menu',
8-
});
9-
7+
title: 'Side Menu',
8+
});
9+
10+
static Cards = [
11+
12+
{
13+
imageUrl: 'https://images.unsplash.com/photo-1501850305723-0bf18f354fea?w=500',
14+
title: 'React Native Developer',
15+
subtitle: 'San Francisco',
16+
buttonText: 'Learn More'
17+
},
18+
19+
{
20+
imageUrl: 'https://images.unsplash.com/photo-1501850305723-0bf18f354fea?w=500',
21+
title: 'React Native Developer',
22+
subtitle: 'San Francisco',
23+
buttonText: 'Learn More'
24+
},
25+
26+
];
27+
1028
render(){
1129
const { navigate } = this.props.navigation;
1230
return(
13-
<View >
14-
31+
<View >
32+
1533
<Text style={styles.pageName}>Menu </Text>
34+
35+
<TouchableOpacity
36+
style={styles.cat}
37+
onPress={() => navigate('Products',{cat:'Electronics',id:'1'})}>
38+
<Text style={styles.btnText}> Electronics > </Text>
39+
</TouchableOpacity>
40+
<TouchableOpacity
41+
style={styles.cat}
42+
onPress={() => navigate('Products',{cat:'Automobiles',id:'2'})}>
43+
<Text style={styles.btnText}> Automobiles > </Text>
44+
</TouchableOpacity>
45+
<TouchableOpacity
46+
style={styles.cat}
47+
onPress={() => navigate('Products',{cat:'Movies',id:'3'})}>
48+
<Text style={styles.btnText}> Movies > </Text>
49+
</TouchableOpacity>
50+
<TouchableOpacity
51+
style={styles.cat}
52+
onPress={() => navigate('Products',{cat:'Books',id:'4'})}>
53+
<Text style={styles.btnText}> Books > </Text>
54+
</TouchableOpacity>
55+
56+
1657
<Button
17-
onPress={() => navigate('Products',{cat:'Electronics',id:'1'})}
18-
color="orange"
19-
title="Electronics"
20-
/>
21-
22-
<Button
23-
onPress={() => navigate('Products',{cat:'Books',id:'4'})}
58+
onPress={() => navigate('Swipe')}
2459
color="red"
25-
title="Books"
60+
title="Swipe"
2661
/>
2762
</View>
2863
);
@@ -33,6 +68,25 @@ const styles = StyleSheet.create({
3368
margin:10,fontWeight:'bold',
3469
color:'#000', textAlign:'center'
3570
},
71+
cat:{
72+
backgroundColor:'orange',
73+
padding:10,margin:10,width:'95%'
74+
},
75+
cat2:{
76+
backgroundColor:'blue',
77+
padding:10,margin:10,width:'95%'
78+
},
79+
pageName:{
80+
margin:10,fontWeight:'bold',
81+
color:'#000', textAlign:'center'
82+
},
83+
btnText:{
84+
color:'#fff',fontWeight:'bold'
85+
},
86+
icon: {
87+
width: 24,
88+
height: 24,
89+
},
3690
});
3791

3892

0 commit comments

Comments
 (0)