Important: This documentation covers Yarn 1 (Classic).
For Yarn 2+ docs and migration guide, see yarnpkg.com.

Package detail

react-native-collapsible-view-faq

Rohitbarate58ICS2.0.1TypeScript support: included

This is the custom collabsible for making the custom FAQ section in your react native project.

react native, collapsible View, FAQ section, react-native-collapsible-view, animated view, view, Accordion

readme

This is the custom collabsible view for making the custom FAQ section or dropdown menu in your react native project. it supports both android and ios operating systems.

Installation

  1. Run: $ npm i --save react-native-collapsible-view-faq

Usage

Import the component:

import CollapsibleView from 'react-native-collapsible-view-faq';

      <CollapsibleView 
        title={'What is your name?'}
        description={'Rohit Barate'}
      />

Full Example

import React, { useRef, useState } from "react";
import { View } from "react-native";
import CollapsibleView from 'react-native-collapsible-view-faq';

const App = () => {

  return (
    <View style={flex:1}>
       <CollapsibleView 
        title={'What is your name?'}
        description={'Rohit Barate'}
      />
    </View>
  );
};

export default App;

Properties

Required props

Prop Type
title string
description string

Optional props

Prop Type Default
containerBorderColor string '#5F5F5F'
containerBorderTopWidth number 1
containerPaddingTop number
containerPaddingBottom number
containerPaddingVertical number 5
containerWidth string '90%'
containerMarginTop number
containerMarginBottom number
containerMarginVertical number 5
containerBackgroundColor string '#FFFFFF'
titleWidth string
titleBackgroundColor string
titleFontSize number 16
titleColor string '#fff'
iconColor string '#fff'
iconFontSize number 16
descBackgroundColor string
descWidth string '100%'
descFontSize number 14
descFontWeight string '400'
descColor string '#ffffff80'

Demo