2017-11-28 10 views
1

너비와 높이를 <FlatList />으로 변경하고 싶습니다.반응 네이티브에서 <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' 
    } 
}); 

그리고이 코드의 결과입니다.

Current result

나는 몇 시간 동안 답을 찾았지만 아무것도 나에게 도움이되지 않습니다.

높이 스타일이 왜 작동하지 않는지 잘 모르겠습니다.

도움을 주시면 감사하겠습니다.

답변

10

답변을 찾았습니다.

<View/>의 높이를 설정하고 문제를 해결하는 <View/>

<FlatList/> 내부에 배치. :)