From f263dde61c6c125275dca0169cf214ad800f6ff6 Mon Sep 17 00:00:00 2001 From: harukin-expo-dev-env Date: Sun, 24 Mar 2024 17:23:20 +0000 Subject: [PATCH] =?UTF-8?q?=E5=8F=AF=E8=AA=AD=E6=80=A7=E3=82=92=E4=B8=8A?= =?UTF-8?q?=E3=81=92=E3=82=8B=E5=A4=89=E6=9B=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../EachTrainInfoCore.js | 85 +++++++++---------- components/DynamicHeaderScrollView.js | 33 +++++-- 2 files changed, 67 insertions(+), 51 deletions(-) diff --git a/components/ActionSheetComponents/EachTrainInfoCore.js b/components/ActionSheetComponents/EachTrainInfoCore.js index 84956a1..3c49f66 100644 --- a/components/ActionSheetComponents/EachTrainInfoCore.js +++ b/components/ActionSheetComponents/EachTrainInfoCore.js @@ -1,4 +1,4 @@ -import React, { useEffect, useState } from "react"; +import React, { useEffect, useMemo, useState } from "react"; import { View, LayoutAnimation, @@ -9,7 +9,7 @@ import { BackHandler, } from "react-native"; import { Ionicons } from "@expo/vector-icons"; -import { SheetManager, useScrollHandlers } from "react-native-actions-sheet"; +import { SheetManager } from "react-native-actions-sheet"; import { AS } from "../../storageControl"; import trainList from "../../assets/originData/trainList"; import { lineList } from "../../lib/getStationList"; @@ -50,7 +50,6 @@ export const EachTrainInfoCore = ({ // const [actionSheetHorizonalScroll, setActionSheetHorizonalScroll] = useState(false); useEffect(() => { - console.log(currentTrain.length); if (!currentTrain.length) return; setCurrentTrainData( checkDuplicateTrainData( @@ -80,9 +79,6 @@ export const EachTrainInfoCore = ({ const [trainPositionSwitch, setTrainPositionSwitch] = useState("false"); const [currentPosition, setCurrentPosition] = useState([]); const [trainData, setTrainData] = useState([]); - const scrollHandlers = actionSheetRef - ? useScrollHandlers("scrollview-1", actionSheetRef) - : null; const stationList = originalStationList && @@ -112,6 +108,28 @@ export const EachTrainInfoCore = ({ trainPositionSwitch == "true" ? findReversalPoints(currentPosition, stopStationIDList) : []; + const trainName = useMemo(() => { + if (!data.limited) return ""; + const limitedArray = data.limited.split(":"); + const type = getTrainType(limitedArray[0]); + + switch (true) { + case limitedArray[1]: + // 特急の場合は、列車名を取得 + return type + migrateTrainName(limitedArray[1]); + case trainData.length == 0: + // 特急以外の場合は、列車番号を取得 + return type; + default: + // 行先がある場合は、行先を取得 + return ( + type + + migrateTrainName( + trainData[trainData.length - 1].split(",")[0] + "行き" + ) + ); + } + }, [data.limited, trainData]); const { height, width } = useWindowDimensions(); const { isLandscape } = useDeviceOrientationChange(); @@ -223,10 +241,6 @@ export const EachTrainInfoCore = ({ }); } }; - const viewHeader = - from == "AllTrainDiagramView" || - from == "NearTrainDiagramView" || - from == "LED2"; return ( - {data.limited - ? getType(data.limited.split(":")[0]) + - migrateTrainName( - data.limited.split(":")[1] || - (trainData.length > 0 - ? trainData[trainData.length - 1].split(",")[0] + "行き" - : " ") - ) - : ""} + {trainName} @@ -289,40 +295,31 @@ export const EachTrainInfoCore = ({ )} - ) : ( - - ) + } longHeader={ - viewHeader ? ( - <> - ) : ( - - ) + } topStickyContent={ diff --git a/components/DynamicHeaderScrollView.js b/components/DynamicHeaderScrollView.js index 6845a69..e6f652b 100644 --- a/components/DynamicHeaderScrollView.js +++ b/components/DynamicHeaderScrollView.js @@ -1,20 +1,39 @@ import { ScrollView, View, Animated, LayoutAnimation } from "react-native"; -import React, { useState } from "react"; +import React, { useMemo, useState } from "react"; +import { useScrollHandlers } from "react-native-actions-sheet"; export const DynamicHeaderScrollView = (props) => { const { - Max_Header_Height = 200, - Min_Header_Height = 80, children, - scrollViewProps = {}, + actionSheetRef = {}, containerProps = {}, shortHeader = <>, longHeader = <>, topStickyContent, styles, + from, } = props; + const viewHeader = useMemo(() => { + switch (from) { + case "AllTrainDiagramView": + case "NearTrainDiagramView": + case "LED2": + return true; + default: + return false; + } + }, [from]); + + const Max_Header_Height = viewHeader ? 0 : 200; + const Min_Header_Height = viewHeader ? 0 : 80; + const Scroll_Distance = Max_Header_Height - Min_Header_Height; + + const scrollHandlers = actionSheetRef + ? useScrollHandlers("scrollview-1", actionSheetRef) + : null; + const shotHeaderStyle = { on: { height: Min_Header_Height, @@ -86,7 +105,7 @@ export const DynamicHeaderScrollView = (props) => { headerVisible ? shotHeaderStyle.on : shotHeaderStyle.off, ]} > - {shortHeader} + {viewHeader ? <> : shortHeader} { headerVisible ? longHeaderStyle.off : longHeaderStyle.on, ]} > - {longHeader} + {viewHeader ? <> : longHeader} {topStickyContent}