jtalz / react-native-quiz-maker

Dynamic UI react-native library for integrating short-to-long length quizzes into applications
MIT License
4 stars 0 forks source link

react-native-quiz-maker

A dynamic UI library for creating interactive quizzes in react-native.

Installation

npm install react-native-quiz-maker

https://www.npmjs.com/package/react-native-quiz-maker

Examples

Usage

import { QuizContainer } from 'react-native-quiz-maker';
import { View } from 'react-native';

<View style={styles.container}>
  <QuizContainer
    questions={[
      {
        questionType: 'Writing',
        question:
          'What is the last name of The United States of Americas first President?',
        answer: 'Washington',
      },
      {
        questionType: 'MultipleChoice',
        question: 'What is 5 x 10 + 30?',
        answer: '80',
        allChoices: ['54', '85', '80'],
        instructionText: 'Press on or drag the best answer to place',
      },
      {
        questionType: 'Matching',
        questionAnswerPairs: [
          {
            answer: ' Equilateral',
            question: 'Three sides of equal length',
          },
          {
            answer: 'Acute',
            question: 'Three angles less than 90 degrees',
          },
          {
            answer: 'Obtuse',
            question: 'One angle greater than 90 degrees',
          },
          { answer: 'Isosceles', question: 'Two sides of equal length' },
        ],
        instructionText: 'Match the definition with the appropriate triangle',
      },
    ]}
    onSubmit={(isCorrect: boolean) => console.log(isCorrect)}
    onComplete={(progress: number) => console.log('score: ', progress)}
  />
</View>;

Contributing

See the contributing guide to learn how to contribute to the repository and the development workflow.

License

MIT