反応ネイティブの<FlatList/>の高さを変更するには？

Question

<FlatList />の幅と高さを変更したいと思います。

heightのスタイルを現在の<FlatList />に設定しましたが、これはうまく機能しませんでした。

<FlatList />の高さを決して変更することはできません。

これは私のrender()の機能とスタイルです。

render() { 
     const listData = []; 
     listData.push({ key: 0 }); 
     listData.push({ key: 1 }); 
     listData.push({ key: 2 }); 
     listData.push({ key: 3 }); 
     listData.push({ key: 4 }); 
     return (
      <View style={styles.container}> 
       <FlatList 
        data={listData} 
        renderItem={({item}) => { 
         return (
          <View 
           style={{ 
            width: 30, height: 30, borderRadius: 15, backgroundColor: 'green' 
           }} 
          /> 
         ) 
        }} 
        horizontal 
        style={styles.flatList} 
       /> 
      </View> 
     ); 
    } 

const styles = StyleSheet.create({ 
    container: { 
     flex: 1, 
     justifyContent: 'center', 
     alignItems: 'center', 
     backgroundColor: 'white' 
    }, 
    flatList: { 
     height: 50, 
     backgroundColor: 'red' 
    } 
}); 

これはこのコードの結果です。

は、私は数時間のための答えを見つけましたが、何も私を助けてくれません。

高さのスタイルが機能しない理由はわかりません。

何か助けていただければ幸いです。

Answer 1

回答が見つかりました。

私は<View/>の高さを設定し、それが問題を解決している<View/>

内<FlatList/>を置きました。 :)