Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: add shifting animation to bottom-tabs and various fixes #11581

Merged
merged 1 commit into from
Sep 7, 2023

Conversation

satya164
Copy link
Member

@satya164 satya164 commented Sep 5, 2023

This adds a new shifting animation preset to bottom tabs, as well as various animation related fixes.

  • Instead of 0, 1 for animated value, use -1, 0, 1 - so that it can represent both focus state and direction
  • Animate with duration: 0 when animation is not enabled - this ensures that the animation values stay in sync
  • Add correct types to animated styles instead of any
Kapture.2023-09-05.at.11.40.24.mp4

@satya164 satya164 requested a review from osdnk September 5, 2023 09:44
@netlify
Copy link

netlify bot commented Sep 5, 2023

Deploy Preview for react-navigation-example ready!

Name Link
🔨 Latest commit b334c38
🔍 Latest deploy log https://app.netlify.com/sites/react-navigation-example/deploys/64f9a0ac32f5630008067cb1
😎 Deploy Preview https://deploy-preview-11581--react-navigation-example.netlify.app/
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

@codecov-commenter
Copy link

codecov-commenter commented Sep 5, 2023

Codecov Report

Patch coverage: 84.61% and project coverage change: +0.02% 🎉

Comparison is base (36d19bd) 75.72% compared to head (b334c38) 75.74%.

Additional details and impacted files
@@            Coverage Diff             @@
##             main   #11581      +/-   ##
==========================================
+ Coverage   75.72%   75.74%   +0.02%     
==========================================
  Files         198      198              
  Lines        5795     5809      +14     
  Branches     2268     2269       +1     
==========================================
+ Hits         4388     4400      +12     
- Misses       1360     1362       +2     
  Partials       47       47              
Files Changed Coverage Δ
.../src/TransitionConfigs/SceneStyleInterpolators.tsx 0.00% <0.00%> (ø)
packages/elements/src/Background.tsx 100.00% <ø> (ø)
packages/elements/src/Screen.tsx 78.26% <ø> (ø)
packages/bottom-tabs/src/views/BottomTabView.tsx 94.28% <87.50%> (+0.73%) ⬆️
...m-tabs/src/TransitionConfigs/TransitionPresets.tsx 100.00% <100.00%> (ø)
...tom-tabs/src/TransitionConfigs/TransitionSpecs.tsx 100.00% <100.00%> (ø)
...kages/bottom-tabs/src/utils/useAnimatedHashMap.tsx 100.00% <100.00%> (ø)

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

This adds a new shifting animation preset to bottom tabs, as well as various animation related fixes.

- Instead of `0`, `1` for animated value, use `-1`, `0`, `1` - so that it can represent both focus state and direction
- Animate with `duration: 0` when animation is not enabled - this ensures that the animation values stay in sync
- Add correct types to animated styles instead of `any`
@satya164 satya164 force-pushed the @satya164/bottom-tab-animation branch from c35b4b9 to b334c38 Compare September 7, 2023 10:06
@satya164 satya164 merged commit 6d93c2d into main Sep 7, 2023
10 checks passed
@satya164 satya164 deleted the @satya164/bottom-tab-animation branch September 7, 2023 10:15
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants