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-11 20:24:06 +09:00
parent 84c050e928
commit 62d7936425
2 changed files with 0 additions and 301 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
components/ActionSheetComponents/EachTrainInfo.js
View File

@ -26,7 +26,6 @@ import { useBusAndTrainData } from "../../stateBox/useBusAndTrainData";
import { EachStopList } from "./EachTrainInfo/EachStopList";
import { DataFromButton } from "./EachTrainInfo/DataFromButton";
import { TrainDataView } from "./EachTrainInfo/TrainDataView";
import { DynamicHeader } from "./EachTrainInfo/DynamicHeader";
import { DynamicHeaderScrollView } from "../DynamicHeaderScrollView";
export const EachTrainInfo = (props) => {
@ -511,15 +510,6 @@ export const EachTrainInfo = (props) => {
</ScrollView>
)
}
header={
<DynamicHeader
animHeaderValue={scrollOffsetY}
currentTrainData={currentTrainData}
currentPosition={currentPosition}
nearTrainIDList={nearTrainIDList}
openTrainInfo={openTrainInfo}
/>
}
topStickyContent={
<View
style={{

291
components/ActionSheetComponents/EachTrainInfo/DynamicHeader.js
View File

@ -1,291 +0,0 @@
import * as React from "react";
import { Text, View, StyleSheet, Animated, ScrollView } from "react-native";
import { TrainDataView } from "./TrainDataView";
import {
heightPercentageToDP,
widthPercentageToDP,
} from "react-native-responsive-screen";
const Max_Header_Height = 200;
const Min_Header_Height = 80;
const Scroll_Distance = Max_Header_Height - Min_Header_Height;
export const DynamicHeader = ({
animHeaderValue,
currentTrainData,
currentPosition,
nearTrainIDList,
openTrainInfo,
}) => {
const animatedHeaderHeight = animHeaderValue.interpolate({
inputRange: [Min_Header_Height, Scroll_Distance],
outputRange: [Max_Header_Height, 0],
extrapolate: "clamp",
});
const animatedHeaderHeight2 = animHeaderValue.interpolate({
inputRange: [0, Scroll_Distance],
outputRange: [Max_Header_Height, Min_Header_Height],
extrapolate: "clamp",
});
const animatedHeaderVisible = animHeaderValue.interpolate({
inputRange: [Min_Header_Height, Scroll_Distance],
outputRange: [1, 0],
extrapolate: "clamp",
});
const animatedHeaderVisible2 = animHeaderValue.interpolate({
inputRange: [Min_Header_Height, Scroll_Distance],
outputRange: [0, 1],
extrapolate: "clamp",
});
return (
<View style={{ position: "relative" }}>
<Animated.View
style={[
styles.header,
{
height: 200,
backgroundColor: "#0099CC",
opacity: animatedHeaderVisible,
top: 0,
},
]}
>
<ScrollView
//onTouchStart={() => setActionSheetHorizonalScroll(true)}
//onScrollEndDrag={() => setActionSheetHorizonalScroll(false)}
//onScrollBeginDrag={() => console.log("onScrollBeginDrag")}
style={{
flexDirection: "row",
//width: widthPercentageToDP("200%"),
// minHeight: 200,
//height: heightPercentageToDP("20%"),
}}
horizontal
pagingEnabled
>
<TrainDataView
currentTrainData={currentTrainData}
currentPosition={currentPosition}
nearTrainIDList={nearTrainIDList}
openTrainInfo={openTrainInfo}
/>
{/* <View
style={{
flexDirection: "column",
height: heightPercentageToDP("20%"),
flex: 1,
width: widthPercentageToDP("100%"),
}}
>
<View style={{ flex: 1, flexDirection: "row" }}>
<View
style={{
flex: 1,
backgroundColor: "white",
borderRadius: 10,
padding: 10,
margin: 10,
}}
>
<Text style={{ fontSize: 15, color: "#0099CC" }}>行先</Text>
<View style={{ flex: 1 }} />
<Text
style={{
fontSize: 20,
color: "#0099CC",
textAlign: "right",
}}
>
岡山
</Text>
</View>
<View
style={{
flex: 3,
backgroundColor: "white",
borderRadius: 10,
padding: 10,
margin: 10,
}}
>
<Text style={{ fontSize: 15, color: "#0099CC" }}>
車両案内
</Text>
<View style={{ flex: 1 }} />
<Text
style={{
fontSize: 20,
color: "#0099CC",
textAlign: "right",
}}
>
宇多津でうずしお号と連結
</Text>
</View>
</View>
<View style={{ flex: 1, flexDirection: "row" }}>
<View
style={{
flex: 1,
backgroundColor: "white",
borderRadius: 10,
padding: 10,
margin: 10,
}}
>
<Text style={{ fontSize: 15, color: "#0099CC" }}>
編成(使用車両：2700系)
</Text>
<View style={{ flex: 1 }} />
<Text
style={{
fontSize: 20,
color: "#0099CC",
textAlign: "left",
}}
>
{"[<自][自>][アン自|指>][アン指|G>]"}
</Text>
</View>
</View>
</View> */}
</ScrollView>
</Animated.View>
<Animated.View
style={[
styles.header,
{
height: animatedHeaderHeight2,
backgroundColor: "#0099CC",
margin: 0,
top: 0,
opacity: animatedHeaderVisible2,
},
]}
>
<ScrollView
//onTouchStart={() => setActionSheetHorizonalScroll(true)}
//onScrollEndDrag={() => setActionSheetHorizonalScroll(false)}
//onScrollBeginDrag={() => console.log("onScrollBeginDrag")}
style={{
flexDirection: "row",
flex: 1,
//width: widthPercentageToDP("200%"),
// minHeight: 200,
//height: heightPercentageToDP("20%"),
}}
horizontal
pagingEnabled
>
<TrainDataView
mode={2}
currentTrainData={currentTrainData}
currentPosition={currentPosition}
nearTrainIDList={nearTrainIDList}
openTrainInfo={openTrainInfo}
/>
{/* <View
style={{
flexDirection: "column",
height: heightPercentageToDP("20%"),
flex: 1,
width: widthPercentageToDP("100%"),
}}
>
<View style={{ flex: 1, flexDirection: "row" }}>
<View
style={{
flex: 1,
backgroundColor: "white",
borderRadius: 10,
padding: 10,
margin: 10,
}}
>
<Text style={{ fontSize: 15, color: "#0099CC" }}>行先</Text>
<View style={{ flex: 1 }} />
<Text
style={{
fontSize: 20,
color: "#0099CC",
textAlign: "right",
}}
>
岡山
</Text>
</View>
<View
style={{
flex: 3,
backgroundColor: "white",
borderRadius: 10,
padding: 10,
margin: 10,
}}
>
<Text style={{ fontSize: 15, color: "#0099CC" }}>
車両案内
</Text>
<View style={{ flex: 1 }} />
<Text
style={{
fontSize: 20,
color: "#0099CC",
textAlign: "right",
}}
>
宇多津でうずしお号と連結
</Text>
</View>
</View>
<View style={{ flex: 1, flexDirection: "row" }}>
<View
style={{
flex: 1,
backgroundColor: "white",
borderRadius: 10,
padding: 10,
margin: 10,
}}
>
<Text style={{ fontSize: 15, color: "#0099CC" }}>
編成(使用車両：2700系)
</Text>
<View style={{ flex: 1 }} />
<Text
style={{
fontSize: 20,
color: "#0099CC",
textAlign: "left",
}}
>
{"[<自][自>][アン自|指>][アン指|G>]"}
</Text>
</View>
</View>
</View> */}
</ScrollView>
</Animated.View>
</View>
);
};
const styles = StyleSheet.create({
header: {
justifyContent: "center",
alignItems: "center",
left: 0,
right: 0,
//paddingTop: 10,
position: "absolute",
zIndex: 1,
backgroundColor: "f0f0f0",
},
headerText: {
color: "#fff",
fontSize: 25,
fontWeight: "bold",
textAlign: "center",
},
});