I'm new to Flutter, trying to build my first app.
my main app body contains a one level ExpansionTile list, which can be filterable by a searchbar.
I'm trying to implement the following behavior -
after a user press a tile to reveal the expanded info
1. the keyboard, if present, should hide
2. previously open tile if expanded should collapse
I have tried using GestureDetector on the root widget with on tap function taking focus, but it does not detect tapping on tiles.
using expansionList onExpansionChanged seems logical but i don't understand how to use it
advice will be greatly appreciated..
Related
I have listview in a gridview in a flutter calendar app. I am trying to detect if a particular list view has half-visible or invisible items which need to be scrolled to be seen. If not, the user might not see that a day has an appointment/task unless they change resolution/view.
I'd like to add a little arrow, or overlay, just to warn the user there are extra items. Making the listview scrollable doesn't work well for me because then the gridview loses scrollability, unless I make the ListViews shrinkwrap, which causes its own problems.
Any help appreciated...
you can use an Text to tell the user there is more contact and if the list is on end you remove that text
by using this inview_notifier_list package
and check if onListEndReached
I am currently trying to create something like a TabBar. I created a horizontal ListView which should work as the TabBar and I my goal is, that one row fills itself with a list that contains the cards for the Tab I clicked on and refreshes when I click on another one. Is there a way to do that? It should look like this:
Reference Picture
Did you look at Work with tabs, an introduction to TabBar, TabBarView and DefaultTabController?
You could also create it from scratch using a ListView with a Card wrapped in a GestureDetector or a ListTile, and detect taps on onTap, which would set the selected data and update state using setState.
How do you hide certain widgets when the keyboard is activated? I have an app that overflows when a textfield is activated and instead of just compressing everything I would like to hide several of the widgets that are not necessary when filling out the fields.
I'd first suggest to use SingleChildScrollView as parent. It allows you to show the whole view and make it scrollable when keyboard appears.
If you still want to hide elements, you can know if keyboard is on screen by checking if MediaQuery.of(context).viewInsets.bottom > 100.
Im making an authentication screen where there are Text widgets and TextField wrapped in Stack.
However, when writing in the Textfield, following the activation code (Text) below is pulled up when the keyboard appears;
How to keep the following code position constant at the bottom and when the keyboard appears it is overwritten?
Any answell will appreciated.
Wrap You Stack widget inside a listview, this way the keyboard won't have any effect on its position.
I'm asking how to disable Overlays to move when a Scaffold.of(context).showSnackBar is called like on my video below.
The same thing is happening when the keyboard appear. Sometime the blue floattingButton (+) don't come back to it's original position :-(
Thx in advance.
Problem animation
The FloatingActionButton going up when the Scaffold is displayed is something common to all default implementations.
Give a look to the "Bootom app bar" demo in the Gallery app. Press on the search button and you will see it coming up. Or just add a Scaffold to the app that is built with flutter create command.
This happens because of the way the FAB button is placed on the screen and the effect of displaying the Snackbar by the Scaffold.
The FAB button is displayed at the bottom of the content area of the Scaffold content. When the content area is shrinked to include the BottomAppBar, the FAB goes up with it. It has nothing to do with Overlay.
You have two options:
Either you create your own versión of the FAB which is not
controlled by the Scaffold.
Or you hack the Scaffold so the size of the SnackBar is not taken
into account.
For this second option you can try the following:
Go to the file /lib/src/material/scaffold.dart in your flutter installation and look for the line with the code snackBarSize: snackBarSize, inside the _ScaffoldLayout class.
Replace it with snackBarSize: Size(0.0, 0.0),
You will see that the FAB stays in its place.