jrshikoku/components/ActionSheetComponents/StationDeteilView.js
2022-11-05 19:11:14 +09:00

124 lines
3.7 KiB
JavaScript

import React, { Component, useRef, useState, useEffect } from "react";
import {
StatusBar,
Platform,
View,
LayoutAnimation,
ScrollView,
Linking,
Text,
TouchableOpacity,
} from "react-native";
import Image from "react-native-remote-svg";
import Constants from "expo-constants";
import { List, ListItem } from "native-base";
import Icon from "react-native-vector-icons/Entypo";
import * as Location from "expo-location";
import StatusbarDetect from "../../StatusbarDetect";
var Status = StatusbarDetect();
import { useNavigation } from "@react-navigation/native";
import AutoHeightImage from "react-native-auto-height-image";
import {
widthPercentageToDP as wp,
heightPercentageToDP as hp,
} from "react-native-responsive-screen";
import {
FontAwesome,
Fontisto,
Foundation,
Ionicons,
MaterialCommunityIcons,
} from "@expo/vector-icons";
import * as WebBrowser from "expo-web-browser";
import ActionSheet from "react-native-actions-sheet";
import LottieView from "lottie-react-native";
import SvgUri from "react-native-svg-uri";
import Sign from "../../components/駅名表/Sign";
import { UsefulBox } from "../atom/UsefulBox";
import { TicketBox } from "../atom/TicketBox";
import { TextBox } from "../atom/TextBox";
export const StationDeteilView = (props) => {
const { StationBoardAcSR, currentStation, originalStationList } = props;
return (
<ActionSheet
ref={StationBoardAcSR}
gestureEnabled
CustomHeaderComponent={() => {}}
>
<View
style={{
backgroundColor: "white",
borderRadius: 5,
borderColor: "dark",
borderWidth: 1,
}}
>
<View style={{ height: 26, width: "100%" }}>
<View
style={{
height: 6,
width: 45,
borderRadius: 100,
backgroundColor: "#f0f0f0",
marginVertical: 10,
alignSelf: "center",
}}
/>
</View>
<ScrollView>
{currentStation && (
<Sign
currentStation={currentStation}
originalStationList={originalStationList}
oP={() => Linking.openURL(currentStation[0].StationTimeTable)}
/>
)}
{currentStation && (
<View style={{ flexDirection: "row" }}>
{!currentStation[0].JrHpUrl || (
<TicketBox
backgroundColor={"#AD7FA8"}
icon={<Foundation name="web" color="white" size={50} />}
flex={1}
onPressButton={() =>
Linking.openURL(currentStation[0].JrHpUrl)
}
>
web
</TicketBox>
)}
{!currentStation[0].StationTimeTable || (
<TicketBox
backgroundColor={"#8F5902"}
icon={<FontAwesome name="table" color="white" size={50} />}
flex={1}
onPressButton={() =>
Linking.openURL(currentStation[0].StationTimeTable)
}
>
時刻表
</TicketBox>
)}
{!currentStation[0].StationMap || (
<TicketBox
backgroundColor={"#888A85"}
icon={<Ionicons name="map" color="white" size={50} />}
flex={1}
onPressButton={() =>
Linking.openURL(currentStation[0].StationMap)
}
>
GoogleMap
</TicketBox>
)}
</View>
)}
</ScrollView>
</View>
</ActionSheet>
);
};