[🐴] Only scroll down one "screen" in height when foregrounding (#4027)
* maintain position after foreground * one possibility * don't overscroll when content size changes. * ignore the rule on 1 item * fix * [🐴] Pill for additional unreads when coming from background (#4043) * create a pill with some animatons * add some basic styles to the pill * make the animations reusable * bit better styling * rm logs --------- Co-authored-by: Samuel Newman <mozzius@protonmail.com> * import --------- Co-authored-by: Samuel Newman <mozzius@protonmail.com>
This commit is contained in:
		
							parent
							
								
									b15b49a48f
								
							
						
					
					
						commit
						ef0ce951e7
					
				
					 3 changed files with 136 additions and 12 deletions
				
			
		
							
								
								
									
										39
									
								
								src/lib/custom-animations/ScaleAndFade.ts
									
										
									
									
									
										Normal file
									
								
							
							
						
						
									
										39
									
								
								src/lib/custom-animations/ScaleAndFade.ts
									
										
									
									
									
										Normal file
									
								
							| 
						 | 
				
			
			@ -0,0 +1,39 @@
 | 
			
		|||
import {withTiming} from 'react-native-reanimated'
 | 
			
		||||
 | 
			
		||||
export function ScaleAndFadeIn() {
 | 
			
		||||
  'worklet'
 | 
			
		||||
 | 
			
		||||
  const animations = {
 | 
			
		||||
    opacity: withTiming(1),
 | 
			
		||||
    transform: [{scale: withTiming(1)}],
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  const initialValues = {
 | 
			
		||||
    opacity: 0,
 | 
			
		||||
    transform: [{scale: 0.7}],
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  return {
 | 
			
		||||
    animations,
 | 
			
		||||
    initialValues,
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
export function ScaleAndFadeOut() {
 | 
			
		||||
  'worklet'
 | 
			
		||||
 | 
			
		||||
  const animations = {
 | 
			
		||||
    opacity: withTiming(0),
 | 
			
		||||
    transform: [{scale: withTiming(0.7)}],
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  const initialValues = {
 | 
			
		||||
    opacity: 1,
 | 
			
		||||
    transform: [{scale: 1}],
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  return {
 | 
			
		||||
    animations,
 | 
			
		||||
    initialValues,
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue