1

I'm trying to create a simple animated question and multiple-choice answer style health assessment like so. In this example, each question has corresponding answer options and selecting a specific answer would lead to a unique next question (For example, question 1 = "Do you exercise regularly?; answer 1 = "yes"; question 2 = "OK, how often do you exercise?"). Additionally, the question and answer you selected animates to the top of the screen, but clicking on your previous answer would bring back the question and answers so you could re-answer it if you'd like.

I'm fairly new to React Native so I apologize if this is a beginner question, but to build this, should I implement a scrollview or flatlist? I was thinking of putting all of the question and answer keys in firebase and mapping over them to display the question and matching multiple choice answers.

HONGAA
  • 21
  • 2

1 Answers1

1

I would recommend FlatList. As discussed in the React docs, ScrollView is easier to implement, but has performance downsides as it renders all children at once.

FlatList also supports separators, multiple columns, and infinite scroll out of the box.

Colin Ricardo
  • 16,488
  • 11
  • 47
  • 80
  • thanks a lot for the input. After reading the docs, I agree. How would you go about the data structure though and animations of this app? Should I create a Flatlist where the top row would be the previous question/answer and the bottom row/s would be the most recent question and corresponding answer bubbles? And as a user keeps answering questions, add them to the bottom of this list? I might have to use the Invertible Scrollview for this: https://github.com/HONGAA/react-native-invertible-scroll-view – HONGAA Apr 24 '18 at 19:12