vdor / react-native-horizontal-picker Goto Github PK

HI, Vseslav Dorofeev

i`m experiencing problem with default index.

I will attach screenshots to be more clear and i will provide simple example of what i should do and what is the actual behavior.

That`s my code:

const Items = Array.from(Array(10).keys());

const rednerItem = (item, index) => (
<View style={[styles.item], { width: 80, borderWidth: 1, borderColor: 'red' }}>
<Text style={{textAlign: 'center'}}>
{ item }


);

This is how it looks on mount of the component:

This is what i espect to be on mount of the component:

Thanks in advance!

Hey!
Got a question about your very useful component 👍

So, I see that at certain point horizontal picker makes 2 stops and throws 2 onChange event. For instance when you scroll either slow enough, or scroll far enough. Like onChange scrollview stops in the some place (between the items), then correctly centers on a particular item and throws onChange again.

Do you happen to know how to avoid that first onChange? so that I only get a single event when the scrollview complately stopped and correctly centered?

Thanks in advance!

Hi,

Is it possible to use the scrollTo function or something else to change the value dynamically?
I want to change the selected value/position after the component is already loaded.

This is the only working horizontal picker that I've tried. The default value for editing forms is necessary. Please add the following lines to 'index.tsx':

componentDidMount() { const x = this.props.defaultValue * this.props.itemWidth; setTimeout(() => { this.refScrollView.current.scrollTo({ x, y: 0, animated: false }); }, 1) }

Also,

defaultValue: number,

to

export interface HorizontalPickerProps extends ScrollViewProps { data: any[], renderItem: (item: any, index: number) => ReactNode, itemWidth: number, defaultValue: number, snapTimeout?: number onChange?: (position: number) => void };

Thanks to vdor for this simple and useful picker

<HorizontalPicker
onScroll={(e)=> {}}
/>

onScroll can block private onScroll in HorizontalPicker

onScroll={this.onScroll}
{...props}

to

{...props}
onScroll={this.onScroll}

other properties also have the problem