From c131da6d3cb8c4dacef780129e1c5ecca039baed Mon Sep 17 00:00:00 2001 From: harukin-expo-dev-env Date: Mon, 2 Sep 2024 15:29:14 +0000 Subject: [PATCH] =?UTF-8?q?=E5=B7=AE=E5=88=86=E8=AA=BF=E6=95=B45?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/Apps/LandscapeBackButton.tsx | 48 +++++++++++++ components/Apps/MapsButton.tsx | 57 +++++++++++++++ components/Apps/NewMenu.tsx | 92 +++++++++++++++++++++++++ components/Apps/ReloadButton.tsx | 59 ++++++++++++++++ 4 files changed, 256 insertions(+) create mode 100644 components/Apps/LandscapeBackButton.tsx create mode 100644 components/Apps/MapsButton.tsx create mode 100644 components/Apps/NewMenu.tsx create mode 100644 components/Apps/ReloadButton.tsx diff --git a/components/Apps/LandscapeBackButton.tsx b/components/Apps/LandscapeBackButton.tsx new file mode 100644 index 0000000..89dff15 --- /dev/null +++ b/components/Apps/LandscapeBackButton.tsx @@ -0,0 +1,48 @@ +import React, { FC } from "react"; +import { + View, + TouchableOpacity, + TouchableOpacityProps, + TextStyle, +} from "react-native"; +import { Ionicons } from "@expo/vector-icons"; +export const LandscapeBackButton: FC<{ + onPress: () => void; +}> = ({ onPress }) => { + type stylesType = { + touch: TouchableOpacityProps["style"]; + text: TextStyle; + }; + const styles: stylesType = { + touch: { + position: "absolute", + left: 10, + width: 50, + height: 50, + backgroundColor: "#0099CC", + borderColor: "white", + borderStyle: "solid", + borderWidth: 1, + borderRadius: 50, + alignContent: "center", + alignSelf: "center", + alignItems: "center", + display: "flex", + }, + text: { + textAlign: "center", + width: "auto", + height: "auto", + textAlignVertical: "center", + fontWeight: "bold", + color: "white", + }, + }; + return ( + + + + + + ); +}; diff --git a/components/Apps/MapsButton.tsx b/components/Apps/MapsButton.tsx new file mode 100644 index 0000000..62462a4 --- /dev/null +++ b/components/Apps/MapsButton.tsx @@ -0,0 +1,57 @@ +import React, { FC } from "react"; +import { + View, + Text, + TouchableOpacity, + Platform, + TouchableOpacityProps, + TextStyle, +} from "react-native"; +import Constants from "expo-constants"; + +const top = Platform.OS == "ios" ? Constants.statusBarHeight : 0; +type MapsButtonProps = { + onPress: () => void; + mapSwitch: string; +}; +type stylesType = { + touch: TouchableOpacityProps["style"]; + text: TextStyle; +}; + +export const MapsButton: FC = ({ onPress, mapSwitch }) => { + const styles: stylesType = { + touch: { + position: "absolute", + top, + left: 10, + width: 50, + height: 50, + backgroundColor: "#0099CC", + borderColor: "white", + borderStyle: "solid", + borderWidth: 1, + borderRadius: 50, + alignContent: "center", + alignSelf: "center", + alignItems: "center", + display: mapSwitch == "true" ? "flex" : "none", + }, + text: { + textAlign: "center", + width: "auto", + height: "auto", + textAlignVertical: "center", + fontWeight: "bold", + color: "white", + fontSize: 20, + }, + }; + return ( + + + ≡ + + + ); +}; diff --git a/components/Apps/NewMenu.tsx b/components/Apps/NewMenu.tsx new file mode 100644 index 0000000..d2e4a8f --- /dev/null +++ b/components/Apps/NewMenu.tsx @@ -0,0 +1,92 @@ +import React from "react"; +import { View, Text, TouchableOpacity, useWindowDimensions, Platform } from "react-native"; +import { Ionicons } from "@expo/vector-icons"; +import * as Updates from "expo-updates"; +import Constants from "expo-constants"; +import { useCurrentTrain } from "../../stateBox/useCurrentTrain"; + +const top = Platform.OS == "ios" ? Constants.statusBarHeight : 0; +export const NewMenu = ({ LoadError }) => { + const { webview } = useCurrentTrain(); + const { width } = useWindowDimensions(); + return ( + + { + webview.current?.injectJavaScript(`AccordionClassEvent()`); + }} + > + <> + + + + + + + メニュー + + + + + Updates.reloadAsync()} + style={{ + width: 54, + height: 54, + backgroundColor: LoadError ? "red" : "#0099CC", + borderColor: "white", + borderStyle: "solid", + borderWidth: 1, + alignContent: "center", + alignSelf: "center", + alignItems: "center", + }} + > + + + + + + ); + }; \ No newline at end of file diff --git a/components/Apps/ReloadButton.tsx b/components/Apps/ReloadButton.tsx new file mode 100644 index 0000000..8381da5 --- /dev/null +++ b/components/Apps/ReloadButton.tsx @@ -0,0 +1,59 @@ +import React, { FC } from "react"; +import { + View, + TouchableOpacity, + Platform, + TouchableOpacityProps, + TextStyle, +} from "react-native"; +import { Ionicons } from "@expo/vector-icons"; +import Constants from "expo-constants"; +import { useTrainMenu } from "../../stateBox/useTrainMenu"; +const top = Platform.OS == "ios" ? Constants.statusBarHeight : 0; + +type stylesType = { + touch: TouchableOpacityProps["style"]; + text: TextStyle; +}; +type ReloadButton = { + onPress: () => void; + right: number; + mapSwitch: any; + LoadError?: boolean; + +} +export const ReloadButton:FC = ({ onPress, mapSwitch, LoadError = false, right }) => { + const styles: stylesType = { + touch: { + position: "absolute", + top, + right: 10 + right, + width: 50, + height: 50, + backgroundColor: LoadError ? "red" : "#0099CC", + borderColor: "white", + borderStyle: "solid", + borderWidth: 1, + borderRadius: 50, + alignContent: "center", + alignSelf: "center", + alignItems: "center", + display: mapSwitch, + }, + text: { + textAlign: "center", + width: "auto", + height: "auto", + textAlignVertical: "center", + fontWeight: "bold", + color: "white", + }, + }; + return ( + + + + + + ); +};