For school, I have to make my first app with React Native. It's a family tree app; my teacher said it's the best choice to make that with all View-elements, even the lines between family members. But I think that won't ever be possible to calculate all distances perfectly.
Isn't there any other way to make this kind of app?
I think you are right and you need to take something like https://github.com/software-mansion/react-native-svg
With SVG you can draw shapes and arrows to connect your tree items.
For React exists a beautiful library called https://reactflow.dev. Unfortunately, it is a Web-only solution, but you can check how they render trees and repeat it in RN.
Also, read this article about storing tree data in JS https://medium.com/#iampika/javascript-trees-b8f3b4261c3a it should be helpful.
Related
In the image above, I would like to know which library I can use to achieve the stories on the first screen and also, which library can I use to switch between the Current News, World News, and Politics. Also is there a way to put the status progress bar on the third screen? Thanks in advance!
to achieve the news tabs, you can use react-native-tab-view, it is highly customizable and highly reliable, the second screen is what we call the Two Layered UI and can be easily achieved by using the react-native-panhandler. The third screen is an example of the react-native-pager-view. There are lot of examples of these libraries as well as extensive documentations, All the best!
I am trying to build a contact list in react native. I don't do all the possible optimization that are mentioned in the following mentioned places.
React native flat list optimization
8 ways to optimize React native FlatList performance
how-to-optimize-your-react-native-flatlist
How did I optimize my React Native FlatList?
flatlist-performance-tips
react-native-optimized-flatlist
I have tried all these one by one. by flat list is too much smooth now. but the only problem is that it takes some time to load initially. I want it like the contact book how has no loading. her ei ma attaching video link how it is behaving.
my own flat list source code
Video
** anyone who can help me to resolve this. I am tired of this and now this becomes a headache for me. help will be really appreciated. ia m trying on this for one month but invain.**
Take a look at the docs specifically about the attributes maxToRenderPerBatch,updateCellsBatchingPeriod and removeClippedSubviews. In your case, it's rendering 50 items per batch of render, the updateCellsBatchingPeriod maybe is making the list update itself longer than expected and maybe if you set the prop removeClippedSubviews to true the list is going to stay fluid as you want.
I need to show data in graphical representation like stock app in itunes.
There are many libs but I cant find one giving such functionalities.
Can Any body suggest how to implement.
Try using React-native-svg-charts
which you can control size and colors
here is an Example
I tried to find tree view select in react native, But, I couldn't find any. I also tried to generate my own, but it will take more time to develop and need to fix many things that I can't do right now.
Can anybody provide inputs on which library or component use for tree multi-select inputs?
Thank you in advance.
I am trying to create an interface that is similar to the interface on this website for the skill tree: http://www.pathofexile.com/passive-skill-tree. What is the best way to go about doing this and have the same or similar user interaction. ie. you click on a node and it activate or deactivates it. The movement of the tree and zooming on it would be nice as well. Would like to try to stay away from webView as I am thinking about features I want to add. Thanks in advance just want to see what a good way to do this is.
you can use webView and have almost a copy-paste of the presented webpage html source and load it.
However with native components you can have better performance, but it will "not a copy"
Native componets:
IIViewDeckController for iOS
iHasApp for iOS
iHasApp for iOS
There are more on that side. Consider a combination of they,