'React Native. How to scale view to fix smaller screens

I have a component that show on iPhone 13 however on iPhone SE which have slight smaller screen some of my elements are not completely showing. I like to know if there a way that I can scale the component so that everything shows on the screen. In this example I have iPhone SE which is cutting off my save button and preview window. however on bigger devices everything show. I do not want this view to be able to scroll. enter image description here

<>
      <Appbar.Header>
        <Button
          labelStyle={{color: 'white'}}
          icon="arrow-left"
          mode="text"
          onPress={() => goToStep(1)}>
          Scenes List
        </Button>
        <Appbar.Action />
      </Appbar.Header>
      <View
        style={[
          styles.container,
          {
            paddingLeft: insets.left,
            paddingRight: insets.right,
          },
        ]}>
        <View style={styles.topContainer}>
          <TextInput
            label="Title (Optional. Default is used if blank)"
            mode="outlined"
            ref={inputRef}
            value={text}
            onChangeText={inputText => setText(inputText)}
          />
          <Paragraph>
            Select a text color then an icon or background color for your button{' '}
            <Paragraph style={{color: 'red'}}>
              (To reset, press and hold buttons)
            </Paragraph>
          </Paragraph>
          <View style={styles.row}>
            <View style={styles.btnWrapper}>
              <View style={styles.textBtnContainer}>
                <ColorPickerButton
                  containerStyle={styles.styleBtn}
                  useText={'TEXT COLOR'}
                  selectedColor={setSelectedTextColor}
                />
                <ColorPickerButton
                  containerStyle={styles.styleBtn}
                  useText={'BG COLOR'}
                  selectedColor={setSelectedBgColor}
                />
                <UploadIcon path={setImage} />
              </View>

              <Button
                icon="content-save"
                mode="contained"
                onPress={saveSelections}>
                Save
              </Button>
            </View>
            {screen.orientation === 'Landscape' && (
              <View style={styles.previewPortrait}>
                <PadPreview item={padSelections} />
              </View>
            )}
          </View>
        </View>
        {screen.orientation === 'Portrait' && (
          <View style={styles.previewLandscape}>
            <PadPreview item={padSelections} />
          </View>
        )}
      </View>
    </>



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source