Adding an AlertDialog with RadioListTile Widgets to a Flutter application - flutter

Question

I'm working on writing a Flutter application where I want to check on start up if a certain value is stored. If this value is not stored (i.e. the app was just downloaded or data was cleared), I want to create a dialog and have the user choose which value to store out of 3 options. I also want users to be able to change this value through the settings pane as well where I feel it would be easier to just make the same alert dialog pop up.
For my app, my main view is a stateful widget and I've added the code to make the dialog display on startup.
class Home extends StatefulWidget {
const Home({Key key}) : super(key: key);
#override
_HomeState createState() => _HomeState();
}
class _HomeState extends State<Home> {
bool is_setting_set = false;
#override
void initState() {
super.initState();
showSettingChoosingDialog(context);
}
void showSettingChoosingDialog(BuildContext context) async {
return showDialog(
context: context,
builder: (context) => AlertDialog(
title: Text('Choose your setting'),
content: CustomRadioListTileWidget(),
actions: <Widget>[
TextButton(
child: const Text('Done'),
onPressed: () {
Navigator.of(context).pop();
},
),
],
));
}
#override
Widget build(BuildContext context) {
return DefaultTabController(
length: 2,
child: Scaffold(
drawer: Drawer(
child: ListView(
children: [
ListTile(
title: const Text('Settings'),
onTap: () {},
)
],
),
),
appBar: AppBar(
title: const Text('App'),
),
body: TabBarView(...),
),
);
}
}
but this throws an error because the CustomRadioListTileWidget is also a StatefulWidget. The stack trace is:
VERBOSE-2:ui_dart_state.cc(199)] Unhandled Exception: dependOnInheritedWidgetOfExactType<_LocalizationsScope>() or dependOnInheritedElement() was called before _HomeState.initState() completed.
When an inherited widget changes, for example if the value of Theme.of() changes, its dependent widgets are rebuilt. If the dependent widget's reference to the inherited widget is in a constructor or an initState() method, then the rebuilt dependent widget will not reflect the changes in the inherited widget.
Typically references to inherited widgets should occur in widget build() methods. Alternatively, initialization based on inherited widgets can be placed in the didChangeDependencies method, which is called after initState and whenever the dependencies change thereafter.
#0 StatefulElement.dependOnInheritedElement.<anonymous closure> (package:flutter/src/widgets/framework.dart:4821:9)
#1 StatefulElement.dependOnInheritedElement (package:flutter/src/widgets/framework.dart:4864:6)
#2 Element.<…>
I could move the CustomRadioListTileWidget code to this widget here but then I don't want to copy paste the same code for use in my settings pane. Is there a way to share this alert dialog with multiple components?

Answer 1

IMO it's not related to the CustomRadioListTileWidget widget and the fact that it's a stateful widget.
The thing is that you don't have access to context in the initState, you need to call the showSettingChoosingDialog after the build method has been called once and then you have access to context object.
But you can still do it in initState, just call the showSettingChoosingDialog function in a Future.delayed(Duration.zero, clbk) call back, like the code below:
#override
void initState() {
Future.delayed(Duration.zero, () => showSettingChoosingDialog(context));
super.initState();
}
This ensures that the build has been run once, why? Because the callback inside the Future.delayed is called when the current call stack is empty.
BTW, you don't need to pass the context into the showSettingChoosingDialog function, it has access to the context provided by State class.
So it can become:
Future.delayed(Duration.zero, () => showSettingChoosingDialog());
Or shorter:
Future.delayed(Duration.zero, showSettingChoosingDialog);