My goal with this code is to show text on pressing First and Second Buttons, which work as expected.
However, whenever I press on the second one, the text is longer than the screen, but I cannot scroll down: The screen is fixed. I have made some researchs but can't find any solutions to my problem ...

Any ideas how I can resolve the issue?

Dependencies:

"dependencies": {

    "@react-navigation/bottom-tabs": "^5.8.0",

    "@react-navigation/compat": "^5.2.5",

    "@react-navigation/material-bottom-tabs": "^5.2.16",

    "@react-navigation/material-top-tabs": "^5.2.16",

    "@react-navigation/native": "^5.7.3",

    "@react-navigation/stack": "^5.9.0",

    "expo": "~38.0.8",

    "expo-status-bar": "^1.0.2",

    "react": "~16.11.0",

    "react-dom": "~16.11.0",

    "react-native": "https://github.com/expo/react-native/archive/sdk-38.0.2.tar.gz",

import React from "react";

import {

  StyleSheet,

  Text,

  View,

  ScrollView,

  TouchableOpacity,

  LayoutAnimation,

} from "react-native";

export default class ViewPersonalNote extends React.Component {

  constructor(props) {

    super(props);

    this.state = {

      expanded: false,

      expanded2: false,

    };

  }

  changeLayout = () => {

    LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut);

    this.setState({ expanded: !this.state.expanded });

  };

  changeLayout2 = () => {

    LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut);

    this.setState({ expanded2: !this.state.expanded2 });

  };

  render() {

    return (

      <View style={styles.container}>

        <View

          style={{

            position: "absolute",

            top: "50%",

            left: 20,

            right: 20,

            width: "92%",

            flexDirection: "column",

            borderBottomColor: "black",

            borderBottomWidth: 2,

          }}

        >

          <TouchableOpacity

            style={{

              width: "100%",

              height: "2em",

              borderBottomColor: "red",

              borderBottomWidth: 2,

            }}

            onPress={this.changeLayout}

          >

            <Text style={{ fontWeight: "bold", fontSize: 15 }}>First</Text>

          </TouchableOpacity>

          <View

            style={{

              height: this.state.expanded ? null : 0,

              overflow: "hidden",

              marginTop: "5%",

            }}

          >

            <Text style={{ fontSize: 17, color: "black" }}>

              The printing and typesetting industry.

              Lorem Ipsum has been the industry's standard dummy text ever since

              the 1500s

            </Text>

          </View>

          <TouchableOpacity

            style={{

              width: "100%",

              height: "2em",

              borderBottomColor: "red",

              borderBottomWidth: 2,

            }}

            onPress={this.changeLayout2}

          >

            <Text style={{ fontWeight: "bold", fontSize: 15 }}>Second</Text>

          </TouchableOpacity>

          <View

            style={{

              height: this.state.expanded2 ? null : 0,

              overflow: "hidden",

              marginTop: "5%",

            }}

          >

            <Text

              style={{

                fontSize: 17,

                color: "black",

                textAlign: "center",

              }}

            >

              Lorem Ipsum is simply dummy text of the printing and typesetting

              industry. Lorem Ipsum has been the industry's standard dummy text

              ever since the 1500s, when an unknown printer took a galley of

              type and scrambled it to make a type specimen book. It has

              survived not only five centuries, but also the leap into

              electronic typesetting, remaining essentially unchanged. It was

              popularised in the 1960s with the release of Letraset sheets

              containing Lorem Ipsum passages, and more recently with desktop

              publishing software like Aldus PageMaker including versions of

              Lorem Ipsum.

            </Text>

          </View>

        </View>

      </View>

    );

  }

}



const styles = StyleSheet.create({

  container: {

    flex: 1,

    justifyContent: "center",

    alignItems: "center",

    // margin: 10,

    backgroundColor: "white",

  }

});