efunbox-mobile-8/pages/components/CourseTitle.js

import React, { Component } from "react";
import {
  Platform,
  StyleSheet,
  Text,
  View,
  Image,
  TouchableOpacity,
  ImageBackground,
  Button,
  Dimensions,
  DeviceEventEmitter
} from "react-native";

/** 因没有图，所以Image先用颜色代替，有图可替换 */
const instructions = Platform.select({
  ios: "Press Cmd+R to reload,\n" + "Cmd+D or shake for dev menu",
  android:
    "Double tap R on your keyboard to reload,\n" +
    "Shake or press menu button for dev menu"
});

type Props = {};
var width = Dimensions.get("window").width;
var height = Dimensions.get("window").height;
export default class CourseTitle extends Component<Props> {
  render() {
    return (
      <View
        style={{
          width: this.props.width,
          height: this.props.height,
          flexDirection: "row"
        }}
      >
        <View style={{ flex: 1 }}>
          <TouchableOpacity
            //返回
            activeOpacity={1}
            onPress={() => this.props.navigation.goBack()}
          >
            <Image style={{ width: 20, height: 20, backgroundColor: "blue" }} />
          </TouchableOpacity>
        </View>
        <View style={{ flex: 5 }}>
          <Text>{this.props.title}</Text>
        </View>
        <View style={{ flex: 1 }}>
          <TouchableOpacity
            //分享
            activeOpacity={1}
            onPress={() => this.props.navigation.goBack()}
          >
            <Image style={{ width: 20, height: 20, backgroundColor: "blue" }} />
          </TouchableOpacity>
        </View>
      </View>
    );
  }
}
/**

      使用方法
      <CourseTitle
          uri="https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=1295208965,3056573814&amp;fm=26&amp;gp=0.jpg"
          width={400}
          height={150}
          username="卡通笨笨熊"
          flowerNumber="123234"
          onPress={() => this.toNextPage("MainActivity")}
        />


 */