テキストのサイズ調整

App.tsx

@@ -1,5 +1,5 @@
 import React, { useEffect } from "react";
-import { Platform, UIManager } from "react-native";
+import { Platform, UIManager, Text } from "react-native";
 import { GestureHandlerRootView } from "react-native-gesture-handler";
 import { AppContainer } from "./Apps";
 import { UpdateAsync } from "./UpdateAsync";
@@ -35,7 +35,10 @@ export default function App() {
   useEffect(() => {
     UpdateAsync();
   }, []);
-
+  if (Text.defaultProps == null) {
+    Text.defaultProps = {};
+    Text.defaultProps.allowFontScaling = false;
+  }
   const ProviderTree = buildProvidersTree([
     AllTrainDiagramProvider,
     NotificationProvider,

components/Apps/FixedPositionBox/FixedStationBox.tsx

@@ -16,11 +16,14 @@ import { useAreaInfo } from "@/stateBox/useAreaInfo";
 import { useCurrentTrain } from "@/stateBox/useCurrentTrain";
 import { useStationList } from "@/stateBox/useStationList";
 
-import dayjs from "dayjs";
+import { FC, useEffect, useState } from "react";
-import { useEffect, useState } from "react";
 import { Text, TouchableOpacity, View } from "react-native";
 
-export const FixedStation = ({ stationID }) => {
+type props = {
+  stationID: string;
+};
+
+export const FixedStation: FC<props> = ({ stationID }) => {
   const { currentTrain, setFixedPosition } = useCurrentTrain();
   const { getStationDataFromId } = useStationList();
   const [station, setStation] = useState<StationProps[]>([]);
@@ -108,6 +111,9 @@ export const FixedStation = ({ stationID }) => {
             width: "100%",
             alignContent: "center",
             alignItems: "center",
+            height: 22,
+            overflow: "hidden",
+            paddingLeft: 5,
           }}
         >
           <StationNumberMaker
@@ -117,10 +123,11 @@ export const FixedStation = ({ stationID }) => {
           />
           <Text
             style={{
-              fontSize: 18,
+              fontSize: 14,
               textAlignVertical: "center",
               margin: 0,
               padding: 0,
+              paddingLeft: 5,
               flex: 1,
               color: "white",
             }}
@@ -130,15 +137,16 @@ export const FixedStation = ({ stationID }) => {
           <View
             style={{
               backgroundColor: "white",
-              width: 10,
+              width: 6,
               borderLeftColor: lineColor,
               borderTopColor: lineColor,
               borderBottomColor: "white",
-              borderBottomWidth: 16,
+              borderRightColor: "white",
-              borderLeftWidth: 8,
+              borderBottomWidth: 18,
+              borderLeftWidth: 10,
               borderRightWidth: 0,
               borderTopWidth: 5,
-              height: "100%",
+              height: 20,
             }}
           />
         </View>
@@ -173,7 +181,7 @@ export const FixedStation = ({ stationID }) => {
           ))
         ) : (
           <View style={{ backgroundColor: "white", flex: 1 }}>
-            <Text style={{ fontSize: 20 }}>
+            <Text style={{ fontSize:  parseInt("11%") }}>
               当駅を発着する走行中の列車はありません。
             </Text>
           </View>
@@ -212,10 +220,14 @@ const FixedStationBoxEachTrain = ({ d, station }) => {
         overflow: "visible",
       }}
     >
-      <Text style={{ fontSize: 14, flex: 3 }}>{d.time}</Text>
+      <Text style={{ fontSize: parseInt("11%"), flex: 3 }}>{d.time}</Text>
-      <Text style={{ fontSize: 14, flex: 4, color }}>{name}</Text>
+      <Text style={{ fontSize: parseInt("11%"), flex: 4, color }}>{name}</Text>
-      <Text style={{ fontSize: 14, flex: 4 }}>{d.lastStation}行</Text>
+      <Text style={{ fontSize: parseInt("11%"), flex: 4 }}>
-      <Text style={{ fontSize: 14, flex: 3 }}>{trainDelayStatus}</Text>
+        {d.lastStation}行
+      </Text>
+      <Text style={{ fontSize: parseInt("11%"), flex: 3 }}>
+        {trainDelayStatus}
+      </Text>
     </View>
   );
 };