設定ボタンを整理

This commit is contained in:
harukin-expo-dev-env 2024-03-10 15:05:28 +00:00
parent c0cdad3683
commit a40b5c1842

View File

@ -58,112 +58,36 @@ export default function Setting(props) {
</Text> </Text>
</View> </View>
<View style={{ flex: 1 }}> <View style={{ flex: 1 }}>
<View style={{ flexDirection: "row", padding: 10 }}> <SwitchArea
<Text str="列車アイコンを表示する"
style={{
fontSize: 25,
alignItems: "center",
alignContent: "center",
textAlign: "center",
textAlignVertical: "center",
}}
>
列車アイコンを表示する
</Text>
<View style={{ flex: 1 }} />
<SimpleSwitch
bool={iconSetting} bool={iconSetting}
setBool={setIconSetting} setBool={setIconSetting}
color="red"
/> />
</View> <SwitchArea
<View style={{ flexDirection: "row", padding: 10 }}> str="マップを表示する(beta)"
<Text bool={mapSwitch}
style={{ setBool={setMapSwitch}
fontSize: 25, />
alignItems: "center", <SwitchArea
alignContent: "center", str="駅メニューを表示"
textAlign: "center",
textAlignVertical: "center",
}}
>
マップを表示する(beta)
</Text>
<View style={{ flex: 1 }} />
<SimpleSwitch bool={mapSwitch} setBool={setMapSwitch} color="red" />
</View>
<View style={{ flexDirection: "row", padding: 10 }}>
<Text
style={{
fontSize: 25,
alignItems: "center",
alignContent: "center",
textAlign: "center",
textAlignVertical: "center",
}}
>
駅メニューを表示
</Text>
<View style={{ flex: 1 }} />
<SimpleSwitch
bool={stationMenu} bool={stationMenu}
setBool={setStationMenu} setBool={setStationMenu}
color="red"
/> />
</View> <SwitchArea
<View style={{ flexDirection: "row", padding: 10 }}> str="時刻表PDFをアプリ外で表示"
<Text
style={{
fontSize: 25,
alignItems: "center",
alignContent: "center",
textAlign: "center",
textAlignVertical: "center",
}}
>
時刻表PDFをアプリ外で表示
</Text>
<View style={{ flex: 1 }} />
<SimpleSwitch
bool={usePDFView} bool={usePDFView}
setBool={setUsePDFView} setBool={setUsePDFView}
color="red"
/> />
</View> <SwitchArea
<View style={{ flexDirection: "row", padding: 10 }}> str="列車メニュー"
<Text bool={trainMenu}
style={{ setBool={setTrainMenu}
fontSize: 25, />
alignItems: "center", <SwitchArea
alignContent: "center", str="列車現在位置表示(alpha)"
textAlign: "center",
textAlignVertical: "center",
}}
>
列車メニュー
</Text>
<View style={{ flex: 1 }} />
<SimpleSwitch bool={trainMenu} setBool={setTrainMenu} color="red" />
</View>
<View style={{ flexDirection: "row", padding: 10 }}>
<Text
style={{
fontSize: 25,
alignItems: "center",
alignContent: "center",
textAlign: "center",
textAlignVertical: "center",
}}
>
列車現在位置表示(alpha)
</Text>
<View style={{ flex: 1 }} />
<SimpleSwitch
bool={trainPosition} bool={trainPosition}
setBool={setTrainPosition} setBool={setTrainPosition}
color="red"
/> />
</View>
<View style={{ flexDirection: "row", padding: 10 }}> <View style={{ flexDirection: "row", padding: 10 }}>
<Text <Text
style={{ style={{
@ -246,3 +170,22 @@ const SimpleSwitch = ({ bool, setBool, color }) => (
onValueChange={(value) => setBool(value.toString())} onValueChange={(value) => setBool(value.toString())}
/> />
); );
const SwitchArea = ({ str, bool, setBool }) => {
return (
<View style={{ flexDirection: "row", padding: 10 }}>
<Text
style={{
fontSize: 25,
alignItems: "center",
alignContent: "center",
textAlign: "center",
textAlignVertical: "center",
}}
>
{str}
</Text>
<View style={{ flex: 1 }} />
<SimpleSwitch bool={bool} setBool={setBool} color="red" />
</View>
);
};