Skip to content

goxiaoy/flutter_survey_js

Repository files navigation

flutter_survey_js

Flutter package for parsing and display surveyjs widgets

All these widgets and highly depend on reactive_forms

Live preview https://goxiaoy.github.io/flutter_survey_js/

IMPORTANT_NOTE

This package has not fully tested, use at your own risk

Supported widgets:

  • checkbox
  • tagbox
  • ranking
  • radiogroup
  • imagepicker
  • buttongroup
  • dropdown
  • matrixdropdown
  • matrixdynamic
  • matrix
  • expression
  • text
  • comment
  • multipletext
  • html
  • image
  • empty
  • file
  • rating
  • boolean
  • signaturepad
  • paneldynamic
  • panel

Supported validator:

  • numericvalidator
  • textvalidator
  • answercountvalidator
  • regexvalidator
  • emailvalidator
  • expressionvalidator

Getting Started

flutter pub add flutter_survey_js

Modify your main function

import 'package:flutter_survey_js/flutter_survey_js.dart' as s;
void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await s.initSurvey();
  runApp(
    ...
  );
}

Web:

add following script into web/index.html

<html>
  ...
  <body>
    <!-- Add this line -->
    <script src="assets/packages/flutter_survey_js_expression/assets/index.js"></script>

    <script src="main.dart.js" type="application/javascript"></script>
  </body>
</html>

usage:

import 'package:flutter_survey_js/flutter_survey_js.dart' as s;
...
const survey = {
  "questions": [
    {
      "type": "rating",
      "name": "satisfaction",
      "title": "How satisfied are you with the Product?",
      "mininumRateDescription": "Not Satisfied",
      "maximumRateDescription": "Completely satisfied"
    }
  ]
};
...
s.SurveyWidget(
  survey: s.surveyFromJson(survey),
  onChange: (v) {
    print(v);
  },
  onSubmit: (v) {
    print(v);
  },
)

Customize

s.SurveyConfiguration(
  unsupportedBuilder: ...,
  ...
  child: s.SurveyWidget(
    survey: s.surveyFromJson(survey),
    onChange: (v) {
      print(v);
    },
    onSubmit: (v) {
      print(v);
    },
  )
)

Development

Melos

Install

dart pub global activate melos

Bootstrap

dart pub global run melos bs

Test

Before you run test

  • Windows: dart pub global run melos run build_windows
  • Linux: dart pub global run melos run build_linux

dart pub global run melos run test