1.提交微信连接分享（好友、朋友圈）

2.开放sharedDialog的方法，调用上层事件。

pages/components/SchedulePage.js

@@ -6,302 +6,315 @@
  * @flow
  */
 
-import React, { Component } from "react";
+import React, { Component } from 'react';
 import {
-  Platform,
-  StyleSheet,
-  Text,
-  View,
-  Image,
-  TouchableOpacity,
-  ImageBackground,
-  FlatList,
-  findNodeHandle,
-  UIManager,
-  StatusBar,
-  BackHandler,
-  Button,
-  DeviceEventEmitter
-} from "react-native";
-import Orientation from "react-native-orientation";
-import AndroidUtil from "../../util/AndroidUtil";
-import BasePage from "../BasePage";
-import CourseTitle from "./CourseTitle";
-import SharedDialog from "./SharedDialog";
-import ScheduleFlatItem from "./ScheduleFlatItem";
-import CusVideo from "./CusVideo";
-import ScheduleUrl from '../services/schedule'
-
+	Platform,
+	StyleSheet,
+	Text,
+	View,
+	Image,
+	TouchableOpacity,
+	ImageBackground,
+	FlatList,
+	findNodeHandle,
+	UIManager,
+	StatusBar,
+	BackHandler,
+	Button,
+	DeviceEventEmitter
+} from 'react-native';
+import Orientation from 'react-native-orientation';
+import AndroidUtil from '../../util/AndroidUtil';
+import BasePage from '../BasePage';
+import CourseTitle from './CourseTitle';
+import SharedDialog from './SharedDialog';
+import ScheduleFlatItem from './ScheduleFlatItem';
+import CusVideo from './CusVideo';
+import ScheduleUrl from '../services/schedule';
+import wechat from '../utils/wechat';
 
 export default class SchedulePage extends BasePage {
-  constructor(props) {
-    super(props);
-    this.state = {
-      statusbar_hidden: false,
-      video_show: false,
-      x: 0.0,
-      y: 0.0,
-      videoImg_flex: 1,
-      videoImage_width: 0,
-      videoImage_height: 0,
-      videoImage_x: 0.0,
-      videoImage_y: 0.0,
-      video_uri:
-        "https://www.apple.com/105/media/cn/iphone-x/2017/01df5b43-28e4-4848-bf20-490c34a926a7/films/feature/iphone-x-feature-cn-20170912_1280x720h.mp4",
-      title_height: "9%",
-      video_frame_height: "32%",
-      seat_height: "2%",
-      flatlist_height: "60%",
-      isFull: false,
-      playing_key: 0,
-      scheduleTitle: '',
-      wareList: [],
-      colorList: [
-        '#FFBC3D',
-        '#FB5B76',
-        '#EC48E1',
-        '#39D6B9',
-        '#3397F0'
-      ]
-    };
-  }
-
-  render() {
-    return (
-      <View
-        style={{
-          flex: 1
-        }}
-      >
-        <StatusBar
-          // backgroundColor={"transparent"}
-          barStyle={"dark-content"}
-          backgroundColor={"white"}
-          translucent={false}
-          hidden={this.state.statusbar_hidden}
-        />
+	constructor(props) {
+		super(props);
+		this.state = {
+			statusbar_hidden: false,
+			video_show: false,
+			x: 0.0,
+			y: 0.0,
+			videoImg_flex: 1,
+			videoImage_width: 0,
+			videoImage_height: 0,
+			videoImage_x: 0.0,
+			videoImage_y: 0.0,
+			video_uri:
+				'https://www.apple.com/105/media/cn/iphone-x/2017/01df5b43-28e4-4848-bf20-490c34a926a7/films/feature/iphone-x-feature-cn-20170912_1280x720h.mp4',
+			title_height: '9%',
+			video_frame_height: '32%',
+			seat_height: '2%',
+			flatlist_height: '60%',
+			isFull: false,
+			playing_key: 0,
+			scheduleTitle: '',
+			wareList: [],
+			colorList: [ '#FFBC3D', '#FB5B76', '#EC48E1', '#39D6B9', '#3397F0' ]
+		};
+	}
 
-        <View
-          style={{
-            flex: 1,
-            backgroundColor: "#F3F3F3",
-            justifyContent: "center",
-            alignItems: "center"
-          }}
-        >
-          <View
-            style={{
-              height: this.state.title_height,
-              backgroundColor: "white"
-            }}
-          >
-            <CourseTitle
-              width={this.getWindowWidth()}
-              title={this.state.scheduleTitle}
-              lefttype={1}
-              righttype={1}
-              textcolor={"#231F20"}
-              backPress={() => this.goBack()}
-              // backPress={() => alert("左侧按钮")}
-              rightPress={this.showSharedDialog.bind(this)}
-            />
-          </View>
-          <View
-            style={{
-              height: this.state.video_frame_height,
-              width: "100%"
-            }}
-          >
-            <Image
-              source={{
-                uri:
-                  "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1556277324856&di=dc1548a0c5ba10481af922e174912937&imgtype=0&src=http%3A%2F%2Fwww.51pptmoban.com%2Fd%2Ffile%2F2012%2F05%2F12%2F82c4568a90055adcf8fbb896f0841c69.jpg"
-              }}
-              style={{
-                width: "100%",
-                height: "100%"
-              }}
-              ref={c => {
-                this.video_image = c;
-              }}
-            />
-          </View>
-          <View
-            style={{
-              height: this.state.seat_height
-            }}
-          />
-          <View
-            style={{
-              height: this.state.flatlist_height,
-              justifyContent: "center",
-              alignItems: "center",
-              width: "100%"
-            }}
-          >
-            <FlatList
-              ItemSeparatorComponent={() => (
-                <View
-                  style={{
-                    height: 10
-                  }}
-                />
-              )}
-              ListFooterComponent={() => (
-                <View
-                  style={{
-                    height: 30
-                  }}
-                />
-              )}
-              renderItem={({ item }) => {
-                return this.loadFlatItem(item);
-              }}
-              keyExtractor={(item, index) => item.id.toString()}
-              horizontal={false}
-              data={this.state.wareList}
-            />
-          </View>
-        </View>
-        <CusVideo
-          show={this.state.video_show}
-          uri={this.state.video_uri}
-          ref={view => (this.video = view)}
-          needback={false}
-          videofullScreenPlayer={this.fullScreenPlayer.bind(this)}
-          onError={this.onError.bind(this)}
-          onEnd={this.onEnd.bind(this)}
-          style={{
-            left: this.state.x,
-            top: this.state.y,
-            width: this.state.video_width,
-            height: this.state.video_height,
-            overflow: "hidden",
-            position: "absolute"
-          }}
-        />
-        <SharedDialog ref={view => (this.shareddialog = view)} />
-      </View>
-    );
-  }
-  loadFlatItem(data) {
-    return (
-      <ScheduleFlatItem
-        width={this.getWindowWidth() * 0.9}
-        height={50}
-        data={data}
-        onPress={() => this.changeUrl(data)}
-      />
-    );
-  }
+	render() {
+		return (
+			<View
+				style={{
+					flex: 1
+				}}
+			>
+				<StatusBar
+					// backgroundColor={"transparent"}
+					barStyle={'dark-content'}
+					backgroundColor={'white'}
+					translucent={false}
+					hidden={this.state.statusbar_hidden}
+				/>
 
-  componentWillMount() {
-    BackHandler.addEventListener("hardwareBackPress", this.onBackAndroid);
-  }
-  componentWillUnmount() {
-    BackHandler.removeEventListener("hardwareBackPress", this.onBackAndroid);
-  }
-  componentDidMount() {
-    const { id } = this.props.navigation.state.params;
-    alert(id)
-    let colorTemp = '';
-    let colorIndexTemp = 0;
-    const colorList = this.state.colorList;
-    ScheduleUrl.getSchedule('KINDERGARTEN').success(res => {
-      res.data.wareList.forEach((item, index) => {
-        if (index === 0) {
-          colorTemp = item.subTitle;
-        }
-        if (item.subTitle === colorTemp) {
-          item.subColor = colorList[colorIndexTemp];
-        } else {
-          colorIndexTemp++;
-          if (colorIndexTemp > colorList.length - 1) {
-            colorIndexTemp = 0
-          }
-          colorTemp = item.subTitle;
-          item.subColor = colorList[colorIndexTemp];
-        }
-      })
-      this.setState({
-        scheduleTitle: res.data.category.title,
-        wareList: res.data.wareList
-      })
-    })
-  }
-  showSharedDialog() {
-    this.video.pause();
-    this.shareddialog.setModalVisible(true);
-  }
-  onBackAndroid = () => {
-    if (this.state.isFull) {
-      return true;
-    } else {
-    }
-  };
-  onError() {
-    alert("播放器异常");
-    this.setState({
-      video_show: false
-    });
-  }
-  onEnd() {
-    alert("播放结束");
-    this.setState({
-      video_show: false
-    });
-    this.video.refreshVideo();
-  }
-  fullScreenPlayer() {
-    if (!this.state.isFull) {
-      Orientation.lockToLandscape();
-      this.setState({
-        video_frame_height: "100%",
-        statusbar_hidden: true,
-        isFull: true,
-        x: 0,
-        y: 0,
-        video_width: "100%",
-        video_height: "100%"
-      });
-    } else {
-      Orientation.lockToPortrait();
-      this.setState({
-        video_frame_height: "32%",
-        x: this.state.videoImage_x,
-        y: this.state.videoImage_y,
-        video_width: this.state.videoImage_width,
-        video_height: this.state.videoImage_height,
-        statusbar_hidden: false,
-        isFull: false
-      });
-    }
-  }
-  changeUrl(data) {
-    //切换视频并且播放
-    // alert(url);
-    // if (this.state.playing_key == data.key) {
-    //   return;
-    // }
-    const handle = findNodeHandle(this.video_image);
-    setTimeout(() => {
-      UIManager.measure(handle, (x, y, width, height, pageX, pageY) => {
-        this.setState({
-          x: pageX,
-          y: pageY,
-          video_width: width,
-          video_height: height,
-          videoImage_width: width,
-          videoImage_height: height,
-          videoImage_x: pageX,
-          videoImage_y: pageY,
-          video_show: true,
-          video_uri: data.playUrl,
-          playing_key: data.key
-        });
-      });
-    }, 0);
+				<View
+					style={{
+						flex: 1,
+						backgroundColor: '#F3F3F3',
+						justifyContent: 'center',
+						alignItems: 'center'
+					}}
+				>
+					<View
+						style={{
+							height: this.state.title_height,
+							backgroundColor: 'white'
+						}}
+					>
+						<CourseTitle
+							width={this.getWindowWidth()}
+							title={this.state.scheduleTitle}
+							lefttype={1}
+							righttype={1}
+							textcolor={'#231F20'}
+							backPress={() => this.goBack()}
+							// backPress={() => alert("左侧按钮")}
+							rightPress={this.showSharedDialog.bind(this)}
+						/>
+					</View>
+					<View
+						style={{
+							height: this.state.video_frame_height,
+							width: '100%'
+						}}
+					>
+						<Image
+							source={{
+								uri:
+									'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1556277324856&di=dc1548a0c5ba10481af922e174912937&imgtype=0&src=http%3A%2F%2Fwww.51pptmoban.com%2Fd%2Ffile%2F2012%2F05%2F12%2F82c4568a90055adcf8fbb896f0841c69.jpg'
+							}}
+							style={{
+								width: '100%',
+								height: '100%'
+							}}
+							ref={(c) => {
+								this.video_image = c;
+							}}
+						/>
+					</View>
+					<View
+						style={{
+							height: this.state.seat_height
+						}}
+					/>
+					<View
+						style={{
+							height: this.state.flatlist_height,
+							justifyContent: 'center',
+							alignItems: 'center',
+							width: '100%'
+						}}
+					>
+						<FlatList
+							ItemSeparatorComponent={() => (
+								<View
+									style={{
+										height: 10
+									}}
+								/>
+							)}
+							ListFooterComponent={() => (
+								<View
+									style={{
+										height: 30
+									}}
+								/>
+							)}
+							renderItem={({ item }) => {
+								return this.loadFlatItem(item);
+							}}
+							keyExtractor={(item, index) => item.id.toString()}
+							horizontal={false}
+							data={this.state.wareList}
+						/>
+					</View>
+				</View>
+				<CusVideo
+					show={this.state.video_show}
+					uri={this.state.video_uri}
+					ref={(view) => (this.video = view)}
+					needback={false}
+					videofullScreenPlayer={this.fullScreenPlayer.bind(this)}
+					onError={this.onError.bind(this)}
+					onEnd={this.onEnd.bind(this)}
+					style={{
+						left: this.state.x,
+						top: this.state.y,
+						width: this.state.video_width,
+						height: this.state.video_height,
+						overflow: 'hidden',
+						position: 'absolute'
+					}}
+				/>
+				<SharedDialog
+					ref={(view) => (this.shareddialog = view)}
+					friend={this.sharedfriend.bind(this)}
+					CircleOfFriends={this.sharedcircel.bind(this)}
+				/>
+			</View>
+		);
+	}
+	loadFlatItem(data) {
+		return (
+			<ScheduleFlatItem
+				width={this.getWindowWidth() * 0.9}
+				height={50}
+				data={data}
+				onPress={() => this.changeUrl(data)}
+			/>
+		);
+	}
 
-    this.video.start();
-  }
+	componentWillMount() {
+		BackHandler.addEventListener('hardwareBackPress', this.onBackAndroid);
+	}
+	componentWillUnmount() {
+		BackHandler.removeEventListener('hardwareBackPress', this.onBackAndroid);
+	}
+	componentDidMount() {
+		const { id } = this.props.navigation.state.params;
+		alert(id);
+		let colorTemp = '';
+		let colorIndexTemp = 0;
+		const colorList = this.state.colorList;
+		ScheduleUrl.getSchedule('KINDERGARTEN').success((res) => {
+			res.data.wareList.forEach((item, index) => {
+				if (index === 0) {
+					colorTemp = item.subTitle;
+				}
+				if (item.subTitle === colorTemp) {
+					item.subColor = colorList[colorIndexTemp];
+				} else {
+					colorIndexTemp++;
+					if (colorIndexTemp > colorList.length - 1) {
+						colorIndexTemp = 0;
+					}
+					colorTemp = item.subTitle;
+					item.subColor = colorList[colorIndexTemp];
+				}
+			});
+			this.setState({
+				scheduleTitle: res.data.category.title,
+				wareList: res.data.wareList
+			});
+		});
+	}
+	showSharedDialog() {
+		this.video.pause();
+		this.shareddialog.setModalVisible(true);
+	}
+	onBackAndroid = () => {
+		if (this.state.isFull) {
+			return true;
+		} else {
+		}
+	};
+	onError() {
+		alert('播放器异常');
+		this.setState({
+			video_show: false
+		});
+	}
+	onEnd() {
+		alert('播放结束');
+		this.setState({
+			video_show: false
+		});
+		this.video.refreshVideo();
+	}
+	fullScreenPlayer() {
+		if (!this.state.isFull) {
+			Orientation.lockToLandscape();
+			this.setState({
+				video_frame_height: '100%',
+				statusbar_hidden: true,
+				isFull: true,
+				x: 0,
+				y: 0,
+				video_width: '100%',
+				video_height: '100%'
+			});
+		} else {
+			Orientation.lockToPortrait();
+			this.setState({
+				video_frame_height: '32%',
+				x: this.state.videoImage_x,
+				y: this.state.videoImage_y,
+				video_width: this.state.videoImage_width,
+				video_height: this.state.videoImage_height,
+				statusbar_hidden: false,
+				isFull: false
+			});
+		}
+	}
+	changeUrl(data) {
+		//切换视频并且播放
+		// alert(url);
+		// if (this.state.playing_key == data.key) {
+		//   return;
+		// }
+		const handle = findNodeHandle(this.video_image);
+		setTimeout(() => {
+			UIManager.measure(handle, (x, y, width, height, pageX, pageY) => {
+				this.setState({
+					x: pageX,
+					y: pageY,
+					video_width: width,
+					video_height: height,
+					videoImage_width: width,
+					videoImage_height: height,
+					videoImage_x: pageX,
+					videoImage_y: pageY,
+					video_show: true,
+					video_uri: data.playUrl,
+					playing_key: data.key
+				});
+			});
+		}, 0);
+		this.video.start();
+	}
+	sharedfriend() {
+		wechat.shareToSessionNews(
+			'标题测试',
+			'标题内容',
+			'http://www.ncloud.hk/email-signature-262x100.png',
+			'http://www.baidu.com'
+		);
+	}
+	sharedcircel() {
+		wechat.shareToTimelineNews(
+			'标题测试',
+			'标题内容',
+			'http://www.ncloud.hk/email-signature-262x100.png',
+			'http://www.baidu.com'
+		);
+	}
 }

