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