Authored by 王钱钧

Merge branch 'develop' of http://git.yoho.cn/mobile/YH_RNComponent into develop

Conflicts:
	js/community/Community.js
@@ -25,6 +25,8 @@ import HomeContainer from './containers/HomeContainer'; @@ -25,6 +25,8 @@ import HomeContainer from './containers/HomeContainer';
25 25
26 import UserContainer from './containers/UserContainer'; 26 import UserContainer from './containers/UserContainer';
27 27
  28 +import SubjectPostContainer from './containers/SubjectPostContainer'
  29 +
28 import NavBar from './components/NavBar'; 30 import NavBar from './components/NavBar';
29 31
30 let VERSION = '0.0.1'; 32 let VERSION = '0.0.1';
@@ -118,6 +120,7 @@ export default function community(platform) { @@ -118,6 +120,7 @@ export default function community(platform) {
118 }} 120 }}
119 /> 121 />
120 122
  123 +
121 <Scene 124 <Scene
122 key="User" 125 key="User"
123 title="用户中心" 126 title="用户中心"
@@ -131,6 +134,18 @@ export default function community(platform) { @@ -131,6 +134,18 @@ export default function community(platform) {
131 }} 134 }}
132 /> 135 />
133 136
  137 +
  138 + <Scene
  139 + key="SubjectPost"
  140 + title="主题帖"
  141 + hideNavBar={false}
  142 + component={SubjectPostContainer}
  143 + initial={false}
  144 + navBar={NavBar}
  145 + titleStyle={styles.navTitle}
  146 + type="push"
  147 + />
  148 +
