react-native-timeline-flatlist icon indicating copy to clipboard operation
react-native-timeline-flatlist copied to clipboard

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

Open ramisalem opened this issue 4 years ago • 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

ramisalem avatar Mar 29 '20 12:03 ramisalem

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)

Eugnis avatar Mar 29 '20 20:03 Eugnis

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

ramisalem avatar Mar 30 '20 14:03 ramisalem

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

vi1199 avatar Jun 02 '21 12:06 vi1199

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

gaabrielricci avatar Jun 15 '22 20:06 gaabrielricci

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

jeferson-sb avatar Oct 14 '22 19:10 jeferson-sb