grapp-dev / stacks

A set of components for building layouts in React Native. Powered by React Native Unistyles.
https://stacks.grapp.dev
MIT License
985 stars 24 forks source link

Stack issue when using Flashlist component #43

Closed LTAbhirup closed 1 year ago

LTAbhirup commented 1 year ago

Hi , first of all thanks for this awesome library. I am facing an issue where the Flashlist is not showing when using the Flashlist component from shopify( we are using for our purpose as refactor) , although Flatlist works fine. as per that library, there is a issue which can be solved using flex: 1 in the parent (in this case Stack ) https://shopify.github.io/flash-list/docs/known-issues/#1-flashlists-rendered-size-is-not-usable-warning .

If I use View from react-native that works but I need Stack for the spacing .

Code simplified(not working):

<Stack space={4} padding={4}>
     <AnotherComponent />
      <FlashList
        data={vehicles}
        renderItem={({ item }) => (
          <MultiVehicleSelectionCard
            vehicle={item}
            onChange={handleChange}
          />
        )}
        keyExtractor={item => item.value}
        estimatedItemSize={100}
      />
     <AnotherComponent />
  </Stack> 

screenshot-1690372482978

LTAbhirup commented 1 year ago

I found a solution : To wrap with

<View style={{minHeight:100%}} >
  <Flashlist />
</View>