pages/components/SharedDialog.js

@@ -22,7 +22,7 @@ import {
 	TouchableHighlight,
 	DeviceEventEmitter
 } from 'react-native';
-import wechat from '../utils/wechat';
+
 type Props = {};
 export default class SharedDialog extends Component<Props> {
 	state = {
@@ -217,11 +217,11 @@ export default class SharedDialog extends Component<Props> {
 
 	wechat() {
 		this.setModalVisible(false);
-		wechat.shareToSessionText('测试测试测试shareToSessionText');
+		this.props.friend();
 	}
 	circle() {
 		this.setModalVisible(false);
-		wechat.shareToTimelineText('测试测试测试');
+		this.props.CircleOfFriends();
 	}
 
 	setModalVisible(visible) {

pages/utils/wechat.js

@@ -63,11 +63,11 @@ export default class wechat {
 		WeChat.isWXAppInstalled().then((isInstalled) => {
 			if (isInstalled) {
 				WeChat.shareToSession({
-					title: title,
-					description: description,
-					thumbImage: thumbImage,
+					title: title_text,
+					description: description_text,
+					thumbImage: thumbImage_url,
 					type: 'news',
-					webpageUrl: webpageUrl
+					webpageUrl: webpageUrl_url
 				}).catch((error) => {
 					alert(error.message);
 				});
@@ -97,7 +97,7 @@ export default class wechat {
 	}
 
 	/**
-   * 微信好友分享链接
+   * 微信朋友圈分享链接
    * @param  {string} title_text            分享的标题
    * @param  {string} description_text      分享的标题内容
    * @param  {string} thumbImage_url       分享的标题图片
@@ -156,6 +156,7 @@ export default class wechat {
 		});
 	}
 
+	//跳转小程序(需要改 react-native-wechat插件 1.删除react-native-android默认的jar包，直接引用微信官网的包。2.在react-native-wechat插件的index.js中，增加toMiniProgram方法)
 	static toMiniProgram(programId, path) {
 		WeChat.toMiniProgram(programId, path);
 	}
@@ -169,9 +170,11 @@ export default class wechat {
     // wechat.wechatLogin((openid) => {
 		// 	alert(openid);
 		// });
+	2.跳转小程序方法
+		wechat.toMiniProgram('gh_d81480f7a2fd', '');
 
 
-    //微信方法传参
+    //微信各种分享方法传参定义
     {
     type {Number} type of this message. Can be {news|text|imageUrl|imageFile|imageResource|video|audio|file}
     thumbImage {String} Thumb image of the message, which can be a uri or a resource id.