This is a mobile application built on React Native.
Initially, I started this to try out some animations 😂 but it ended up teaching me lots about React (file organizations, alias path, etc.)
Note: Data is imported from JSON file locally (Merged Biuni's and Fanzeyi's JSON files using JSON Merger VSCode extension)
Note:
The *Moves* screen is empty
There were initially two issues encountered in this project (due to re-rendering after new data are added):
- Styling messed up
- List re-starts from top (not continuing from last seen item/index)
Solution:
'initialScrollIndex' prop (BUT, effect will be voided (re-start at top again) once started scrolling a little 😂) and
messy styling issue fixed
Also tried scrollToOffset but couldn't make it work (possibly due to this issue: https://github.com/software-mansion/react-native-reanimated/issues/587)
- RN Dominant Color (To get dominant color of Pokemon image)
- React Flipper (For debugging - Kind of like DevTools for React Native 👀)
- React Navigation Share Element (Transitioning component between screens 🚛)
- React Native SVG (For importing SVG as components 🥳)
- Reanimated Bottom Sheet
- Pager View (For sliding between tab pages ⬅➡)
- Progress Bar (Comes with animation 😁)
- Convert HSL to Hex (Color format converter)