スクロール範囲外にステータスを移動し、高さと文字サイズ等の調整

This commit is contained in:
harukin-OneMix4 2023-07-07 00:07:21 +09:00
parent dfe3c831bc
commit eb806e3f8a

View File

@ -122,49 +122,72 @@ export const EachTrainInfo = ({
/> />
)} )}
</View> </View>
<ScrollView <View
style={{ maxHeight: heightPercentageToDP("70%") }} style={{ flexDirection: "row", height: heightPercentageToDP("20%") }}
nestedScrollEnabled
onScroll={(e) => {
if (!Platform.OS !== "android") return;
setIsTop(e.nativeEvent.contentOffset.y < 0);
}}
> >
<View style={{ flexDirection: "row" }}>
<View <View
style={{ style={{
flex: 1, flex: 1,
backgroundColor: "black", backgroundColor: "white",
borderRadius: 10, borderRadius: 10,
padding: 10, padding: 10,
margin: 10, margin: 10,
}} }}
> >
<Text style={{ fontSize: 10, color: "white" }} t> <Text style={{ fontSize: 10, color: "#0099CC" }} t>
現在地 現在地
</Text> </Text>
<View style={{ flex: 1 }} /> <View style={{ flex: 1 }} />
{data.trainData?.Pos && data.trainData?.Pos.match("") ? (
<>
<Text <Text
style={{ fontSize: 30, color: "white", textAlign: "right" }} style={{
fontSize: 28,
color: "#0099CC",
textAlign: "right",
}}
>
{data.trainData?.Pos.split("")[0]}
</Text>
<Text style={{ color: "#0099CC", textAlign: "right" }}></Text>
<Text
style={{
fontSize: 28,
color: "#0099CC",
textAlign: "right",
}}
>
{data.trainData?.Pos.split("")[1]}
</Text>
</>
) : (
<Text
style={{ fontSize: 28, color: "#0099CC", textAlign: "right" }}
> >
{data.trainData?.Pos} {data.trainData?.Pos}
</Text> </Text>
)}
</View> </View>
<View style={{ flex: 1, flexDirection: "column" }}> <View style={{ flex: 1, flexDirection: "column" }}>
<View <View
style={{ style={{
flex: 1, flex: 1,
backgroundColor: "black", backgroundColor: "white",
borderRadius: 10, borderRadius: 10,
padding: 10, padding: 10,
margin: 10, margin: 10,
}} }}
> >
<Text style={{ fontSize: 10, color: "white" }}> <Text style={{ fontSize: 10, color: "#0099CC" }}>
{isNaN(data.trainData?.delay) ? "状態" : "遅延時分"} {isNaN(data.trainData?.delay) ? "状態" : "遅延時分"}
</Text> </Text>
<View style={{ flex: 1 }} />
<Text <Text
style={{ fontSize: 30, color: "white", textAlign: "right" }} style={{
fontSize: 32,
color: "#0099CC",
textAlign: "right",
}}
> >
{data.trainData?.delay} {data.trainData?.delay}
{isNaN(data.trainData?.delay) ? "" : "分"} {isNaN(data.trainData?.delay) ? "" : "分"}
@ -173,21 +196,33 @@ export const EachTrainInfo = ({
<View <View
style={{ style={{
flex: 1, flex: 1,
backgroundColor: "black", backgroundColor: "white",
borderRadius: 10, borderRadius: 10,
padding: 10, padding: 10,
margin: 10, margin: 10,
}} }}
> >
<Text style={{ fontSize: 10, color: "white" }}>列番</Text> <Text style={{ fontSize: 10, color: "#0099CC" }}>列番</Text>
<Text <Text
style={{ fontSize: 30, color: "white", textAlign: "right" }} style={{
fontSize: 32,
color: "#0099CC",
textAlign: "right",
}}
> >
{data.trainData?.num} {data.trainData?.num}
</Text> </Text>
</View> </View>
</View> </View>
</View> </View>
<ScrollView
style={{ maxHeight: heightPercentageToDP("55%") }}
nestedScrollEnabled
onScroll={(e) => {
if (!Platform.OS !== "android") return;
setIsTop(e.nativeEvent.contentOffset.y < 0);
}}
>
<View <View
style={{ style={{
padding: 10, padding: 10,