問題描述
顫振無線電值在步進器中沒有改變 (Flutter Radio Value not Changing in Stepper)
問題是 _qualificationRadioGroupValue 值在 setState() 調用時更新，但在 build 方法調用其重置為其原始值之後我是初學者，所以不知道我做錯了什麼我只測試了 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:
You can copy paste run full code below Step 1: List<Step> _steps = <Step>[]; was built only once and then the same instance is reused every time. You can reference detail in https://github.com/flutter/flutter/issues/22033#issuecomment‑424228926 You need to use
List<Step> get _steps => <Step>[_lastQualificationStep()];
Step 2: change groupValue to _qualificationRadioGroupValue
children: qualifitcationList
.map(
(qualification) => RadioListTile(
title: Text(qualification.title),
value: qualification.value,
groupValue: _qualificationRadioGroupValue,
onChanged: (value) =>
...
setState(() {
_qualificationRadioGroupValue = value;
});
working demo
full code
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});
}
(by Burhan Khanzada、chunhunghan)