Skip to content

Commit bef244e

Browse files
PepperYanPepperYan
authored
Merge pull request #6 from PureRunner/master
update/rn
2 parents 7548aa5 + 73a8cbc commit bef244e

File tree

26 files changed

+401
-448
lines changed

26 files changed

+401
-448
lines changed

‎README.md‎

Lines changed: 18 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -64,13 +64,17 @@ restackx-core提供了路由的入口，导入指定路由可方便我们管理,
6464
[如何搭建react-native工程](https://facebook.github.io/react-native/docs/getting-started.html)
6565

6666
#### store
67-
import HomePageModel from './models/HomePage.model';
68-
import MenuBarModel from './models/MenuBar.model';
69-
//这里添加所要导入的xxx.model.js
70-
const store = {
71-
"HomePage" : new HomePageModel(),
72-
"MenuBarModel" : new MenuBarModel(),
67+
import Launch from './models/launch.model';
68+
const models = {
69+
"launch" : new Launch(),
70+
7371
}
72+
export default models;
73+
74+
调用方法：this.context.store.launch获取Launch 对象。
75+
76+
77+
7478

7579
#### router
7680
在restackx-core/react-native中使用的是NativeRouter，它这是为native提供了相应的路由。
@@ -79,22 +83,15 @@ restackx-core提供了路由的入口，导入指定路由可方便我们管理,
7983
#### routes
8084
在native app中route并不存在，而是通过导航来管理界面。想要是native实现route的功能可使用react-router-native，routes的具体管理：
8185

82-
var route = [
83-
{
84-
"title":"Home",
85-
"path":"/",
86-
},{
87-
"title":"Message",
88-
"path":"/Message",
89-
}];
9086
const Routes = (
91-
<View style={{flex:1}}>
92-
<NavBar />
93-
<Route exact path={route[0].path} component={HomePage}/>
94-
<Route path={route[1].path} component={Message}/>
95-
<MenuBar routes={route} initRoute={route[0]}/>
96-
</View>
97-
);
87+
<View style={{flex:1}}>
88+
<Switch>
89+
<Route exact path="/" component={LaunchPage}/>
90+
<Route path="/app" component={App}/>
91+
<Route path="/main" component={Main}/>
92+
</Switch>
93+
</View>
94+
);
9895

9996

10097
#### 注意:

‎examples/rn-demo/ios/app.xcodeproj/project.xcworkspace/xcuserdata/shuaipan.xcuserdatad/UserInterfaceState.xcuserstate‎

2.6 KB
Binary file not shown.

‎examples/rn-demo/ios/app/Images.xcassets/AppIcon.appiconset/Contents.json‎

Lines changed: 14 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,15 @@
11
{
22
"images" : [
3+
{
4+
"idiom" : "iphone",
5+
"size" : "20x20",
6+
"scale" : "2x"
7+
},
8+
{
9+
"idiom" : "iphone",
10+
"size" : "20x20",
11+
"scale" : "3x"
12+
},
313
{
414
"idiom" : "iphone",
515
"size" : "29x29",
@@ -21,13 +31,15 @@
2131
"scale" : "3x"
2232
},
2333
{
24-
"idiom" : "iphone",
2534
"size" : "60x60",
35+
"idiom" : "iphone",
36+
"filename" : "logo@2x.png",
2637
"scale" : "2x"
2738
},
2839
{
29-
"idiom" : "iphone",
3040
"size" : "60x60",
41+
"idiom" : "iphone",
42+
"filename" : "logo@3x.png",
3143
"scale" : "3x"
3244
}
3345
],

‎examples/rn-demo/ios/app/Images.xcassets/AppIcon.appiconset/logo@2x.png‎

8.28 KB
Loading

‎examples/rn-demo/ios/app/Images.xcassets/AppIcon.appiconset/logo@3x.png‎

7.19 KB
Loading

‎examples/rn-demo/ios/app/Info.plist‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<key>CFBundleDevelopmentRegion</key>
66
<string>en</string>
77
<key>CFBundleDisplayName</key>
8-
<string>app</string>
8+
<string>restackx-core</string>
99
<key>CFBundleExecutable</key>
1010
<string>$(EXECUTABLE_NAME)</string>
1111
<key>CFBundleIdentifier</key>

‎examples/rn-demo/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@
1212
"mobx": "^3.1.9",
1313
"mobx-react": "^4.1.8",
1414
"react-native-router-flux": "^4.0.0-beta.12",
15-
"restackx-core":"0.1.1",
15+
"restackx-core":"0.2.0",
1616
"react-router-native": "^4.1.1"
1717
},
1818
"devDependencies": {

‎examples/rn-demo/src/js/class/App.js‎

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
2+
3+
import React, {PropTypes} from 'react';
4+
import {observable, computed, reaction} from 'mobx'
5+
import {observer} from "mobx-react";
6+
import {BaseComponent} from "restackx-core/lib/native";
7+
8+
import {Link} from 'react-router-native';
9+
import {
10+
StyleSheet,
11+
Text,
12+
View,
13+
TouchableOpacity
14+
} from 'react-native';
15+
import NavBar from "../component/NavBar";
16+
17+
@observer
18+
class App extends BaseComponent {
19+
@observable id;
20+
21+
componentWillMount() {
22+
23+
}
24+
componentDidMount() {
25+
26+
}
27+
render() {
28+
return (
29+
<View style={{flex:1}}>
30+
<NavBar title = "RESTACKX"/>
31+
<View style={styles.container}>
32+
<Link replace={true} component={TouchableOpacity} to={'/'}>
33+
<Text style={styles.instructions} >RESTACKX CORE FOR {'\n'} REACTNATIVE</Text>
34+
35+
</Link>
36+
</View>
37+
</View>
38+
39+
);
40+
}
41+
}
42+
43+
const styles = StyleSheet.create({
44+
container: {
45+
flex: 1,
46+
justifyContent: 'center',
47+
alignItems: 'center',
48+
},
49+
instructions: {
50+
color: '#7199ff',
51+
textAlign: 'center',
52+
textDecorationLine:'underline'
53+
54+
},
55+
});
56+
57+
App.prototypes = {
58+
};
59+
export default App

‎examples/rn-demo/src/js/class/LaunchPage.js‎

Lines changed: 96 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,96 @@
1+
/**
2+
* Sample React Native App
3+
* https://github.com/facebook/react-native
4+
* @flow
5+
*/
6+
7+
import React, {PropTypes,Component} from 'react';
8+
import {observable, computed, reaction} from 'mobx'
9+
import {observer} from "mobx-react";
10+
import {BaseComponent} from "restackx-core/lib/native";
11+
12+
import {
13+
StyleSheet,
14+
Text,
15+
View,
16+
Image,
17+
TouchableOpacity
18+
} from 'react-native';
19+
import { Link} from 'react-router-native';
20+
21+
22+
@observer
23+
class LaunchPage extends BaseComponent {
24+
25+
componentWillMount() {
26+
27+
}
28+
componentDidMount() {
29+
// this.context.store.launch.launchActionHandle();
30+
// console.log(this.context.store.launch.user);
31+
}
32+
render() {
33+
34+
return (
35+
<View style={styles.container}>
36+
<View style={styles.content}>
37+
<Image style={styles.logo} source={require('../../resource/restack_logo.png')}/>
38+
<Text style={styles.instructions}>Welcome to restack-core {'\n'} for react-native</Text>
39+
<Link to={'/main'} replace={true} component={TouchableOpacity}>
40+
<Text style={styles.simpleLink}>link the simple</Text>
41+
</Link>
42+
<View style={{marginTop:35}}>
43+
<TouchableOpacity onPress={()=>{this.props.history.push('/app')}}>
44+
<Text style={styles.open} >Open Your's App</Text>
45+
</TouchableOpacity>
46+
</View>
47+
48+
49+
</View>
50+
51+
</View>
52+
);s
53+
}
54+
}
55+
56+
const styles = StyleSheet.create({
57+
container: {
58+
flex: 1,
59+
// justifyContent: 'center',
60+
alignItems: 'center',
61+
backgroundColor: '#ffffff',
62+
},
63+
content:{
64+
alignItems: 'center',
65+
backgroundColor: '#ffffff',
66+
marginTop:150
67+
68+
},
69+
logo: {
70+
// width:80,
71+
height:60,
72+
resizeMode : Image.resizeMode.center
73+
},
74+
instructions: {
75+
color: '#2c2c2c',
76+
textAlign: 'center',
77+
marginTop:35
78+
79+
},
80+
simpleLink:{
81+
color: '#1781ff',
82+
textAlign: 'center',
83+
marginTop:15,
84+
textDecorationLine:'underline'
85+
},
86+
open:{
87+
color: '#1781ff',
88+
textAlign: 'center',
89+
}
90+
});
91+
92+
LaunchPage.prototypes = {
93+
id: PropTypes.string
94+
}
95+
export default LaunchPage;
96+

‎examples/rn-demo/src/js/class/Main.js‎

Lines changed: 93 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,93 @@
1+
2+
import React, {PropTypes} from 'react';
3+
import {observable, computed, reaction} from 'mobx'
4+
import {observer} from "mobx-react";
5+
import {BaseComponent} from "restackx-core/lib/BaseComponent";
6+
import {Link,NativeRouter,Route} from 'react-router-native';
7+
import TopBar from '../component/TopBar'
8+
import {
9+
StyleSheet,
10+
Text,
11+
View,
12+
TouchableOpacity
13+
} from 'react-native';
14+
15+
const routes = [
16+
{
17+
"path":"/",
18+
"title":"first"
19+
},{
20+
"path":"/second",
21+
"title":"second"
22+
},{
23+
"path":"/third",
24+
"title":"third"
25+
}
26+
];
27+
@observer
28+
class Main extends BaseComponent {
29+
@observable id;
30+
31+
render() {
32+
return (
33+
<View style={styles.container}>
34+
<NativeRouter>
35+
<View style={{height:250}}>
36+
<TopBar routes={routes}/>
37+
<Route exact path={routes[0].path} component={First}/>
38+
<Route path={routes[1].path} component={Second}/>
39+
<Route path={routes[2].path} component={Third}/>
40+
</View>
41+
</NativeRouter>
42+
43+
<Link replace={true} component={TouchableOpacity} to={'/'}>
44+
<Text style={styles.instructions} >back</Text>
45+
</Link>
46+
</View>
47+
48+
49+
);
50+
}
51+
}
52+
53+
const styles = StyleSheet.create({
54+
container: {
55+
flex: 1,
56+
// justifyContent: 'center',
57+
// alignItems: 'center',
58+
// backgroundColor: '#ffb283',
59+
},
60+
instructions: {
61+
color: '#376aff',
62+
fontSize: 16,
63+
textAlign: 'center',
64+
65+
},
66+
text: {
67+
margin:80,
68+
textAlign:"center",
69+
justifyContent: 'space-around',
70+
color: '#3768ff',
71+
fontSize: 20,
72+
fontWeight:("bold"),
73+
fontStyle:"italic",
74+
fontFamily:'Georgia'
75+
76+
}
77+
});
78+
79+
Main.prototypes = {
80+
}
81+
82+
83+
const First = ()=> (
84+
<Text style={styles.text}>first</Text>
85+
)
86+
const Second = ()=> (
87+
<Text style={styles.text}>Second</Text>
88+
)
89+
const Third = ()=>(
90+
<Text style={styles.text}>third</Text>
91+
)
92+
93+
export default Main;

0 commit comments

Comments
 (0)