If I do not change the position of the separators and set separatorsStyle={{backgroundColor:'green',}}, the text will be obscured.

[yinminqian]

Hi! 👋

Firstly, thanks for your work on this project! 🙂

Today I used patch-package to patch react-native-ui-lib@7.20.0 for the project I'm working on.

Here is the diff that solved my problem:

diff --git a/node_modules/react-native-ui-lib/src/components/WheelPicker/index.js b/node_modules/react-native-ui-lib/src/components/WheelPicker/index.js
index eb17b63..d7fdbe2 100644
--- a/node_modules/react-native-ui-lib/src/components/WheelPicker/index.js
+++ b/node_modules/react-native-ui-lib/src/components/WheelPicker/index.js
@@ -204,6 +204,7 @@ const WheelPicker = props => {
   }, []);
   const offsets = useMemo(() => items.map((_, i) => i * itemHeight), [items, itemHeight]);
   return <View testID={testID} bg-$backgroundDefault style={style}>
+      {separators}
       <View row centerH>
         <View flexG>
           <AnimatedFlatList {...androidFlatListProps} {...flatListProps} testID={`${testID}.list`} listKey={`${testID}.flatList`} height={height} data={items}
@@ -219,7 +220,7 @@ const WheelPicker = props => {
       {label && labelContainer}
       {fader(FaderPosition.BOTTOM)}
       {fader(FaderPosition.TOP)}
-      {separators}
+
     </View>;
 };
 WheelPicker.alignments = WheelPickerAlign;

This issue body was partially generated by patch-package.

[d-moreira]

Facing the same issue. Imo the default behaviour should be the one described here.

[adids1221]

Hi @yinminqian,
The issue is fixed, it will be out in the next release.

[yinminqian]

Hi @yinminqian, The issue is fixed, it will be out in the next release.

Thank you, great work