‘增加课程详情页

App.js

@@ -23,6 +23,7 @@ import SchoolAge from "./pages/components/SchoolAge";
 import MainPage from "./pages/components/MainPage";
 import SchedulePage from "./pages/components/SchedulePage";
 import PersonalInfo from "./pages/components/PersonalInfo";
+import CourseDetails from './pages/CourseDetails'
 const instructions = Platform.select({
   ios: "Press Cmd+R to reload,\n" + "Cmd+D or shake for dev menu",
   android:
@@ -36,10 +37,11 @@ const RootNavigator = createStackNavigator(
     SchoolAge: { screen: SchoolAge },
     MainPage: { screen: MainPage },
     SchedulePage: { screen: SchedulePage },
-    PersonalInfo: { screen: PersonalInfo }
+    PersonalInfo: { screen: PersonalInfo },
+    CourseDetails: { screen: CourseDetails}
   },
   {
-    initialRouteName: "SchedulePage",
+    initialRouteName: "CourseDetails",
     headerMode: "null"
   }
 );

pages/CourseDetails.js

@@ -18,6 +18,18 @@ import {
 
 import VideoExplain from './components/VideoExplain'
 
+class CourseList extends Component {
+  render() {
+    return (
+      <View style={styles.courseList}>
+        <View style={[styles.padding, styles.title]}>
+
+        </View>
+      </View>
+    );
+  }
+}
+
 export default class CourseDetails extends Component {
   render() {
     return (
@@ -27,11 +39,24 @@ export default class CourseDetails extends Component {
         details={'汉字，作为象形文字，是中华文化的载体，本课程从甲骨文开始，让孩子爱上识字爱上文字的美。了解文字…'}
         uri={'http://chimee.org/vod/1.mp4'}
         />
+        <CourseList></CourseList>
       </ScrollView>
     );
   }
 }
 
 const styles = StyleSheet.create({
-  
+  courseList: {
+    width: '100%',
+    backgroundColor: '#fff',
+    marginTop: 8,
+  },
+  padding: {
+    paddingLeft: 20,
+    paddingRight: 20,
+    
+  },
+  title: {
+
+  }
 });

pages/components/VideoExplain.js

@@ -26,7 +26,7 @@ export default class VideoExplain extends Component {
   // };
   render() {
     return (
-      <ScrollView style={{backgroundColor: '#F0F1F5'}}>
+      <View>
         <CusVideo uri={this.props.uri} style={{width: '100%', height: 210}}/>
         <View style={styles.videoExplain}>
           <View style={styles.title}>
@@ -44,7 +44,7 @@ export default class VideoExplain extends Component {
             {this.props.details}
           </Text>
         </View>
-      </ScrollView>
+      </View>
     );
   }
 }