This is just a repo for doing some experiments of what it is possible to do with RN. Built as a series of experiments, for internal consumption only, but open to the public in case it ends up being useful for someone.
Here are the questions to answer, more or less in order...
-
What can we do with text?
-
How can we make a button that has an appropriate mobile feel?
-
How do we make navigation work with proper transitions?
-
How do we make a custom navbar?
-
What is the best way to integrate icons into a RN app?
-
How can we build a tabbed menu?
- How can we build a tabbed menu with native icons?
- How can we build a tabbed menu with custom icons?
-
How can we create a slider menu (the infamous hamburguer menu) -- even in iOS?
-
How can we have one general slider menu from the left that is always present?
-
How can we have one general slider menu from the left and right that is always present?
-
Understand why, by default, swipe back is from the right (and make it swipe back from the left)?
-
How can we disable a swipe back gesture in a view with a DrawerLayout?
-
How can we hide navigation bar when drawer is inside a scene (and inside the
Navigatorcomponent)? -
How can we trigger menus from menu icon presses?
-
How can we address the performance/flicker issues when rendering transitions between scenes?
-
How do we customize lists (
ListView) -- both items and the overall list look?- How can we create swipe actions on list items?
- How can we add an image to a list item?
-
Image experiments
- Local image
- Remote image
- Image manipulation - clip mask
-
Experiment with SVG in react native
-
Create a "filters/settings" view that is triggered from the navigation bar
- Add form components to "filters/settings" view
-
What kind of form components can we use, and how can we customize them?
- In particular, how can we create a Calendar component that is mobile friendly (can we use this native library)?
-
How can we connect to native components?
-
How to use external package managers such as CocoaPods in React Native?
-
How can we create graphics and plots (is there an alternative to d3.js for react native)?
-
What are the best practices for form validation?
-
How to import photos from camera roll and crop them?
-
How to access the microphone, camera, and location of the user?
-
What kind of animations can we trigger and how?
- React native spinkit
- React native svg
- React native image crop picker
- React native Art (apparently now in core) - and a nice tutorial / another nice tutorial
- A list of open source quality native components for iOS
In summary, this repo aims to answer the question of how to customize RN elements as much as possible from a styling perspective.