harukin/jrshikoku
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

とりあえずこれでビルド

Browse Source
This commit is contained in:
harukin-OneMix4
2024-02-12 00:51:47 +09:00
parent 93529f4f7d
commit 72412e87e8
4 changed files with 282 additions and 106 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
Apps.js
View File

@@ -32,9 +32,6 @@ export default function Apps({ navigation, webview, stationData }) {
const [isLandscape, setIsLandscape] = useState(false); //画面が横向きかどうか const [isLandscape, setIsLandscape] = useState(false); //画面が横向きかどうか
const handleLayout = () => {}; const handleLayout = () => {};
useEffect(() => { useEffect(() => {
console.log("レイアウト変更");
console.log(height, width);
console.log(height / width);
if (height / width > 1.5) { if (height / width > 1.5) {
setIsLandscape(false); setIsLandscape(false);
} }

324
components/ActionSheetComponents/EachTrainInfo.js
View File

@@ -6,9 +6,13 @@ import {
TouchableOpacity, TouchableOpacity,
Platform, Platform,
StyleSheet, StyleSheet,
useWindowDimensions,
} from "react-native"; } from "react-native";
import { Ionicons } from "@expo/vector-icons"; import { Ionicons } from "@expo/vector-icons";
import ActionSheet, { SheetManager } from "react-native-actions-sheet"; import ActionSheet, {
SheetManager,
useScrollHandlers,
} from "react-native-actions-sheet";
import { AS } from "../../storageControl"; import { AS } from "../../storageControl";
import trainList from "../../assets/originData/trainList"; import trainList from "../../assets/originData/trainList";
import { lineList } from "../../lib/getStationList"; import { lineList } from "../../lib/getStationList";
@@ -24,6 +28,7 @@ import { DynamicHeaderScrollView } from "../DynamicHeaderScrollView";
import { LongHeader } from "./EachTrainInfo/LongHeader"; import { LongHeader } from "./EachTrainInfo/LongHeader";
import { ShortHeader } from "./EachTrainInfo/ShortHeader"; import { ShortHeader } from "./EachTrainInfo/ShortHeader";
import { ScrollStickyContent } from "./EachTrainInfo/ScrollStickyContent"; import { ScrollStickyContent } from "./EachTrainInfo/ScrollStickyContent";
import { LandscapeTrainInfo } from "./EachTrainInfo/LandscapeTrainInfo";
export const EachTrainInfo = (props) => { export const EachTrainInfo = (props) => {
if (!props.payload) return <></>; if (!props.payload) return <></>;
@@ -47,6 +52,16 @@ export const EachTrainInfo = (props) => {
const [isConcatNear, setIsConcatNear] = useState(false); const [isConcatNear, setIsConcatNear] = useState(false);
const [tailStation, setTailStation] = useState(); const [tailStation, setTailStation] = useState();
const [headStation, setHeadStation] = useState(); const [headStation, setHeadStation] = useState();
const { height, width } = useWindowDimensions();
const [isLandscape, setIsLandscape] = useState(false);
useEffect(() => {
if (height / width > 1.5) {
setIsLandscape(false);
}
if (height / width < 1.5) {
setIsLandscape(true);
}
}, [width, height]);
// const [actionSheetHorizonalScroll, setActionSheetHorizonalScroll] = useState(false); // const [actionSheetHorizonalScroll, setActionSheetHorizonalScroll] = useState(false);
//裏列車探索 //裏列車探索
@@ -376,6 +391,7 @@ export const EachTrainInfo = (props) => {
.replace("ライナーライナー", "ライナー"); .replace("ライナーライナー", "ライナー");
}; };
const actionSheetRef = useRef(null); const actionSheetRef = useRef(null);
const scrollHandlers = useScrollHandlers("scrollview-1", actionSheetRef);
return ( return (
<ActionSheet <ActionSheet
gestureEnabled={true} gestureEnabled={true}
@@ -384,6 +400,7 @@ export const EachTrainInfo = (props) => {
ref={actionSheetRef} ref={actionSheetRef}
drawUnderStatusBar={false} drawUnderStatusBar={false}
isModal={Platform.OS == "ios"} isModal={Platform.OS == "ios"}
//useBottomSafeAreaPadding={Platform.OS == "android"} //useBottomSafeAreaPadding={Platform.OS == "android"}
> >
<View <View
@@ -445,60 +462,46 @@ export const EachTrainInfo = (props) => {
/> />
)} )}
</View> </View>
<DynamicHeaderScrollView {isLandscape ? (
styles={styles} <LandscapeTrainInfo
containerProps={{ style: { maxHeight: heightPercentageToDP("70%") } }} scrollHandlers={scrollHandlers}
Max_Header_Height={from == "AllTrainDiagramView" ? 0 : 200} leftContent={
Min_Header_Height={from == "AllTrainDiagramView" ? 0 : 80} from == "AllTrainDiagramView" ? (
shortHeader={ <></>
from == "AllTrainDiagramView" ? ( ) : (
<></> <LongHeader
) : ( currentTrainData={currentTrainData}
<ShortHeader currentPosition={currentPosition}
currentTrainData={currentTrainData} nearTrainIDList={nearTrainIDList}
currentPosition={currentPosition} openTrainInfo={openTrainInfo}
nearTrainIDList={nearTrainIDList} />
openTrainInfo={openTrainInfo} )
/> }
) topStickyContent={
} <ScrollStickyContent currentTrainData={currentTrainData} />
longHeader={ }
from == "AllTrainDiagramView" ? ( >
<></> {headStation && !isConcatNear && (
) : ( <TouchableOpacity
<LongHeader onPress={() => openBackTrainInfo(headStation)}
currentTrainData={currentTrainData} style={{
currentPosition={currentPosition} padding: 10,
nearTrainIDList={nearTrainIDList} flexDirection: "row",
openTrainInfo={openTrainInfo} borderColor: "blue",
/> borderWidth: 1,
) margin: 10,
} borderRadius: 5,
topStickyContent={ alignItems: "center",
<ScrollStickyContent currentTrainData={currentTrainData} /> }}
}
>
{headStation && !isConcatNear && (
<TouchableOpacity
onPress={() => openBackTrainInfo(headStation)}
style={{
padding: 10,
flexDirection: "row",
borderColor: "blue",
borderWidth: 1,
margin: 10,
borderRadius: 5,
alignItems: "center",
}}
>
<Text
style={{ fontSize: 18, fontWeight: "bold", color: "black" }}
> >
「本当の始発駅」を表示 <Text
</Text> style={{ fontSize: 18, fontWeight: "bold", color: "black" }}
</TouchableOpacity> >
)} 「本当の始発駅」を表示
{/* <LottieView </Text>
</TouchableOpacity>
)}
{/* <LottieView
autoPlay autoPlay
loop loop
style={{ width: 150, height: 150, backgroundColor: "#fff" }} style={{ width: 150, height: 150, backgroundColor: "#fff" }}
@@ -506,56 +509,175 @@ export const EachTrainInfo = (props) => {
/> />
<Text>ほげほげふがふが</Text> */} <Text>ほげほげふがふが</Text> */}
{trainData.map((i, index) => {trainData.map((i, index) =>
i.split(",")[1] == "提" ? ( i.split(",")[1] == "提" ? (
<DataFromButton i={i} /> <DataFromButton i={i} />
) : ( ) : (
<EachStopList <EachStopList
i={i} i={i}
index={index} index={index}
stationList={stationList} stationList={stationList}
points={points} points={points}
currentTrainData={currentTrainData} currentTrainData={currentTrainData}
openStationACFromEachTrainInfo={openStationACFromEachTrainInfo} openStationACFromEachTrainInfo={
/> openStationACFromEachTrainInfo
) }
)} />
{tailStation && !isConcatNear && ( )
<TouchableOpacity )}
onPress={() => openBackTrainInfo(tailStation)} {tailStation && !isConcatNear && (
style={{ <TouchableOpacity
padding: 10, onPress={() => openBackTrainInfo(tailStation)}
flexDirection: "row", style={{
borderColor: "blue", padding: 10,
borderWidth: 1, flexDirection: "row",
margin: 10, borderColor: "blue",
borderRadius: 5, borderWidth: 1,
alignItems: "center", margin: 10,
}} borderRadius: 5,
> alignItems: "center",
<Text }}
style={{ fontSize: 18, fontWeight: "bold", color: "black" }}
> >
「本当の終着駅」を表示 <Text
</Text> style={{ fontSize: 18, fontWeight: "bold", color: "black" }}
</TouchableOpacity> >
)} 「本当の終着駅」を表示
</Text>
</TouchableOpacity>
)}
<View style={{ flexDirection: "row" }}> <View style={{ flexDirection: "row" }}>
<View <View
style={{ style={{
padding: 8, padding: 8,
flexDirection: "row", flexDirection: "row",
borderBottomWidth: 1, borderBottomWidth: 1,
borderBottomColor: "#f0f0f0", borderBottomColor: "#f0f0f0",
flex: 1, flex: 1,
}} }}
> >
<Text style={{ fontSize: 20 }}> </Text> <Text style={{ fontSize: 20 }}> </Text>
<View style={{ flex: 1 }} /> <View style={{ flex: 1 }} />
</View>
</View> </View>
</View> </LandscapeTrainInfo>
</DynamicHeaderScrollView> ) : (
<DynamicHeaderScrollView
styles={styles}
containerProps={{
style: { maxHeight: heightPercentageToDP("70%") },
}}
Max_Header_Height={from == "AllTrainDiagramView" ? 0 : 200}
Min_Header_Height={from == "AllTrainDiagramView" ? 0 : 80}
shortHeader={
from == "AllTrainDiagramView" ? (
<></>
) : (
<ShortHeader
currentTrainData={currentTrainData}
currentPosition={currentPosition}
nearTrainIDList={nearTrainIDList}
openTrainInfo={openTrainInfo}
/>
)
}
longHeader={
from == "AllTrainDiagramView" ? (
<></>
) : (
<LongHeader
currentTrainData={currentTrainData}
currentPosition={currentPosition}
nearTrainIDList={nearTrainIDList}
openTrainInfo={openTrainInfo}
/>
)
}
topStickyContent={
<ScrollStickyContent currentTrainData={currentTrainData} />
}
>
{headStation && !isConcatNear && (
<TouchableOpacity
onPress={() => openBackTrainInfo(headStation)}
style={{
padding: 10,
flexDirection: "row",
borderColor: "blue",
borderWidth: 1,
margin: 10,
borderRadius: 5,
alignItems: "center",
}}
>
<Text
style={{ fontSize: 18, fontWeight: "bold", color: "black" }}
>
「本当の始発駅」を表示
</Text>
</TouchableOpacity>
)}
{/* <LottieView
autoPlay
loop
style={{ width: 150, height: 150, backgroundColor: "#fff" }}
source={require("../../assets/51690-loading-diamonds.json")}
/>
<Text>ほげほげふがふが</Text> */}
{trainData.map((i, index) =>
i.split(",")[1] == "提" ? (
<DataFromButton i={i} />
) : (
<EachStopList
i={i}
index={index}
stationList={stationList}
points={points}
currentTrainData={currentTrainData}
openStationACFromEachTrainInfo={
openStationACFromEachTrainInfo
}
/>
)
)}
{tailStation && !isConcatNear && (
<TouchableOpacity
onPress={() => openBackTrainInfo(tailStation)}
style={{
padding: 10,
flexDirection: "row",
borderColor: "blue",
borderWidth: 1,
margin: 10,
borderRadius: 5,
alignItems: "center",
}}
>
<Text
style={{ fontSize: 18, fontWeight: "bold", color: "black" }}
>
「本当の終着駅」を表示
</Text>
</TouchableOpacity>
)}
<View style={{ flexDirection: "row" }}>
<View
style={{
padding: 8,
flexDirection: "row",
borderBottomWidth: 1,
borderBottomColor: "#f0f0f0",
flex: 1,
}}
>
<Text style={{ fontSize: 20 }}> </Text>
<View style={{ flex: 1 }} />
</View>
</View>
</DynamicHeaderScrollView>
)}
</View> </View>
</ActionSheet> </ActionSheet>
); );

47
components/ActionSheetComponents/EachTrainInfo/LandscapeTrainInfo.js Normal file
View File

@@ -0,0 +1,47 @@
import React from "react";
import { View, Text, ScrollView, useWindowDimensions } from "react-native";
export const LandscapeTrainInfo = (props) => {
const { leftContent, topStickyContent, children, scrollHandlers } = props;
const { height, width } = useWindowDimensions();
return (
<View
style={{
flexDirection: "row",
backgroundColor: "blue",
width: width,
height: (height / 100) * 70,
marginBottom: 50,
}}
>
<View
style={{
flexDirection: "column",
height: (height / 100) * 70,
width: width / 2,
}}
>
<Text>{width / 2}</Text>
{leftContent}
</View>
<ScrollView
{...scrollHandlers}
style={{
width: width / 2,
height: "auto",
}}
stickyHeaderIndices={[1]}
scrollEventThrottle={16}
onScroll={(d) => {
console.log(d.nativeEvent.contentOffset.y);
}}
>
<View style={{ height: 0 }} />
<View style={{ flexDirection: "column" }} index={1}>
{topStickyContent}
</View>
{children}
</ScrollView>
</View>
);
};

14
components/ActionSheetComponents/EachTrainInfo/TrainDataView.js
View File

@@ -1,4 +1,4 @@
import React from "react"; import React, { useEffect, useState } from "react";
import { import {
View, View,
Text, Text,
@@ -18,14 +18,24 @@ export const TrainDataView = ({
openTrainInfo, openTrainInfo,
mode = 0, mode = 0,
}) => { }) => {
const [isLandscape, setIsLandscape] = useState(false);
const { width, height } = useWindowDimensions(); const { width, height } = useWindowDimensions();
useEffect(() => {
if (height / width > 1.5) {
setIsLandscape(false);
}
if (height / width < 1.5) {
setIsLandscape(true);
}
}, [width, height]);
return ( return (
<View <View
style={{ style={{
flexDirection: "row", flexDirection: "row",
//minHeight: 200, //minHeight: 200,
//height: heightPercentageToDP("20%"), //height: heightPercentageToDP("20%"),
width: width, width: isLandscape ? width / 2 : width,
flex: 1, flex: 1,
}} }}
> >