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-08 19:18:28 +09:00
parent 49e9ed14bc
commit cb2562fe9c
2 changed files with 84 additions and 52 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

99
components/ActionSheetComponents/EachTrainInfo.js
View File

@ -460,13 +460,12 @@ export const EachTrainInfo = (props) => {
openTrainInfo={openTrainInfo}
/>
)}
<ScrollView
{...scrollHandlers}
style={{
backgroundColor: "white",
}}
stickyHeaderIndices={[0]}
stickyHeaderIndices={[1]}
scrollEventThrottle={16}
onScroll={Animated.event(
[{ nativeEvent: { contentOffset: { y: scrollOffsetY } } }],
@ -475,56 +474,72 @@ export const EachTrainInfo = (props) => {
>
<View
style={{
alignItems: "center",
backgroundColor: "white",
flexDirection: "row",
height: from == "AllTrainDiagramView" ? 0 : 120,
flexDirection: "column",
}}
index={0}
/>
<View
style={{
height: from == "AllTrainDiagramView" ? "auto" : 120,
flexDirection: "column",
}}
index={1}
>
<View style={{ flex: 1 }} />
<View
style={{
padding: 8,
alignItems: "center",
backgroundColor: "white",
flexDirection: "row",
borderBottomWidth: 1,
borderBottomColor: "#f0f0f0",
flex: 1,
}}
index={0}
>
<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
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>
</View>
{headStation && !isConcatNear && (
<TouchableOpacity
onPress={() => openBackTrainInfo(headStation)}

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

@ -1,6 +1,10 @@
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;
@ -13,28 +17,36 @@ export const DynamicHeader = ({
openTrainInfo,
}) => {
const animatedHeaderHeight = animHeaderValue.interpolate({
inputRange: [0, Scroll_Distance],
inputRange: [Min_Header_Height, Scroll_Distance],
outputRange: [Max_Header_Height, 0],
extrapolate: "clamp",
});
const animatedHeaderHeight2 = animHeaderValue.interpolate({
inputRange: [0, Scroll_Distance],
outputRange: [0, Min_Header_Height],
outputRange: [Max_Header_Height, Min_Header_Height],
extrapolate: "clamp",
});
const animateHeaderBackgroundColor = animHeaderValue.interpolate({
inputRange: [0, Max_Header_Height - Min_Header_Height],
outputRange: ["blue", "red"],
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: animatedHeaderHeight,
// backgroundColor: animateHeaderBackgroundColor,
height: 200,
backgroundColor: "#0099CC",
opacity: animatedHeaderVisible,
top: 0,
},
]}
>
@ -145,8 +157,10 @@ export const DynamicHeader = ({
styles.header,
{
height: animatedHeaderHeight2,
//backgroundColor: animateHeaderBackgroundColor,
backgroundColor: "#0099CC",
margin: 0,
top: 0,
opacity: animatedHeaderVisible2,
},
]}
>
@ -254,7 +268,7 @@ export const DynamicHeader = ({
</View> */}
</ScrollView>
</Animated.View>
</>
</View>
);
};
const styles = StyleSheet.create({
@ -264,6 +278,9 @@ const styles = StyleSheet.create({
left: 0,
right: 0,
//paddingTop: 10,
position: "absolute",
zIndex: 1,
backgroundColor: "f0f0f0",
},
headerText: {
color: "#fff",