本エントリでは作成したアプリで使用したいくつかのテクニックの一つのナビゲーションについて記載します。
React Nativeでナビゲーションを実現するには幾つか方法があるようですが筆者はReact Navigationを使用しました。
React Navigationは3.x系になって前バージョンと随分趣が変わったようですが幸か不幸か筆者は3.xからのスタートだったのでネットの情報が少ない以外はそれほどに大きな困難を抱えることはありませんでした。
以下ナビゲートのを定義したApp.jsとメイン画面のソースです。

App.js

import React, {Component} from 'react';
import {Platform, StyleSheet, Text,View} from 'react-native';
import { createStackNavigator, createAppContainer } from "react-navigation";
import HomeCamera from "./src/HomeCamera.js";
import HomeConf from "./src/HomeConf.js";
import HomeScreen from "./src/HomeScreen.js";
import HomeList from "./src/HomeList.js";

const AppNavigator = createStackNavigator(
  {
    Home: HomeScreen,
    Camera:HomeCamera,
    Conf: HomeConf,
    List: HomeList
  },
  {
    initialRouteName: "Home"
  }
);

const AppContainer = createAppContainer(AppNavigator);

type Props = {};
export default class App extends Component<Props> {
  render() {
   return (
    <AppContainer />
   );
 }
}

HomeScreen.js

import React, {Component} from 'react';
import {Platform, StyleSheet, Text, TouchableOpacity, View,Image} from 'react-native';
import { NavigationActions } from "react-navigation";

export default class HomeScreen extends Component<Props> {
  //コンストラクタ
  constructor(props){
    super(props); //必ず呼ぶ
  }

  render() {
   return (
     <View style={styles.container}>
     <Image style={{ width: 400, height: 200}} source={{uri:'https://yuap.jp/blog/wp-content/uploads/2018/09/reactnative.png'}}/>
     <TouchableOpacity onPress={() => this.props.navigation.navigate("List")} style={styles.capture}>
       <Text style={{ fontSize: 14 }}> List</Text>
     </TouchableOpacity>
     <TouchableOpacity onPress={() => this.props.navigation.navigate("Camera")} style={styles.capture}>
       <Text style={{ fontSize: 14 }}> Camera</Text>
     </TouchableOpacity>
     </View>
   )
 }
}


const styles = StyleSheet.create({
  container: {
    flex: 1,
    flexDirection: 'column',
    justifyContent:'center',
    backgroundColor: 'white',
  },
  capture: {
    flex: 0,
    backgroundColor: 'aliceblue',
    borderRadius: 5,
    padding: 15,
    paddingHorizontal: 20,
    alignSelf: 'center',
    margin: 50,
  },
});

App.jsで定義している createStackNavigator 辺りが2.x系と大きく変わったようですね。
HomeScreen.jsのポイントは他のコンポーネントに遷移する時には

this.props.navigation.navigate("List")

というようにnavigateを使用することで、本関数は

import { NavigationActions } from "react-navigation";

とインポートすると使えるようになります。

以上でナビゲーションについての篇を閉じます。

React Navigationでのナビゲージョンの実現について

App.js

HomeScreen.js