@AlexCool flexbox question

App.js

import React, { useState } from "react";
import { Dimensions, View, Text, Switch } from "react-native";

const { height, width } = Dimensions.get("window");
export default function App() {
  const [isEnabled, setIsEnabled] = useState(false);
  const toggleSwitch = () => setIsEnabled((previousState) => !previousState);

  return (
    <View
      style={{
        flex: 1,
        backgroundColor: "#2C2C2C",
        paddingTop: 0.25 * height,
        paddingHorizontal: 20,
      }}
    >
      <View
        style={{
          flexDirection: "row",
          marginVertical: 8,
          alignItems: "center",
        }}
      >
        <Text style={{ color: "white", margin: 8, width: 0.75 * width }}>
          Automatically play next item
        </Text>

        <Switch
          trackColor={{ false: "#9C9C9C", true: "orange" }}
          thumbColor={"#FFF"}
          onValueChange={toggleSwitch}
          value={isEnabled}
        />
      </View>

      <View
        style={{
          flexDirection: "row",
          marginVertical: 8,
          alignItems: "center",
        }}
      >
        <Text style={{ color: "white", margin: 8, width: 0.75 * width }}>
          Enable text scrolling in media list
        </Text>

        <Switch
          trackColor={{ false: "#9C9C9C", true: "orange" }}
          thumbColor={"#FFF"}
          onValueChange={toggleSwitch}
          value={isEnabled}
        />
      </View>

      <View
        style={{
          flexDirection: "row",
          marginVertical: 8,
          alignItems: "center",
        }}
      >
        <Text style={{ color: "white", margin: 8, width: 0.75 * width }}>
          Remember player state (shuffle, loop)
        </Text>

        <Switch
          trackColor={{ false: "#767577", true: "orange" }}
          thumbColor={"#FFF"}
          onValueChange={toggleSwitch}
          value={isEnabled}
        />
      </View>
    </View>
  );
}