How can i use condition in widget? - flutter

How can I use condition in widget? I did it with empty widget like container() or Text() but when I put empty Widget in row() and give spaceBetween of MainAxisAlignment it takes their own space without any showing. Searching on the internet I think there are only the old info so that's not working anymore (if I am wrong I'm really sorry).
If conditions are not allowed and I do not want to show the widget - How can i do that?

If i understand correctly, you want to render Row conditional with size of childrens.
List<Widget> elements = []
Row(children: elements)
First option is to initiate elements inside your initState(){} method.
Another one, if you want to change it dynamically, then you have to know about setState(){} method and how key works, that is optional attribute of all Stateful/Stateless Widgets.

Related

My ValueNotifier is not Working properly, why?

I have a GestureDetector inside a ListView and a CustomFilter widget in my Scaffold.
When I filter or change me showList in CustomFiter Widget it seems to be updated because I print the correct value from my CustomValueNotifier.
When it comes to my parent widget which is supposed to show my showList inside the GestureDetector the value is not updated at all and is at all times an empty list.
So the problem seems to be between the connection of my parent widget which hold both the filter widget, which upadtes the list, and my CustomValueNotifier, which takes the updated value but as I said before does not provide it at the widget.
Right now I also do the onnection with getter and setter so in the code im goin to show the showList will be taken the correct value from the getShowList() method. The problem is it doesnt change when the filter is being activated, on change of each filter, but after that when i press somewhere inside the gesturedetector again.
I have tried Change Notifier,Value Notifier, Provider does not seem to be what i can use in this example, setState but of course it updates on click in gestureDetector later

How to update widget tree from another widget class - Flutter

I am facing problem to re-render the page when a variable changes in one class/widget (both parent and child widgets are stateful classes).
Here is how it goes:
I have three buttons in one class which changes a variable state (foodCategory).
int foodCategory = 0;
// down in the elevated button body - i am updating the variable
setState(() {
foodCategory = 1;});
While in the other widget, i am using this variable to perform certain actions:
for (var item in foodItems.values.elementAt(foodCategory))
GestureDetector(........ and so on...
However in the second snippet, the widget dose not know if there has been a change and it is not calling the buildcontext again...
I am not sure how to overcome this problem. I have tried valuelistenablebuilder but in vain. Maybe i dont know how to use it in the loop (i am using foodcategory as an int (iterator)).
it happned to be that i was sing valuelistenable builder in a wrong way.
It is easy. Just mark the variable and changes as valueNotifier. In my case, i needed to mark foodCategory as a valueNotifer.
Than, i needed to wrap the Widget (in my case column widget) as ValueListenableBuilder. This solved my issue.

Text Widget in a Column affecting Alignment of other widgets in the Column in Flutter

I am trying to make a row of widgets with a small text below them mentioning what that button is for. One of the label is supposed to be multi lined but this is affecting the button in the column. How can I align them properly without it affecting the buttons placed?
My Widget Structure is something like this:
Column -> Row -> Column -> GestureDetector, Text
Try to add crossAxisAlignment: CrossAxisAlignment.start at the Row containing all the widgets.
If that doesn't work, post all of the widget parent's code

Flutter: hide/show widget by key dynamically

How can we show/hide widget inside another widget in flutter?
I have list of question which are inside list view builder I want to hide questions on user answer selection.
if you have all equations in question[] and whether to show them in show[], you could place into listbuild
return (bool[index] ? Card(child:Text(question[index])) : Container())
This returns the card in bool is true and the empty (not displayed container) otherwise.
(I think the other answer would do the trick too)
Another option you can consider though is using the Visibility widget to wrap the "question" widget and toggle the visible property based on a bool. To make this (or the above solution) work, you'd want to update the value of this bool using e.g. setState on the method called when,as you say, "user answer selection" happens.
Of course, if you have a more complicated application it might make more sense to use Provider for state management and wrap all of this in a Consumer.

Put ListView in/out of Expanded based on how big the ListView is going to be

I have a ListView that might be big / small, depends on result of API call. What I want to do is if the result is too big, put this ListView inside Expanded.
The client could be anything, phone or tab, all with different sizes, both horizontal and vertical orientation supported.
How do I detect the size of the ListView before it gets built?
if (MyListView.height > this.container.height) { // ListView isn't built yet, so how can I know the size?
return Expanded(child: MyListView);
}
return MyListView();
// MyListView is just a ListView inside a Container
API calls should be made inside initState function so that you don't hit the endpoint with each rebuild. (which can happen many times) You can create an empty future object in your statefull widget and in the initState function assign your api call to the future object. In build method add a FutureBuilder widget to control the state of the api call. (loading, errors? etc.) Once you get the data just check the length of the list and depending on that you can decide what to do:
data.length < 20 ? MyListView() : Expanded (child: MyListView())