javascript - React native - 堆栈导航器边距内的 UI Kitten Children

Question

我对 stacknavigator 子级的边距有疑问。当屏幕位于 stacknavigator 内时，其中的所有组件都有一个边距。我使用 UI Kitten 组件。

内部堆栈导航器

而当屏幕不在里面时，一切正常。

不在堆栈导航器内

应用程序.js

export default class App extends React.Component {

 render(){
  return(
          <NavigationContainer>
            <Stack.Navigator initialRouteName="CHECKLIST" >
              <Stack.Screen name="CHECKLIST" component={CheckListScreen} />
              <Stack.Screen name="INFO TURNO" component={InfoTurnoScreen} />
            </Stack.Navigator>
          </NavigationContainer>
        );
 }
}

InfoTurnoScreen.js

export default class infoTurno extends React.Component{
constructor(props) {
super(props);
this.state =  {  
                data : '', 
                turno: '',
                mezzo: '',
                note: '',
                equipaggio: []
                };
}



render() {
 return(
  <ApplicationProvider mapping={mapping} theme={light}>
    <SafeAreaView>
    <KeyboardAwareScrollView style={{height:'100%'}}>
    <ScrollView style={{backgroundColor:'white'}} contentContainerStyle={{flexGrow: 1}}>

      {
        array1.map(
            (data, index, data1) =>
              {
                if(data1[index] == "DATA")
                {
                    return <Datepicker style={{textColor:"black", marginBottom:17}} placeholder="Seleziona la data" date={this.state.data} label={data1[index]} size="large" mode="date" dateService={localeDateService}  onSelect={ (valore) => {this.state.data = valore; this.setState(this.state.data)}}></Datepicker>;                                                          
                }
                else if(data1[index] == "MEZZO")
                {
                    return <Select style={{marginBottom:20}} size="large" placeholder="Seleziona il mezzo" label={data1[index]} value={this.state.mezzo.label} onSelect={ (valore) => {this.state.mezzo = mezzi[valore.row]; this.setState(this.state.mezzo)>
                                {
                                    mezzi.map((data, index, mezzi) => { return <SelectItem title={mezzi[index].label}></SelectItem>})
                                }
                            </Select>
                }   
                else if(data1[index] == "TURNO")
                {
                    return <Select style={{}} size="large" placeholder="Seleziona il turno" label={data1[index]} value={this.state.turno.label} onSelect={ (valore) => {this.state.turno = turni[valore.row]; this.setState(this.state.turno)>
                                {
                                    turni.map((data, index, turni) => { return <SelectItem title={turni[index].label}></SelectItem>})
                                }
                            </Select>
                }
                else if(data1[index] == "EQUIPAGGIO")
                {
                    return <Layout style={{marginBottom:20}}>
                            <Text style={{fontSize:12, fontWeight:"800", color:"#97a2b8", marginBottom:5}}>{data1[index]}</Text>
                            <Layout style={{backgroundColor:'#f7f9fc', padding:5,borderColor:'#e6ebf3', borderWidth:1, borderRadius:4 }}>
                              {
                                  equipaggio.map((data, index, equipaggio) => 
                                    <Input style={{backgroundColor:'white'}} label={equipaggio[index].key} value={this.state.equipaggio[index]} placeholder="Nome Cognome" onChangeText={ (valore) => {this.state.equipaggio[index] = valore; this.setState({equipaggio: this.state.equipaggio})></Input>
                                  )
                              }
                            </Layout>
                          </Layout>
                }
                else
                {
                  return <Input style={{marginBottom:20}} size="large" maxLength={500} value={this.state.note} placeholderTextColor="#95a0b7" placeholder="Inserisci delle note" multiline={true} label={array1[index]} onChangeText={ (valore) => 
                      { 
                          this.state.note = valore;
                          this.setState({note: valore});
                      }
                    }></Input>
                }
              }
        )
      }

      </ScrollView>
      </KeyboardAwareScrollView>
      </SafeAreaView>
</ApplicationProvider>
)
 }
}