Render Circle displays icons to far right of 2 column about react-native-timeline-listview

[bhaskardabhi]

Same is happening for me.

[alihaider123go]

Same for me.

[jspizziri]

In case people are still struggling with this the answer is "Yes". You do need to add some additional style, as the native _renderCircle method manually positions the circles relative to other dimensions.

The renderCircle function you pass into the component is bound to the component. So you can do something like this:

<Timeline
  data={data}
  renderCircle={function (item, index) {
    let circleSize = 9;
    if ([some criteria to identify your custom circle]) {
      return (
        <View
          style={{
            width: circleSize,
            height: circleSize,
            backgroundColor: 'blue',
            right: this.state.width - circleSize / 2 - (lineWidth - 1) / 2,
          }}
        />
      );
    }

    return this._renderCircle(item, index);
  }}
/>