File tree 1 file changed +12
-3
lines changed
1 file changed +12
-3
lines changed Original file line number Diff line number Diff line change @@ -371,14 +371,22 @@ class ParallaxScrollView extends Component {
371
371
} ) {
372
372
const { viewWidth } = this . state
373
373
const { scrollY } = this
374
+
375
+ const translateY = interpolate ( scrollY , {
376
+ inputRange : [ 0 , stickyHeaderHeight ] ,
377
+ outputRange : [ - stickyHeaderHeight , 0 ] ,
378
+ extrapolate : 'clamp'
379
+ } )
380
+
374
381
if ( renderStickyHeader || renderFixedHeader ) {
375
382
const p = pivotPoint ( parallaxHeaderHeight , stickyHeaderHeight )
376
383
return (
377
- < View
384
+ < Animated . View
378
385
style = { [
379
386
styles . stickyHeader ,
380
387
{
381
388
width : viewWidth ,
389
+ transform : [ { translateY } ] ,
382
390
...( stickyHeaderHeight ? { height : stickyHeaderHeight } : null )
383
391
}
384
392
] }
@@ -388,8 +396,9 @@ class ParallaxScrollView extends Component {
388
396
style = { {
389
397
backgroundColor : backgroundColor ,
390
398
height : stickyHeaderHeight ,
399
+ transform : [ { translateY } ] ,
391
400
opacity : interpolate ( scrollY , {
392
- inputRange : [ 0 , p ] ,
401
+ inputRange : [ stickyHeaderHeight , p ] ,
393
402
outputRange : [ 0 , 1 ] ,
394
403
extrapolate : 'clamp'
395
404
} )
@@ -413,7 +422,7 @@ class ParallaxScrollView extends Component {
413
422
</ Animated . View >
414
423
: null }
415
424
{ renderFixedHeader && renderFixedHeader ( ) }
416
- </ View >
425
+ </ Animated . View >
417
426
)
418
427
} else {
419
428
return null
You can’t perform that action at this time.
0 commit comments