デザイン小調整
This commit is contained in:
harukin-OneMix4
parent
60d8caaefa
commit
9e7931926f
9
Apps.js
9
Apps.js
@ -6,9 +6,7 @@ import { Ionicons } from "@expo/vector-icons";
|
||||
import { AS } from "./storageControl";
|
||||
import { news } from "./config/newsUpdate";
|
||||
import { getStationList, lineList } from "./lib/getStationList";
|
||||
import { StationDeteilView } from "./components/ActionSheetComponents/StationDeteilView";
|
||||
import { injectJavascriptData } from "./lib/webViewInjectjavascript";
|
||||
import { EachTrainInfo } from "./components/ActionSheetComponents/EachTrainInfo";
|
||||
import { checkDuplicateTrainData } from "./lib/checkDuplicateTrainData";
|
||||
import { useFavoriteStation } from "./stateBox/useFavoriteStation";
|
||||
import { useCurrentTrain } from "./stateBox/useCurrentTrain";
|
||||
@ -322,13 +320,6 @@ export default function Apps({ navigation, webview, stationData }) {
|
||||
top={Platform.OS == "ios" ? Constants.statusBarHeight : 0}
|
||||
LoadError={LoadError}
|
||||
/>
|
||||
|
||||
<EachTrainInfo
|
||||
data={trainInfo}
|
||||
navigate={navigate}
|
||||
originalStationList={originalStationList}
|
||||
openStationACFromEachTrainInfo={openStationACFromEachTrainInfo}
|
||||
/>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
|
||||
@ -263,6 +263,7 @@ export const EachTrainInfo = (props) => {
|
||||
gestureEnabled={isTop}
|
||||
CustomHeaderComponent={<></>}
|
||||
ref={actionSheetRef}
|
||||
drawUnderStatusBar={false}
|
||||
>
|
||||
<View
|
||||
style={{
|
||||
@ -525,6 +526,57 @@ export const EachTrainInfo = (props) => {
|
||||
</View> */}
|
||||
</ScrollView>
|
||||
)}
|
||||
<View
|
||||
style={{
|
||||
alignItems: "center",
|
||||
backgroundColor: "white",
|
||||
flexDirection: "row",
|
||||
}}
|
||||
>
|
||||
<View
|
||||
style={{
|
||||
padding: 8,
|
||||
flexDirection: "row",
|
||||
borderBottomWidth: 1,
|
||||
borderBottomColor: "#f0f0f0",
|
||||
flex: 1,
|
||||
}}
|
||||
>
|
||||
<Text style={{ fontSize: 20 }}>停車駅</Text>
|
||||
<View style={{ flex: 1 }} />
|
||||
<View style={{ flexDirection: "row" }}>
|
||||
{!isNaN(currentTrainData?.delay) &&
|
||||
currentTrainData?.delay != 0 && (
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 15,
|
||||
color: "black",
|
||||
position: "absolute",
|
||||
right: 110,
|
||||
textAlign: "right",
|
||||
textDecorationLine: "line-through",
|
||||
}}
|
||||
>
|
||||
(定刻)
|
||||
</Text>
|
||||
)}
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 20,
|
||||
color: isNaN(currentTrainData?.delay)
|
||||
? "black"
|
||||
: currentTrainData?.delay == 0
|
||||
? "black"
|
||||
: "red",
|
||||
width: 60,
|
||||
}}
|
||||
>
|
||||
見込
|
||||
</Text>
|
||||
<Text style={{ fontSize: 20, width: 50 }}></Text>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
<ScrollView
|
||||
{...scrollHandlers}
|
||||
style={{
|
||||
@ -532,211 +584,164 @@ export const EachTrainInfo = (props) => {
|
||||
from == "AllTrainDiagramView" ? "70%" : "50%"
|
||||
),
|
||||
}}
|
||||
nestedScrollEnabled
|
||||
onScroll={(e) => {
|
||||
if (!Platform.OS !== "android") return;
|
||||
setIsTop(e.nativeEvent.contentOffset.y < 0);
|
||||
}}
|
||||
>
|
||||
<View style={{ padding: 10, backgroundColor: "white" }}>
|
||||
<View style={{ alignItems: "center" }}>
|
||||
{/* <LottieView
|
||||
<View style={{ backgroundColor: "white", alignItems: "center" }}>
|
||||
{/* <LottieView
|
||||
autoPlay
|
||||
loop
|
||||
style={{ width: 150, height: 150, backgroundColor: "#fff" }}
|
||||
source={require("../../assets/51690-loading-diamonds.json")}
|
||||
/>
|
||||
<Text>ほげほげふがふが</Text> */}
|
||||
<View style={{ flexDirection: "row" }}>
|
||||
<View
|
||||
style={{
|
||||
padding: 8,
|
||||
flexDirection: "row",
|
||||
borderBottomWidth: 1,
|
||||
borderBottomColor: "#f0f0f0",
|
||||
flex: 1,
|
||||
}}
|
||||
|
||||
{trainData.map((i, index) => {
|
||||
const [station, se, time] = i.split(",");
|
||||
const Stations = stationList.map((a) =>
|
||||
a.filter((d) => d.StationName == station)
|
||||
);
|
||||
const StationNumbers =
|
||||
Stations &&
|
||||
Stations.reduce((newArray, e) => {
|
||||
return newArray.concat(e);
|
||||
}, [])
|
||||
.filter((d) => d.StationNumber)
|
||||
.map((d) => d.StationNumber);
|
||||
|
||||
const colorIDs =
|
||||
StationNumbers != null
|
||||
? StationNumbers.map((d) => {
|
||||
return d.split("").filter((s) => "A" < s && s < "Z");
|
||||
}).reduce((newArray, e) => {
|
||||
return newArray.concat(e);
|
||||
}, [])
|
||||
: [];
|
||||
const EachIDs =
|
||||
StationNumbers != null
|
||||
? StationNumbers.map((d) => {
|
||||
return d
|
||||
.split("")
|
||||
.filter((s) => "0" <= s && s <= "9")
|
||||
.join("");
|
||||
})
|
||||
: [];
|
||||
const date = new Date();
|
||||
if (time) {
|
||||
date.setHours(time.split(":")[0], time.split(":")[1]);
|
||||
}
|
||||
if (!isNaN(currentTrainData?.delay)) {
|
||||
date.setMinutes(date.getMinutes() + currentTrainData?.delay);
|
||||
}
|
||||
const timeString = date.toTimeString().split(" ")[0].split(":");
|
||||
return (
|
||||
<TouchableWithoutFeedback
|
||||
onPress={() => openStationACFromEachTrainInfo(station)}
|
||||
key={station}
|
||||
>
|
||||
<Text style={{ fontSize: 20 }}>停車駅</Text>
|
||||
<View style={{ flex: 1 }} />
|
||||
<View style={{ flexDirection: "row" }}>
|
||||
{!isNaN(currentTrainData?.delay) &&
|
||||
currentTrainData?.delay != 0 && (
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 15,
|
||||
color: "black",
|
||||
position: "absolute",
|
||||
right: 110,
|
||||
textAlign: "right",
|
||||
textDecorationLine: "line-through",
|
||||
}}
|
||||
>
|
||||
(定刻)
|
||||
</Text>
|
||||
)}
|
||||
<Text
|
||||
<View
|
||||
style={{
|
||||
fontSize: 20,
|
||||
color: isNaN(currentTrainData?.delay)
|
||||
? "black"
|
||||
: currentTrainData?.delay == 0
|
||||
? "black"
|
||||
: "red",
|
||||
width: 60,
|
||||
width: 35,
|
||||
position: "relative",
|
||||
marginHorizontal: 15,
|
||||
flexDirection: "row",
|
||||
height: "101%",
|
||||
}}
|
||||
>
|
||||
見込
|
||||
</Text>
|
||||
<Text style={{ fontSize: 20, width: 50 }}></Text>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
{trainData.map((i, index) => {
|
||||
const [station, se, time] = i.split(",");
|
||||
const Stations = stationList.map((a) =>
|
||||
a.filter((d) => d.StationName == station)
|
||||
);
|
||||
const StationNumbers =
|
||||
Stations &&
|
||||
Stations.reduce((newArray, e) => {
|
||||
return newArray.concat(e);
|
||||
}, [])
|
||||
.filter((d) => d.StationNumber)
|
||||
.map((d) => d.StationNumber);
|
||||
|
||||
const colorIDs =
|
||||
StationNumbers != null
|
||||
? StationNumbers.map((d) => {
|
||||
return d.split("").filter((s) => "A" < s && s < "Z");
|
||||
}).reduce((newArray, e) => {
|
||||
return newArray.concat(e);
|
||||
}, [])
|
||||
: [];
|
||||
const EachIDs =
|
||||
StationNumbers != null
|
||||
? StationNumbers.map((d) => {
|
||||
return d
|
||||
.split("")
|
||||
.filter((s) => "0" <= s && s <= "9")
|
||||
.join("");
|
||||
})
|
||||
: [];
|
||||
const date = new Date();
|
||||
if (time) {
|
||||
date.setHours(time.split(":")[0], time.split(":")[1]);
|
||||
}
|
||||
if (!isNaN(currentTrainData?.delay)) {
|
||||
date.setMinutes(date.getMinutes() + currentTrainData?.delay);
|
||||
}
|
||||
const timeString = date.toTimeString().split(" ")[0].split(":");
|
||||
return (
|
||||
<TouchableWithoutFeedback
|
||||
onPress={() => openStationACFromEachTrainInfo(station)}
|
||||
key={station}
|
||||
>
|
||||
<View style={{ flexDirection: "row" }}>
|
||||
<View
|
||||
style={{
|
||||
width: 35,
|
||||
position: "relative",
|
||||
marginHorizontal: 15,
|
||||
flexDirection: "row",
|
||||
height: "101%",
|
||||
}}
|
||||
>
|
||||
{colorIDs.map((color, index) => (
|
||||
<View
|
||||
style={{
|
||||
backgroundColor: lineColorList[color],
|
||||
flex: 1,
|
||||
}}
|
||||
key={color}
|
||||
>
|
||||
<View style={{ flex: 1 }} />
|
||||
<Text
|
||||
style={{
|
||||
color: "white",
|
||||
textAlign: "center",
|
||||
fontSize: 10,
|
||||
fontWeight: "bold",
|
||||
}}
|
||||
>
|
||||
{colorIDs[index]}
|
||||
</Text>
|
||||
<Text
|
||||
style={{
|
||||
color: "white",
|
||||
textAlign: "center",
|
||||
fontSize: 10,
|
||||
fontWeight: "bold",
|
||||
}}
|
||||
>
|
||||
{EachIDs[index]}
|
||||
</Text>
|
||||
<View style={{ flex: 1 }} />
|
||||
</View>
|
||||
))}
|
||||
</View>
|
||||
<View
|
||||
style={{
|
||||
padding: 8,
|
||||
flexDirection: "row",
|
||||
borderBottomWidth: 1,
|
||||
borderBottomColor: "#f0f0f0",
|
||||
flex: 1,
|
||||
}}
|
||||
>
|
||||
<Text style={{ fontSize: 20 }}>{station}</Text>
|
||||
<View style={{ flex: 1 }} />
|
||||
{points && points.findIndex((d) => d == index) >= 0 ? (
|
||||
{colorIDs.map((color, index) => (
|
||||
<View
|
||||
style={{
|
||||
backgroundColor: lineColorList[color],
|
||||
flex: 1,
|
||||
}}
|
||||
key={color}
|
||||
>
|
||||
<View style={{ flex: 1 }} />
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 20,
|
||||
marginRight: 70,
|
||||
color: "white",
|
||||
textAlign: "center",
|
||||
fontSize: 10,
|
||||
fontWeight: "bold",
|
||||
}}
|
||||
>
|
||||
🚊
|
||||
{colorIDs[index]}
|
||||
</Text>
|
||||
) : null}
|
||||
{!isNaN(currentTrainData?.delay) &&
|
||||
currentTrainData?.delay != 0 && (
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 15,
|
||||
color: "black",
|
||||
width: 60,
|
||||
position: "absolute",
|
||||
right: 120,
|
||||
textAlign: "right",
|
||||
textDecorationLine: "line-through",
|
||||
}}
|
||||
>
|
||||
{time}
|
||||
</Text>
|
||||
)}
|
||||
<Text
|
||||
style={{
|
||||
color: "white",
|
||||
textAlign: "center",
|
||||
fontSize: 10,
|
||||
fontWeight: "bold",
|
||||
}}
|
||||
>
|
||||
{EachIDs[index]}
|
||||
</Text>
|
||||
<View style={{ flex: 1 }} />
|
||||
</View>
|
||||
))}
|
||||
</View>
|
||||
<View
|
||||
style={{
|
||||
padding: 8,
|
||||
flexDirection: "row",
|
||||
borderBottomWidth: 1,
|
||||
borderBottomColor: "#f0f0f0",
|
||||
flex: 1,
|
||||
}}
|
||||
>
|
||||
<Text style={{ fontSize: 20 }}>{station}</Text>
|
||||
<View style={{ flex: 1 }} />
|
||||
{points && points.findIndex((d) => d == index) >= 0 ? (
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 20,
|
||||
color: isNaN(currentTrainData?.delay)
|
||||
? "black"
|
||||
: currentTrainData?.delay == 0
|
||||
? "black"
|
||||
: "red",
|
||||
width: 60,
|
||||
marginRight: 70,
|
||||
}}
|
||||
>
|
||||
{timeString[0]}:{timeString[1]}
|
||||
🚊
|
||||
</Text>
|
||||
<Text style={{ fontSize: 18, width: 50 }}>
|
||||
{se?.replace("発", "出発").replace("着", "到着")}
|
||||
</Text>
|
||||
</View>
|
||||
) : null}
|
||||
{!isNaN(currentTrainData?.delay) &&
|
||||
currentTrainData?.delay != 0 && (
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 15,
|
||||
color: "black",
|
||||
width: 60,
|
||||
position: "absolute",
|
||||
right: 120,
|
||||
textAlign: "right",
|
||||
textDecorationLine: "line-through",
|
||||
}}
|
||||
>
|
||||
{time}
|
||||
</Text>
|
||||
)}
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 20,
|
||||
color: isNaN(currentTrainData?.delay)
|
||||
? "black"
|
||||
: currentTrainData?.delay == 0
|
||||
? "black"
|
||||
: "red",
|
||||
width: 60,
|
||||
}}
|
||||
>
|
||||
{timeString[0]}:{timeString[1]}
|
||||
</Text>
|
||||
<Text style={{ fontSize: 18, width: 50 }}>
|
||||
{se?.replace("発", "出発").replace("着", "到着")}
|
||||
</Text>
|
||||
</View>
|
||||
</TouchableWithoutFeedback>
|
||||
);
|
||||
})}
|
||||
</View>
|
||||
</View>
|
||||
</TouchableWithoutFeedback>
|
||||
);
|
||||
})}
|
||||
</View>
|
||||
</ScrollView>
|
||||
</View>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user