Значение флаттера не изменяется в шаговом режиме - PullRequest
Новая
       9

Значение флаттера не изменяется в шаговом режиме

0 голосов
/ 02 февраля 2020

Проблема в том, что _qualificationRadioGroupValue значение обновляется при вызове setState(), но после того, как метод сборки вызвал его сброс к исходному значению, я начинаю трепетать, поэтому не знаю, что я делаю неправильно. Я протестировал только 2 переключателя он работает вне степпера, но не работает в степпере. Я не знаю почему

Это код моего экрана 

import 'package:flutter/material.dart';

class HomePage extends StatefulWidget {
  final title;

  HomePage({this.title});

  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  List<Step> _steps = <Step>[];
  int _currentStep = 0;
  int _isStepsCompleted = false;

  @override
  void initState() {
    super.initState();
    _steps.add(_lastQualificationStep());
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Stack(
        children: <Widget>[
          Stepper(
            steps: _steps,
            currentStep: _currentStep,
            onStepTapped: (step) => onStepTapped(step),
            onStepContinue: onStepContinue,
            onStepCancel: onStepCancel,
          ),
        ],
      ),
    );
  }

  void onStepContinue() {
    _currentStep + 1 != _steps.length
        ? onStepTapped(_currentStep + 1)
        : setState(() => _isStepsCompleted = true);
  }

  void onStepTapped(int step) => setState(() => _currentStep = step);

  void onStepCancel() {
    if (_currentStep > 0) {
      onStepTapped(_currentStep - 1);
    }
  }

  void setSelectRadioButton(int value, int groupValue) {
    print('Radio Value: $value');
    print('GroupValue before setState: $groupValue');
    setState(() {
      groupValue= value;
    });
    print('GroupValue after setState: $groupValue');
  }

  int _qualificationRadioGroupValue = 0;

  Step _lastQualificationStep() {
    List<RadioModel> qualifitcationList = [
      RadioModel(
          title: 'Pre-Engineering',
          value: 0,
          groupValue: _qualificationRadioGroupValue),
      RadioModel(
          title: 'Pre-Medical',
          value: 1,
          groupValue: _qualificationRadioGroupValue),
      RadioModel(
          title: 'ICS', value: 2, groupValue: _qualificationRadioGroupValue),
      RadioModel(
          title: 'Commerce',
          value: 3,
          groupValue: _qualificationRadioGroupValue),
    ];
    return Step(
      title: Text("What is your last qualification?"),
      isActive: _currentStep == 0,
      state: _currentStep == 0 ? StepState.editing : StepState.indexed,
      content: Column(
        children: _qualifitcationList
            .map(
              (qualification) => RadioListTile(
                title: Text(qualification.title),
                value: qualification.value,
                groupValue: qualification.groupValue,
                onChanged: (value) =>
                    setSelectRadioButton(value, qualification.groupValue),
              ),
            )
            .toList(),
      ),
    );
  }
}

class RadioModel {
  final title;
  final value;
  final groupValue;

  RadioModel({this.title, this.value, this.groupValue});
}

1 Ответ

1 голос
/ 03 февраля 2020

Вы можете скопировать и вставить полный код ниже
Шаг 1: List<Step> _steps = <Step>[]; был создан только один раз, а затем один и тот же экземпляр используется повторно каждый раз. Вы можете ссылаться на детали в https://github.com/flutter/flutter/issues/22033#issuecomment -424228926
Вам необходимо использовать 

 List<Step> get _steps => <Step>[_lastQualificationStep()];

Шаг 2: изменить groupValue на _qualificationRadioGroupValue 

        children: qualifitcationList
            .map(
              (qualification) => RadioListTile(
            title: Text(qualification.title),
            value: qualification.value,
            groupValue: _qualificationRadioGroupValue,
            onChanged: (value) =>

...
setState(() {
  _qualificationRadioGroupValue = value;
});

рабочая демоверсия

enter image description here

полный код 

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: HomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class HomePage extends StatefulWidget {
  final title;

  HomePage({this.title});

  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  List<Step> get _steps => <Step>[_lastQualificationStep()];
  int _currentStep = 0;
  bool _isStepsCompleted = false;

  @override
  void initState() {
    super.initState();
    //_steps.add(_lastQualificationStep());
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Stack(
        children: <Widget>[
          Stepper(
            steps: _steps,
            currentStep: _currentStep,
            onStepTapped: (step) => onStepTapped(step),
            onStepContinue: onStepContinue,
            onStepCancel: onStepCancel,
          ),
        ],
      ),
    );
  }

  void onStepContinue() {
    _currentStep + 1 != _steps.length
        ? onStepTapped(_currentStep + 1)
        : setState(() => _isStepsCompleted = true);
  }

  void onStepTapped(int step) => setState(() => _currentStep = step);

  void onStepCancel() {
    if (_currentStep > 0) {
      onStepTapped(_currentStep - 1);
    }
  }

  void setSelectRadioButton(int value, int groupValue) {
    print('Radio Value: $value');
    print('GroupValue before setState: $groupValue');
    setState(() {
      _qualificationRadioGroupValue = value;
    });
    print('GroupValue after setState: $groupValue');
  }

  int _qualificationRadioGroupValue = 0;

  Step _lastQualificationStep() {
    List<RadioModel> qualifitcationList = [
      RadioModel(
          title: 'Pre-Engineering',
          value: 0,
          groupValue: _qualificationRadioGroupValue),
      RadioModel(
          title: 'Pre-Medical',
          value: 1,
          groupValue: _qualificationRadioGroupValue),
      RadioModel(
          title: 'ICS', value: 2, groupValue: _qualificationRadioGroupValue),
      RadioModel(
          title: 'Commerce',
          value: 3,
          groupValue: _qualificationRadioGroupValue),
    ];
    return Step(
      title: Text("What is your last qualification?"),
      isActive: _currentStep == 0,
      state: _currentStep == 0 ? StepState.editing : StepState.indexed,
      content: Column(
        children: qualifitcationList
            .map(
              (qualification) => RadioListTile(
            title: Text(qualification.title),
            value: qualification.value,
            groupValue: _qualificationRadioGroupValue,
            onChanged: (value) =>
                setSelectRadioButton(value, qualification.groupValue),
          ),
        )
            .toList(),
      ),
    );
  }
}

class RadioModel {
  final title;
  final value;
  final groupValue;

  RadioModel({this.title, this.value, this.groupValue});
}
...