jrshikoku/App.js

159 lines
4.4 KiB
JavaScript

import React, { useEffect, useRef } from "react";
import { NavigationContainer } from "@react-navigation/native";
import {
createStackNavigator,
TransitionPresets,
} from "@react-navigation/stack";
import { createBottomTabNavigator } from "@react-navigation/bottom-tabs";
import { AntDesign, Ionicons } from "@expo/vector-icons";
import { ToastAndroid, Platform, UIManager } from "react-native";
import { UpdateAsync } from "./UpdateAsync.js";
import Apps from "./Apps";
import tndView from "./ndView";
import trainbase from "./trainbaseview";
import howto from "./howto";
import menu from "./menu";
import News from "./components/news.js";
import TestArea from "./TestArea.js";
import Setting from "./components/settings.js";
import trainMenu from "./components/trainMenu.js";
const Stack = createStackNavigator();
const Tab = createBottomTabNavigator();
if (Platform.OS === "android") {
if (UIManager.setLayoutAnimationEnabledExperimental) {
UIManager.setLayoutAnimationEnabledExperimental(true);
}
}
export default function App() {
const navigationRef = useRef();
var platform = Platform.OS === "android" ? 70 : 50;
useEffect(() => UpdateAsync(), []);
return (
<NavigationContainer name="Root" ref={navigationRef} style={{ flex: 1 }}>
<Tab.Navigator>
<Stack.Screen
name="login"
component={top}
options={{
tabBarLabel: "位置情報",
headerTransparent: true,
gestureEnabled: true,
tabBarIcon: ({ color, size }) => (
<AntDesign name="barchart" size={32} />
),
}}
/>
<Stack.Screen
name="menuPage"
component={menuPage}
options={{
tabBarLabel: "リンク",
headerTransparent: true,
gestureEnabled: true,
tabBarIcon: ({ color, size }) => (
<Ionicons name="ios-radio" size={32} />
),
}}
/>
<Stack.Screen
name="home"
component={tndView}
options={{
tabBarLabel: "運行情報",
headerTransparent: true,
gestureEnabled: true,
tabBarIcon: ({ color, size }) => (
<Ionicons name="md-train" size={32} />
),
}}
/>
</Tab.Navigator>
</NavigationContainer>
);
}
function top() {
return (
<Stack.Navigator>
<Stack.Screen
name="Apps"
component={Apps}
options={{
headerShown: false,
gestureEnabled: true,
headerTransparent: true,
}}
/>
<Stack.Screen
name="trainbase"
component={trainbase}
options={{
title: "トレインビジョン",
gestureEnabled: true,
...TransitionPresets.SlideFromRightIOS,
}}
/>
<Stack.Screen
name="howto"
component={howto}
options={{
title: "使い方",
gestureEnabled: true,
...TransitionPresets.ModalPresentationIOS,
cardOverlayEnabled: true,
headerTransparent: true,
headerShown: false,
}}
/>
<Stack.Screen name="test" component={TestArea} options={{}} />
<Stack.Screen
name="news"
component={News}
options={{
gestureEnabled: true,
...TransitionPresets.ModalPresentationIOS,
cardOverlayEnabled: true,
headerTransparent: true,
headerShown: false,
}}
/>
<Stack.Screen
name="trainMenu"
component={trainMenu}
options={{
gestureEnabled: true,
...TransitionPresets.ModalPresentationIOS,
cardOverlayEnabled: true,
headerTransparent: true,
headerShown: false,
}}
/>
</Stack.Navigator>
);
}
function menuPage() {
return (
<Stack.Navigator>
<Stack.Screen
name="menu"
component={menu}
options={{
headerShown: false,
gestureEnabled: true,
headerTransparent: true,
}}
/>
<Stack.Screen
name="setting"
component={Setting}
options={{
gestureEnabled: true,
...TransitionPresets.ModalPresentationIOS,
cardOverlayEnabled: true,
headerTransparent: true,
headerShown: false,
}}
/>
</Stack.Navigator>
);
}