Как добавить радиокнопки с разными номерами и добавить текст редактирования в виде списка во флаттере - PullRequest
Новая
       27

Как добавить радиокнопки с разными номерами и добавить текст редактирования в виде списка во флаттере

0 голосов
/ 04 августа 2020

Я хочу добавить радио-кнопки в приложение-викторину. у каждого вопроса может быть разное количество вариантов. например, у некоторых вопросов есть 2 варианта, а у некоторых есть 3 варианта, как добавить это в список. а также некоторые вопросы не имеют никаких вариантов, в то время я должен добавить текстовое поле. как это сделать в виде списка.

Здесь 1-й вопрос имеет 2 переключателя, а 2-й вопрос имеет 3 переключателя, а 3-й вопрос имеет текстовое поле 

List<Widget> makeRadios(List options) {// creating radio buttons based on options
    List<Widget> list = new List<Widget>();

    for (int i = 0; i < options.length; i++) {
      list.add(new Row(
        children: <Widget>[
          new Text('Radio $i'),
          new Radio(
              value: i,
              groupValue: _selected,
              onChanged: (int value) {
                onChanged(value);
              })
        ],
      ));
    }

    return list;
  }

  Widget create_qstns(String qsn, List options) {// add radio widget to each questions
    return new Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: <Widget>[
          SizedBox(
            height: 10,
          ),
          new Text(
            qsn,
            style: new TextStyle(
              fontWeight: FontWeight.bold,
              fontSize: 16.0,
            ),
          ),
          Column(children: makeRadios(options)),
        ]);
  }

Вот данные json

[
  {
    "Id": 1,
    "Type": "Multiple",
    "Question": "Do you feel being pulled to one side while walking?",
    "Options": "Double vision,Slurring of speech or mispronunciation,Numbness of face,None",
    "IsNested": false,
    "Result": null
  },
  {
    "Id": 2,
    "Type": "Multiple",
    "Question": "Do you experience any of these before, during or after the giddiness episodes?",
    "Options": "Ringing sounds in the ear,Fullness in the ear,Reduced hearing,None",
    "IsNested": false,
    "Result": null
  },
  {
    "Id": 2.1,
    "Type": "Multiple",
    "Question": "Which ear?",
    "Options": "Right ear,Left ear",
    "IsNested": true,
    "Result": null
  },
  {
    "Id": 2.2,
    "Type": "Multiple",
    "Question": "How long do your giddy episodes last?",
    "Options": "Seconds,About one to two minutes,More than five minutes but less than half hour,Few hours,More than 24 hours",
    "IsNested": true,
    "Result": null
  },
  {
    "Id": 2.3,
    "Type": "Input",
    "Question": "When was the first time you had your giddiness episode?(fill in how long ago or approximate month and year)",
    "Options": null,
    "IsNested": true,
    "Result": null
  },
  {
    "Id": 3,
    "Type": "Multiple",
    "Question": "Can you reproduce the symptoms on your own?",
    "Options": "Yes,No",
    "IsNested": false,
    "Result": null
  },
  {
    "Id": 3.1,
    "Type": "Multiple",
    "Question": "Which of these things can bring about giddiness",
    "Options": "Turning in bed,Looking down,Looking up",
    "IsNested": true,
    "Result": null
  },
  {
    "Id": 4,
    "Type": "Multiple",
    "Question": "Did you ever have a fall?",
    "Options": "Yes,No",
    "IsNested": false,
    "Result": null
  },
  {
    "Id": 4.1,
    "Type": "Multiple",
    "Question": "Was the fall because of your giddiness",
    "Options": "Yes,No",
    "IsNested": true,
    "Result": null
  },
  {
    "Id": 5,
    "Type": "Multiple",
    "Question": "Do you feel swaying sensation while walking?",
    "Options": "Yes,No",
    "IsNested": false,
    "Result": null
  },
  {
    "Id": 6,
    "Type": "Multiple",
    "Question": "Do you feel being pulled to one side while walking?",
    "Options": "Yes,No",
    "IsNested": false,
    "Result": null
  },
  {
    "Id": 7,
    "Type": "Multiple",
    "Question": "Do you get headaches?",
    "Options": "Yes,No",
    "IsNested": false,
    "Result": null
  },
  {
    "Id": 7.1,
    "Type": "Multiple",
    "Question": "Do you get any of the following during headache?",
    "Options": "Nausea,Vomiting,Intolerance to light,Intolerance to sound,Intolerance to smell",
    "IsNested": true,
    "Result": null
  },
  {
    "Id": 8,
    "Type": "Multiple",
    "Question": "Have you identified any triggers for your giddiness episodes?",
    "Options": "Yes,No",
    "IsNested": false,
    "Result": null
  },
  {
    "Id": 8.1,
    "Type": "Multiple",
    "Question": "Which of the following triggers your giddiness?",
    "Options": "Missed sleep,Travel,Stress,Hunger,Smells,None of the above",
    "IsNested": true,
    "Result": null
  },
  {
    "Id": 9,
    "Type": "Input",
    "Question": "How frequently do you get the giddiness episodes?",
    "Options": null,
    "IsNested": false,
    "Result": null
  },
  {
    "Id": 10,
    "Type": "Multiple",
    "Question": "How do you describe the course of the condition you are facing?",
    "Options": "Getting worser day by day,Getting better day by day,It has been the same,None of the above",
    "IsNested": false,
    "Result": null
  },
  {
    "Id": 11,
    "Type": "Multiple",
    "Question": "Do you have motion sickness?",
    "Options": "Yes,No",
    "IsNested": false,
    "Result": null
  },
  {
    "Id": 12,
    "Type": "Multiple",
    "Question": "Do you feel uneasy looking at fast moving objects?",
    "Options": "Yes,No",
    "IsNested": false,
    "Result": null
  },
  {
    "Id": 13,
    "Type": "Input",
    "Question": "Which medicine made you better (at least temporarily)?",
    "Options": null,
    "IsNested": false,
    "Result": null
  }
]

1 Ответ

0 голосов
/ 04 августа 2020

Если я посмотрю на ваш код, это место, где вы создаете свой вопрос, 

Widget create_qstns(String qsn, List options) {// add radio widget to each questions
    return new Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: <Widget>[
          SizedBox(
            height: 10,
          ),
          new Text(
            qsn,
            style: new TextStyle(
              fontWeight: FontWeight.bold,
              fontSize: 16.0,
            ),
          ),
          // here is the catch
          Column(children: makeRadios(options)),
        ]);
  }

Кроме того, не используйте Column, так как он должен быть выровнен. Вы можете использовать эти вещи в качестве альтернативы

Кроме того, если вы хотите это сделать, просто проверьте, является ли список options пустым или нет, если нет, то покажите пустые фиктивные данные

Красный около Тернарный оператор Dart 

Container(
  // checking if the options length is not 0, then pass your empty data
  // else call your makeRadios 
  child: options.length != 0 ? makeRadios(options) : TextField()
)

Кроме того, если вы беспокоитесь о перечислении options из ваших JSON данных, так как в настоящее время ваши варианты только String с запятыми, например «Да, Нет». Затем прочтите о Split ()

С помощью этого метода вы можете сохранить свои данные в списке ваших опций. Я просто раздаю вам демо 

void main() {
  var options = "Yes,No";
  // if your options from your JSON consists of null 
  // data store an empty array else store an array of your options
  List<String> myOptions = options.split(",") ?? [];
  print(myOptions); // [Yes, No]
}
...