Eugnis/react-native-timeline-flatlist

Is there a way to modifiy the starting point of event line ?

ramisalem opened this issue · 5 comments

I am trying to align the circle to be in the center of each and every event, I tried to change potion of circleStyle but I could not find a way to move its line, as shown in the follwing screenshopts the line do not start from center and it do not reach the last event

circleStyle={ { alignSelf: 'center' } }

Screen Shot 1441-08-05 at 6 04 41 PM
Screen Shot 1441-08-05 at 6 05 09 PM

Since line is drawn as border there's no easy way to put circle in center of event if you need that line to start from circle.
You can try to use Timeline prop renderFullLine={true} alongside with circleStyle={ { alignSelf: 'center' } } then circle will be on center of event but line will be full including last event.
Also you can set custom styles to line by using Timeline prop eventContainerStyle or custom style of each event's line segment by passing eventContainerStyle to event data objects (from version 0.7.1)

Hi thanks, for the response
I have added the following style to TimeLine

eventContainerStyle: {
    height: '145%',
    paddingHorizontal: 15 ,
    marginTop: 18  
  }

alnog side with
circleStyle={ { alignSelf: 'center' } }

but the issue now is that the line do not fit btween the two circels
as shown
Screen Shot 1441-08-06 at 7 43 30 PM

Since line is drawn as border there's no easy way to put circle in center of event if you need that line to start from circle.
You can try to use Timeline prop renderFullLine={true} alongside with circleStyle={ { alignSelf: 'center' } } then circle will be on center of event but line will be full including last event.
Also you can set custom styles to line by using Timeline prop eventContainerStyle or custom style of each event's line segment by passing eventContainerStyle to event data objects (from version 0.7.1)

this helped me with border and card horizotal alignment , thanks

hi @ramisalem, how you can put your own custom card into timepoints?

I'm also trying to align the circle but also keep aligned with the start of the line, how do you manage to do that? renderFullLine does not seem to do anything at start of the border
@Eugnis