diff --git a/App.js b/App.js
index a7d0236..4041b6e 100644
--- a/App.js
+++ b/App.js
@@ -18,6 +18,7 @@ import { SheetProvider } from "react-native-actions-sheet";
import "./components/ActionSheetComponents/sheets.js";
import { TrainDelayDataProvider } from "./stateBox/useTrainDelayData.js";
import { SafeAreaProvider } from "react-native-safe-area-context";
+import { DeviceOrientationChangeProvider } from "./stateBox/useDeviceOrientationChange.js";
LogBox.ignoreLogs([
"ViewPropTypes will be removed",
"ColorPropType will be removed",
@@ -32,25 +33,27 @@ if (Platform.OS === "android") {
export default function App() {
useEffect(() => UpdateAsync(), []);
return (
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
);
}
export function AppContainer() {
diff --git a/Apps.js b/Apps.js
index 0e9679b..74be89e 100644
--- a/Apps.js
+++ b/Apps.js
@@ -10,6 +10,7 @@ import {
import { WebView } from "react-native-webview";
import Constants from "expo-constants";
import { Ionicons } from "@expo/vector-icons";
+import * as Updates from "expo-updates";
import { AS } from "./storageControl";
import { news } from "./config/newsUpdate";
@@ -18,6 +19,7 @@ import { injectJavascriptData } from "./lib/webViewInjectjavascript";
import { checkDuplicateTrainData } from "./lib/checkDuplicateTrainData";
import { useFavoriteStation } from "./stateBox/useFavoriteStation";
import { useCurrentTrain } from "./stateBox/useCurrentTrain";
+import { useDeviceOrientationChange } from "./stateBox/useDeviceOrientationChange";
import { SheetManager } from "react-native-actions-sheet";
import TrainMenu from "./components/trainMenu";
import { EachTrainInfoCore } from "./components/ActionSheetComponents/EachTrainInfoCore";
@@ -31,16 +33,8 @@ export default function Apps({ navigation, webview, stationData }) {
const { navigate } = navigation;
var urlcache = "";
const { favoriteStation } = useFavoriteStation();
- const [isLandscape, setIsLandscape] = useState(false); //画面が横向きかどうか
+ const { isLandscape, setIsLandscape } = useDeviceOrientationChange();
const handleLayout = () => {};
- useEffect(() => {
- if (height / width > 1.5) {
- setIsLandscape(false);
- }
- if (height / width < 1.5) {
- setIsLandscape(true);
- }
- }, [height, width]);
//画面表示関連
const [iconSetting, setIconSetting] = useState(undefined);
@@ -70,6 +64,10 @@ export default function Apps({ navigation, webview, stationData }) {
stationMenu,
trainMenu
);
+ const ASCore = ({ k, s, d }) =>
+ AS.getItem(k)
+ .then((d) => (d ? s(d) : AS.setItem(k, d).then(Updates.reloadAsync)))
+ .catch(() => AS.setItem(k, d).then(Updates.reloadAsync));
useEffect(() => {
//ニュース表示
@@ -82,67 +80,26 @@ export default function Apps({ navigation, webview, stationData }) {
useEffect(() => {
//列車アイコンスイッチ
- AS.getItem("iconSwitch")
- .then((d) => {
- if (d) {
- setIconSetting(d);
- } else {
- AS.setItem("iconSwitch", "true").then(Updates.reloadAsync);
- }
- })
- .catch(() => AS.setItem("iconSwitch", "true").then(Updates.reloadAsync));
- }, []);
-
- useEffect(() => {
+ ASCore({ k: "iconSwitch", s: setIconSetting, d: "true" });
//地図スイッチ
- AS.getItem("mapSwitch")
- .then((d) => {
- if (d) {
- setMapSwitch(d);
- } else {
- AS.setItem("mapSwitch", "false").then(Updates.reloadAsync);
- }
- })
- .catch(() => AS.setItem("mapSwitch", "false").then(Updates.reloadAsync));
- }, []);
-
- useEffect(() => {
+ ASCore({ k: "mapSwitch", s: setMapSwitch, d: "false" });
//駅メニュースイッチ
- AS.getItem("stationSwitch")
- .then((d) => {
- if (d) {
- setStationMenu(d);
- } else {
- AS.setItem("stationSwitch", "true").then(Updates.reloadAsync);
- }
- })
- .catch(() =>
- AS.setItem("stationSwitch", "true").then(Updates.reloadAsync)
- );
- }, []);
- useEffect(() => {
+ ASCore({ k: "stationSwitch", s: setStationMenu, d: "true" });
//列車メニュースイッチ
- AS.getItem("trainSwitch")
- .then((d) => {
- if (d) {
- setTrainMenu(d);
- } else {
- AS.setItem("trainSwitch", "true").then(Updates.reloadAsync);
- }
- })
- .catch(() => AS.setItem("trainSwitch", "true").then(Updates.reloadAsync));
+ ASCore({ k: "trainSwitch", s: setTrainMenu, d: "true" });
}, []);
const onMessage = (event) => {
- if (event.nativeEvent.data.includes("train.html")) {
- navigate("trainbase", { info: event.nativeEvent.data, from: "Train" });
+ const { data } = event.nativeEvent;
+ if (data.includes("train.html")) {
+ navigate("trainbase", { info: data, from: "Train" });
return;
}
if (!originalStationList) {
alert("駅名標データを取得中...");
return;
}
- const dataSet = JSON.parse(event.nativeEvent.data);
+ const dataSet = JSON.parse(data);
switch (dataSet.type) {
case "LoadError": {
setLoadError(true);
@@ -151,12 +108,10 @@ export default function Apps({ navigation, webview, stationData }) {
case "PopUpMenu":
{
const selectedStationPDFAddress = dataSet.pdf;
- const findStationEachLine = (selectLine) => {
- let NearStation = selectLine.filter(
+ const findStationEachLine = (selectLine) =>
+ selectLine.filter(
(d) => d.StationTimeTable == selectedStationPDFAddress
);
- return NearStation;
- };
let returnDataBase = lineList
.map((d) => findStationEachLine(originalStationList[d]))
.filter((d) => d.length > 0)
@@ -175,13 +130,9 @@ export default function Apps({ navigation, webview, stationData }) {
SheetManager.show("StationDetailView", {
payload,
}),
- onExit: () => {
- SheetManager.hide("StationDetailView");
- },
+ onExit: () => SheetManager.hide("StationDetailView"),
};
- SheetManager.show("StationDetailView", {
- payload,
- });
+ SheetManager.show("StationDetailView", { payload });
}
}
return;
diff --git a/components/ActionSheetComponents/EachTrainInfo/TrainDataView.js b/components/ActionSheetComponents/EachTrainInfo/TrainDataView.js
index e8a229e..fdb5426 100644
--- a/components/ActionSheetComponents/EachTrainInfo/TrainDataView.js
+++ b/components/ActionSheetComponents/EachTrainInfo/TrainDataView.js
@@ -1,15 +1,7 @@
-import React, { useEffect, useState } from "react";
-import {
- View,
- Text,
- TouchableOpacity,
- useWindowDimensions,
-} from "react-native";
+import React from "react";
+import { View, TouchableOpacity, useWindowDimensions } from "react-native";
import { StateBox } from "./StateBox";
-import {
- heightPercentageToDP,
- widthPercentageToDP,
-} from "react-native-responsive-screen";
+import { useDeviceOrientationChange } from "../../../stateBox/useDeviceOrientationChange";
export const TrainDataView = ({
currentTrainData,
@@ -18,16 +10,8 @@ export const TrainDataView = ({
openTrainInfo,
mode = 0,
}) => {
- const [isLandscape, setIsLandscape] = useState(false);
const { width, height } = useWindowDimensions();
- useEffect(() => {
- if (height / width > 1.5) {
- setIsLandscape(false);
- }
- if (height / width < 1.5) {
- setIsLandscape(true);
- }
- }, [width, height]);
+ const { isLandscape } = useDeviceOrientationChange();
return (
{
+ const backAction = () => {
+ SheetManager.hide("EachTrainInfo");
+ return true;
+ };
+ const backHandler = BackHandler.addEventListener(
+ "hardwareBackPress",
+ backAction
+ );
+ return () => backHandler.remove();
+ }, []);
//bconst insets = useSafeAreaInsets();
const [headStation, setHeadStation] = useState();
@@ -107,7 +114,7 @@ export const EachTrainInfoCore = ({
: [];
const { height, width } = useWindowDimensions();
- const [isLandscape, setIsLandscape] = useState(false);
+ const { isLandscape } = useDeviceOrientationChange();
const [trueTrainID, setTrueTrainID] = useState();
useEffect(() => {
@@ -167,15 +174,6 @@ export const EachTrainInfoCore = ({
}
}, [currentTrainData]);
- useEffect(() => {
- if (height / width > 1.5) {
- setIsLandscape(false);
- }
- if (height / width < 1.5) {
- setIsLandscape(true);
- }
- }, [width, height]);
-
const replaceSpecialTrainDetail = (trainNum) => {
let TD = trainList[trainNum];
if (!TD) return;
diff --git a/components/ActionSheetComponents/JRSTraInfo.js b/components/ActionSheetComponents/JRSTraInfo.js
index 03bb430..64b0bc7 100644
--- a/components/ActionSheetComponents/JRSTraInfo.js
+++ b/components/ActionSheetComponents/JRSTraInfo.js
@@ -1,4 +1,4 @@
-import React, { useRef } from "react";
+import React, { useEffect, useRef } from "react";
import {
View,
LayoutAnimation,
@@ -7,9 +7,13 @@ import {
Text,
TouchableOpacity,
Platform,
+ BackHandler,
} from "react-native";
import { Ionicons, MaterialCommunityIcons } from "@expo/vector-icons";
-import ActionSheet, { useScrollHandlers } from "react-native-actions-sheet";
+import ActionSheet, {
+ SheetManager,
+ useScrollHandlers,
+} from "react-native-actions-sheet";
import LottieView from "lottie-react-native";
import { useSafeAreaInsets } from "react-native-safe-area-context";
import ViewShot from "react-native-view-shot";
@@ -50,6 +54,7 @@ export const JRSTraInfo = () => {
}
useBottomSafeAreaPadding={Platform.OS == "android"}
>
+
{
);
};
+const Handler = () => {
+ useEffect(() => {
+ const backAction = () => {
+ SheetManager.hide("JRSTraInfo");
+ return true;
+ };
+ const backHandler = BackHandler.addEventListener(
+ "hardwareBackPress",
+ backAction
+ );
+ return () => backHandler.remove();
+ }, []);
+ return <>;
+};
diff --git a/components/ActionSheetComponents/StationDeteilView.js b/components/ActionSheetComponents/StationDeteilView.js
index 3a8874e..497f2ca 100644
--- a/components/ActionSheetComponents/StationDeteilView.js
+++ b/components/ActionSheetComponents/StationDeteilView.js
@@ -1,9 +1,16 @@
import React, { useState, useEffect } from "react";
-import { View, Linking, Text, TouchableOpacity, Platform } from "react-native";
+import {
+ View,
+ Linking,
+ Text,
+ TouchableOpacity,
+ BackHandler,
+ Platform,
+} from "react-native";
import AutoHeightImage from "react-native-auto-height-image";
import { FontAwesome, Foundation, Ionicons } from "@expo/vector-icons";
import { useSafeAreaInsets } from "react-native-safe-area-context";
-import ActionSheet from "react-native-actions-sheet";
+import ActionSheet, { SheetManager } from "react-native-actions-sheet";
import Sign from "../../components/駅名表/Sign";
import { TicketBox } from "../atom/TicketBox";
@@ -25,6 +32,7 @@ export const StationDeteilView = (props) => {
} = props.payload;
const { busAndTrainData } = useBusAndTrainData();
const [trainBus, setTrainBus] = useState();
+
useEffect(() => {
if (!currentStation) return () => {};
const data = busAndTrainData.filter((d) => {
@@ -60,6 +68,7 @@ export const StationDeteilView = (props) => {
}
useBottomSafeAreaPadding={Platform.OS == "android"}
>
+
{
);
};
+const Handler = () => {
+ useEffect(() => {
+ const backAction = () => {
+ SheetManager.hide("StationDetailView");
+ return true;
+ };
+ const backHandler = BackHandler.addEventListener(
+ "hardwareBackPress",
+ backAction
+ );
+ return () => backHandler.remove();
+ }, []);
+ return <>;
+};
const styleSheet = {
外枠: {
width: wp("80%"),
diff --git a/components/AndroidWidget/TraInfoEXWidget.jsx b/components/AndroidWidget/TraInfoEXWidget.jsx
index d3c7809..46cd4e8 100644
--- a/components/AndroidWidget/TraInfoEXWidget.jsx
+++ b/components/AndroidWidget/TraInfoEXWidget.jsx
@@ -65,13 +65,14 @@ export function TraInfoEXWidget({ time, delayString }) {
flexDirection: "row",
width: "match_parent",
backgroundColor: "#ffffff",
+ flex: 1,
}}
clickAction="WIDGET_CLICK"
key={data[1]}
>
-
-
-
+
+
+
);
})
diff --git a/stateBox/useDeviceOrientationChange.js b/stateBox/useDeviceOrientationChange.js
new file mode 100644
index 0000000..e79e5c0
--- /dev/null
+++ b/stateBox/useDeviceOrientationChange.js
@@ -0,0 +1,28 @@
+import React, { createContext, useContext, useState, useEffect } from "react";
+import { useWindowDimensions } from "react-native";
+const initialState = { isLandscape: false, setIsLandscape: () => {} };
+
+const DeviceOrientationChange = createContext(initialState);
+
+export const useDeviceOrientationChange = () => {
+ return useContext(DeviceOrientationChange);
+};
+
+export const DeviceOrientationChangeProvider = ({ children }) => {
+ const [isLandscape, setIsLandscape] = useState(false);
+ const { height, width } = useWindowDimensions();
+
+ useEffect(() => {
+ if (height / width > 1.5) {
+ setIsLandscape(false);
+ }
+ if (height / width < 1.5) {
+ setIsLandscape(true);
+ }
+ }, [height, width]);
+ return (
+
+ {children}
+
+ );
+};