Comments (6)
For what it's worth, I have this hook in my app, that I use to decide if I want a video component / QR Code scanner should be activated:
export const useAppNavigationFocusLazy = () => {
const isFocused = useIsFocused();
const [isFocusedLazy, setFocusedLazy] = useState(isFocused);
useEffect(() => {
const { cancel } = InteractionManager.runAfterInteractions(() => {
setFocusedLazy(isFocused);
});
return () => cancel();
}, [isFocused]);
return isFocusedLazy;
};
The "lazy" means the true/false switch will be delayed until animations have completed
from hooks.
from hooks.
The focus trigger before the transition end.
Imagine that I have a expensive asset in screen: video or 3d stuff.
So I can do something like that:
{open && <Movie3D />}
from hooks.
Hi
You can use did Focus and await InteractionManager, this way you'll be able to wait until animation completion to avoid showing an expensive component during an animation
from hooks.
@slorber thanks is that my real problem.
Do you have same sample using focus + InteractionManager ?
from hooks.
useEffect(() => {
InteractionManager.runAfterInteractions(() => {
setState({showHeavyScreen: true});
});
},[])
from hooks.
Related Issues (20)
- Proper way to use react-navigation-hooks with storybook HOT 2
- Types are missing and causing errors HOT 18
- react-navigation-hooks v2 HOT 2
- setTopLevelNavigator support for hooks HOT 2
- Getting error 'from' expected HOT 2
- useFocusEffect should not retrigger on re-render HOT 8
- I can't define NavigationParams types with useNavigation HOT 1
- Reset Stack HOT 1
- Proposal: Ability to pass params for tabBarOnPress defaultHandler function HOT 1
- setParams entity change when is called HOT 1
- useFocusEffect should handle drawers HOT 4
- useNavigation shouldn't be in @react-navigation/native? HOT 3
- Open&Close Drawer HOT 1
- Hooks on the web - react-navigation is now directly imported HOT 3
- useNavigation give the warning "can't perform a React state update on an unmounted component" HOT 1
- "THIS ISSUE WAS DELETED AND BLOCKED"
- Include v5 patching for users converting from v4 to v5? HOT 1
- useNavigation not working HOT 1
- How i can re-render with useNavigationParam ? HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from hooks.