I am using Flutter getx package.
I know how to use "ever" with (.obs) variable like this
class CountController extends GetxController {
final count = 0.obs;
#override
void onInit() {
ever(count1, (_) => print("$_ has been changed"));
super.onInit();
}
}
But how to use "ever()" or triggering specific callbacks when variable change if the variable doesn't have (.obs) because I am using GetBuilder (not : Obx or GetX) in my view
class AnyScreen extends StatelessWidget {
final controller = Get.put(CounterController());
#override
Widget build(BuildContext context) {
ever(controller.counter, (value) => print("$value has been changed"));
}
#override
Widget build(BuildContext context) {
return Text("whatever!");
}
}
NOTE: Workers should always be used when starting a Controller or Class, so it should always be on onInit (recommended), Class constructor, or the initState of a StatefulWidget (this practice is not recommended in most cases, but it shouldn't have any side effects)
docs
Related
I am currently developing an application that uses MVVM architecture, but I don't think this is relevant to my problem. When I was adding tests to my View Model I ran into a problem, when I was trying to mock my View Model, since it was being passed to the Screen State class only the type of the View Model via template, I couldn't find a way to mock it.
Something like this:
class MenuScreen extends Screen {
const MenuScreen({Key? key}) : super(key: key);
#override
_MenuScreenState createState() => _MenuScreenState();
}
_MenuScreenState class extends ScreenState<MenuScreen,
MenuViewModel, MenuData> {
...
}
abstract class ScreenState<T extends Screen, T2 extends ViewModel<T3>,
T3 extends StateData> extends State<T> {
ScreenState();
late final T2 viewModel;
Widget buildScreen(BuildContext context);
#override
Widget build(BuildContext context) {
return MultiProvider(
providers: [
ValueListenableProvider<T3>.value(value: viewModel),
],
builder: (context, _) => buildScreen(context),
);
}
#override
#mustCallSuper
void initState() {
super.initState();
viewModel = context.read<ViewModelFactory>().create<T2>();
}
#override
#mustCallSuper
void dispose() {
viewModel.dispose();
super.dispose();
}
}
ViewModelFactory is responsible for create an instance of MenuViewModel, that for my unit tests scenario should be something like MockMenuViewModel.
Is there any way I can mock up MenuViewModel within this ScreenState class or somehow inject the mock view model instance i want in the screen state instance?
How do I move a variable that uses a context outside of the build method so that it is created once?
class _EventListState extends State<EventList> {
#override
Widget build(BuildContext context) {
final eventNotifier = EventInherited.of(context).eventNotifier;
...
You can use the late modifier.
class _EventListState extends State<EventList> {
late final eventNotifier = EventInherited.of(context).eventNotifier;
#override
Widget build(BuildContext context) {
...
make
eventNotifier
class variable and connect it to the getter function.
class _EventListState extends State<EventList> {
var? eventNotifier;
#override
Widget build(BuildContext context) {
eventNotifier = EventInherited.of(context).eventNotifier;
}
Dynamic get getEventNotifier => this.eventNotifier;
You can use the didChangeDependencies() method. The context is available at that point.
#override
void didChangeDependencies(){
super.didChangeDependencies();
final eventNotifier = EventInherited.of(context).eventNotifier;
}
This method will be called again in certain scenarios, so be careful about what you are initializing.
This thread has more information on when it is recalled, but in general it is okay to use for initialing listeners.
Understanding Flutter didChangeDependencies mechanics
How do I access the variable "selectedTag" from this statefulWidget:
class _AlertDialogOneState extends State<AlertDialogOne> {
Item selectedTag;
...
}
}
inside this statelessWidget :
class CardTile extends StatelessWidget {
#override
Widget build(BuildContext context) {
return Container(...
Pass it as parameter,
class CardTile extends StatelessWidget {
final Item selectedTag;// Add this
CardTile(this.selectedTag); // Add this
#override
Widget build(BuildContext context) {
return Container(...
To pass this variable, you have multiple ways:
Pass it as a constructor when u navigate to this class using your navigator
Navigator.push(
context,
MaterialPageRoute(builder: (context) => CardTile(selectedTag)),
);
class CardTile extends StatelessWidget {
Item selectedTag;
CardTile(this.selectedTag);
#override
Widget build(BuildContext context) {
return Container(...
Use a state management like provider
class ProviderData with ChangeNotifier {
Item selected;
void changeSelection(newSelect) {
selected = newSelect;
changeNotifier();
}
}
and inside any class you need call this:
final providerData = Provider.of<ProviderData>(context);
so you can access the variable or change it using this instance like this:
final variable = providerData.selected;
providerData.changeSelection(newValue);
print(variable);
hope this help but i see that it is better to pass it through the constructor if you are not using a state managemnt, however i just gave you an example for illustration
I am trying to pass a User object from my stateful widget, to its state.
class NavBar extends StatefulWidget {
final User user;
NavBar({this.user});
#override
NavBarState createState() => NavBarState();
}
class NavBarState extends State<NavBar> {
int _currentIndex = 0;
final List<Widget> _children = [
CalendarWidget(),
HomeWidget(),
MessagingWidget(),
ProfilePage(user: user)
];
Widget build(BuildContext context) {
All other solutions say to use widget.user like ProfilePage(user: widget.user) but that throws error:
Only static members can be accessed in initializers.dart(implicit_this_reference_in_initializer)
How can I access User object in the state of NavBar so I can send it to ProfilePage()?
you can use widget.yourObjectsName to access StateFul widget's Object in its state
you can use any property of Stateful Widgets from its state by widget property of state which gives reference to state's Widget properties.
i need some help understanding how to obtain data from inherited widget.
I usually get the parameter from my widget directly from the build method using
#override
Widget build(BuildContext context) {
//THIS METHOD
var data = StateContainer.of(context).data;
return Container(child:Text("${data.parameter}"));
}
But this method cant be called from initState since there is no buildContext yet.
I need in the initState method to have that parameter (i call my fetch from server in that and i need to pass that data to my function), so, how should i do it?
#override
void initState() {
otherData = fetchData(data);
super.initState();
}
I tried using didChangeDipendencies() but it is called every time the view is rebuilt (popping from screen, etc.) so it is not what i want to use and neither the FutureBuilder widget.
Any suggestion?
First, note that you probably do want to use didChangeDependencies. But you can't just do your call there without any check. You need to wrap it in an if first.
A typical didChangeDependencies implementation should look similar to:
Foo foo;
#override
void didChangeDependencies() {
super.didChangeDependencies();
final foo = Foo.of(context);
if (this.foo != foo) {
this.foo = foo;
foo.doSomething();
}
}
Using such code, doSomething will be executed only when foo changes.
Alternatively, if you are lazy and know for sure that your object will never ever change, there's another solution.
To obtain an InheritedWidget, the method typically used is:
BuildContext context;
InheritedWidget foo = context.inheritFromWidgetOfExactType(Foo);
and it is this method that cannot be called inside initState.
But there's another method that does the same thing:
BuildContext context;
InheritedWidget foo = context.ancestorInheritedElementForWidgetOfExactType(Foo)?.widget;
The twist is:
- this method can be called inside initState
- it won't handle the scenario where the value changed.
So if your value never changes, you can use that instead.
1, If you only need InheritedWidget as a Provider of parameter for Widget.
You can using on initState as bellow:
#override
void initState() {
super.initState();
var data = context.ancestorInheritedElementForWidgetOfExactType(type)?.widget;
}
2, If you need listener to re-render widget when data of InheritedWidget change. I suggest you wrapper your StatefulWidget insider a StatelessWidget,
parameter of StatefulWidget is passed from StatelessWidget, when InheritedWidget change data, it will notify to StatelessWidget, on StatefulWidget we will get change on didChangeDependencies and you can refresh data.
This is code guide:
class WrapperDemoWidget extends StatelessWidget {
#override
Widget build(BuildContext context) {
DemoData data = StateContainer.of(context).data;
return Container();
}
}
class ImplementWidget extends StatefulWidget {
DemoData data;
ImplementWidget({this.data});
#override
_ImplementWidgetState createState() => _ImplementWidgetState();
}
class _ImplementWidgetState extends State<ImplementWidget> {
#override
void initState() {
super.initState();
//TODO Do sth with widget.data
}
#override
void didChangeDependencies() {
super.didChangeDependencies();
//TODO Do change with widget.data
}
#override
Widget build(BuildContext context) {
return Container();
}
}
I prefer the solution with didChangeDependencies because Future.delayed solution is a bit hack, looks unprofessional and unhealthy. However, it works out of the box.
This is the solution I prefer:
class _MyAppState extends State<MyApp> {
bool isDataLoaded = false;
#override
void didChangeDependencies() {
if (!isDataLoaded) {
otherData = fetchData(data).then((_){
this.isDataLoaded = true;
});
}
super.didChangeDependencies();
}
...
You can also get the context in initState, try using a future with duration zero. You can find some examples here
void initState() {
super.initState();
Future.delayed(Duration.zero,() {
//use context here
showDialog(context: context, builder: (context) => AlertDialog(
content: Column(
children: <Widget>[
Text('#todo')
],
),
actions: <Widget>[
FlatButton(onPressed: (){
Navigator.pop(context);
}, child: Text('OK')),
],
));
});
}
i use it to make loading screens using inherited widgets and avoid some global variables