134 </Scene> 149 </Scene>
135 </NewRouter> 150 </NewRouter>
136 </Provider> 151 </Provider>
@@ -45,7 +45,7 @@ export default class Home extends React.Component { @@ -45,7 +45,7 @@ export default class Home extends React.Component {
45 return ( 45 return (
46 <View style={{flexDirection: 'row', justifyContent: 'center'}}> 46 <View style={{flexDirection: 'row', justifyContent: 'center'}}>
47 47
48 - <Text>这是社区首页</Text> 48 + <Text onPress={this.props.testPress}>这是社区首页</Text>
49 49
50 </View> 50 </View>
51 ); 51 );
  1 +'use strict'
  2 +/**
  3 + * 发帖页
  4 + */
  5 +import React, {Component} from 'react';
  6 +import {
  7 + StyleSheet,
  8 +} from 'react-native'
  1 +import React, {Component} from 'react';
  2 +import {
  3 + View,
  4 + Text,
  5 + Image,
  6 + StyleSheet,
  7 +} from 'react-native'
  8 +
  9 +export default class SPHeaderCell extends Component {
  10 + constructor(props) {
  11 + super(props);
  12 + }
  13 +
  14 + renderName() {
  15 + if (this.props.data.owner) {
  16 + return(
  17 + <Text style={styles.nameLabel}>
  18 + {this.props.data.name + ' | '}
  19 + <Text style={styles.ownerColor}>楼主</Text>
  20 + </Text>
  21 + );
  22 + } else {
  23 + return(
  24 + <Text style={styles.nameLabel}>this.props.data.name</Text>
  25 + );
  26 + }
  27 + }
  28 +
  29 + renderDelete() {
  30 + if (this.props.data.owner) {
  31 + return(
  32 + <Text style={[styles.nameLabel, styles.ownerColor, styles.deletePosition]}>
  33 + 删除本帖
  34 + </Text>
  35 + );
  36 + }
  37 + }
  38 + render() {
  39 + return(
  40 + <View style={styles.container}>
  41 + <Image
  42 + style={styles.avatar}
  43 + source={{uri:this.props.data.avatar}}
  44 + />
  45 + <Text style={styles.timeLabel}>{this.props.data.time}</Text>
  46 + {this.renderName()}
  47 + {this.renderDelete()}
  48 + <Text style={styles.fromLabel}>{this.props.data.templete}</Text>
  49 + </View>
  50 + );
  51 + }
  52 +}
  53 +
  54 +const styles = StyleSheet.create({
  55 +
  56 + container: {
  57 + flexDirection: 'row',
  58 + },
  59 +
  60 + avatar: {
  61 + top: 15,
  62 + left: 15,
  63 + width: 30,
  64 + height: 30,
  65 + borderRadius: 15,
  66 + backgroundColor: 'grey',
  67 + },
  68 +
  69 + //来自哪个模块
  70 + fromLabel: {
  71 + top:15,
  72 + right:15,
  73 + height: 20,
  74 + backgroundColor: '#aaaaaa',
  75 + fontSize: 15,
  76 + textAlign: 'center'
  77 + },
  78 +
  79 + nameLabel: {
  80 + top: 15,
  81 + marginLeft: 15,
  82 + height: 20,
  83 + fontSize: 12,
  84 + color: 'black',
  85 + backgroundColor: 'red',
  86 + textAlign: 'left',
  87 + bottom: 10,
  88 + },
  89 +
  90 + ownerColor: {
  91 + color: '#4a90e2',
  92 + },
  93 +
  94 + deletePosition: {
  95 + left: 0,
  96 + top: 60,
  97 + },
  98 +
  99 + timeLabel: {
  100 + top: 32,
  101 + height: 12,
  102 + left: 15,
  103 + fontSize: 10,
  104 + color: '#999999',
  105 +
  106 + },
  107 +});
  1 +'use strict'
  2 +
  3 +import React, {Component} from 'react';
  4 +import {
  5 + View,
  6 + Text,
  7 + ListView,
  8 + StyleSheet,
  9 +} from 'react-native'
  10 +
  11 +import SPHeaderCell from './SPHeaderCell'
  12 +
  13 +export default class SubjectPost extends Component {
  14 + constructor(props) {
  15 + super(props);
  16 + this.dataSource = new ListView.DataSource({
  17 + rowHasChanged:(r1,r2)=> r1 != r2,
  18 + sectionHeaderHasChanged: (s1, s2) => s1 != s2,
  19 + });
  20 + this.renderRow = this.renderRow.bind(this);
  21 + }
  22 +
  23 + renderRow(rowData, sectionId) {
  24 + console.log(sectionId);
  25 + switch (sectionId) {
  26 + case 'header':
  27 +
  28 + return(
  29 + <SPHeaderCell data={rowData}/>
  30 + );
  31 + break;
  32 + default:
  33 +
  34 + break;
  35 + }
  36 + }
  37 +
  38 + render() {
  39 +
  40 + const testDataBlob = {
  41 +
  42 + "header": [
  43 + {
  44 + "name":"川本小一郎",
  45 + "avatar":"http://img0.imgtn.bdimg.com/it/u=441053097,4234222567&fm=21&gp=0.jpg",
  46 + "owner":true,
  47 + "templete":"永恒的潮流",
  48 + "time":"2小时前",
  49 + }
  50 + ],
  51 + }
  52 +
  53 + return(
  54 + <ListView
  55 + style={styles.container}
  56 + dataSource={this.dataSource.cloneWithRowsAndSections(testDataBlob)}
  57 + renderRow={this.renderRow}
  58 + enableEmptySections={true}
  59 + />
  60 + );
  61 + }
  62 +}
  63 +
  64 +const styles = StyleSheet.create({
  65 + container: {
  66 + top: 0,
  67 + flex: 1,
  68 + },
  69 +});
@@ -13,6 +13,9 @@ import Home from '../components/Home'; @@ -13,6 +13,9 @@ import Home from '../components/Home';
13 import * as homeActions from '../reducers/home/homeActions'; 13 import * as homeActions from '../reducers/home/homeActions';
14 14
15 15
  16 +import {Actions} from 'react-native-router-flux';
  17 +
  18 +
16 const { 19 const {
17 StatusBar, 20 StatusBar,
18 ScrollView, 21 ScrollView,
@@ -61,12 +64,16 @@ class HomeContainer extends React.Component { @@ -61,12 +64,16 @@ class HomeContainer extends React.Component {
61 constructor(props) { 64 constructor(props) {
62 super(props); 65 super(props);
63 66
  67 + this.testPress = this.testPress.bind(this);
64 } 68 }
65 69
66 componentDidMount() { 70 componentDidMount() {
67 71
68 } 72 }
69 73
  74 + testPress() {
  75 + Actions.SubjectPost();
  76 + }
70 render() { 77 render() {
71 78
72 return ( 79 return (
@@ -75,7 +82,7 @@ class HomeContainer extends React.Component { @@ -75,7 +82,7 @@ class HomeContainer extends React.Component {
75 hidden={false} 82 hidden={false}
76 barStyle={'light-content'} 83 barStyle={'light-content'}
77 /> 84 />
78 - <Home/> 85 + <Home testPress={this.testPress}/>
79 </View> 86 </View>
80 ); 87 );
81 } 88 }
  1 +'use strict'
  2 +/**
  3 + * 发帖页
  4 + */
  5 +import React, {Component} from 'react';
  6 +import {
  7 + StyleSheet,
  8 +} from 'react-native'
  1 +'use strict';
  2 +
  3 +import React, {Component} from 'react';
  4 +import {
  5 + View,
  6 + StyleSheet,
  7 + Dimensions,
  8 + Platform,
  9 +} from 'react-native';
  10 +
  11 +import {bindActionCreators} from 'redux';
  12 +import {connect} from 'react-redux';
  13 +import {Map} from 'immutable';
  14 +
  15 +import SubjectPost from '../components/SubjectPost/SubjectPost';
  16 +
  17 +import * as subjectPostActions from '../reducers/subject/subjectPostActions';
  18 +
  19 +
  20 +/**
  21 + * ## Actions
  22 + * 3 of our actions will be available as ```actions```
  23 + */
  24 +const actions = [
  25 + subjectPostActions,
  26 +];
  27 +
  28 +/**
  29 + * Save that state
  30 + */
  31 +function mapStateToProps(state) {
  32 + return {
  33 + ...state
  34 + };
  35 +}
  36 +
  37 +/**
  38 + * Bind all the functions from the ```actions``` and bind them with
  39 + * ```dispatch```
  40 + */
  41 +function mapDispatchToProps(dispatch) {
  42 +
  43 + const creators = Map()
  44 + .merge(...actions)
  45 + .filter(value => typeof value === 'function')
  46 + .toObject();
  47 +
  48 + return {
  49 + actions: bindActionCreators(creators, dispatch),
  50 + dispatch
  51 + };
  52 +}
  53 +
  54 +class SubjectPostContainer extends Component {
  55 + constructor(props) {
  56 + super(props);
  57 +
  58 + }
  59 +
  60 + render() {
  61 +
  62 + return (
  63 + <View style={styles.container}>
  64 + <SubjectPost/>
  65 + </View>
  66 + );
  67 + }
  68 +}
  69 +
  70 +let {width, height} = Dimensions.get('window');
  71 +let navbarHeight = (Platform.OS === 'android') ? 50 : 64;
  72 +
  73 +let styles = StyleSheet.create({
  74 + container: {
  75 + top: navbarHeight,
  76 + height: height - navbarHeight - 49,
  77 + },
  78 +
  79 +});
  80 +
  81 +export default connect(mapStateToProps, mapDispatchToProps)(SubjectPostContainer);
  1 +/**
  2 + * # guideActions.js
  3 + *
  4 + * App user guide
  5 + *
  6 + */
  7 +'use strict';