I'm having the following problem: My library easy_image_viewer has a request to add swipe-to-dismiss. I implemented it using the Dismissible widget. However, when the user zooms in on an image, I noticed I had to find a way to "deactivate" the Dismissible widget because otherwise the user can't pan around on the zoomed-in image. I solved that by using setState and a dismissDirection variable on the state that can be either none or down.
Now for the weird part: Whenever I call setState and the dismissDirection changes, the PageView jumps back to the first item. I've tried using AutomaticKeepAliveClientMixin, but to no avail.
The code can be found here: https://github.com/thesmythgroup/easy_image_viewer/tree/pagecontroller_problem_demo
Simply run the app (example/lib/main.dart), tap on Show Multiple Images (Simple), swipe to the second image and use pinch & zoom to zoom in. You'll notice it jumps back to the first image. What am I doing wrong?
Instead of changing the dismiss direction you can use confirmDismiss i opened a PR for you to check here
Related
Widget Tree - https://i.imgur.com/xZjMRm2.png
So I have this widget tree, the TextField in question is inside the column where it shows a RenderFlex error(please ignore the error, it's only there because I animate the column to appear and disappear on button pressed).
The problem is every time I tap on the TextField my screen is pushed up from the bottom as the keyboard is pushing their way through.
To fix this issue I tried to put the Scaffold property resizeToAvoidBottomInset: false, but it did not fix the issue.
Also when I close the keyboard, the background of my screen changes.
If you need code snippets please let me know.
Thank you for your time :)
i need a code snippets, but you can add SingleChildScrollView at the top of the column.
and for when you close the keyboard, the background of your screen changes, my guess for that is when the keyboard opens the screen rebuilds and this will call the build function so if you initialized any variables or anything related to the background change inside the build function it will rebuild or re-initialized.
i do not know if my answer helps but it will be better to share a code snippest, have a great day.
I have an AnimatedSlide widget as a child of a column. Depending on a simple condition, it should slide between its initial and a destination position. This works just fine.
The problem is that the AnimatedSlide widget has an InkWell as one of its children. The InkWell's onTap callback works as intended if the AnimatedSlide widget is in is initial position. However, in the destination position, nothing happens when tapping the InkWell.
It seems like the hitbox disappeared completely because even tapping the initial position doesn't do anything.
Is there any way to get this working or is AnimatedSlide simply not meant to be used with InkWells, Buttons, etc.?
I've been trying to make Bookmark button's onTap work because it was working only sometimes.
I'm using the Expanded widget in the Bookmark button but when I toggle debug point on, I saw that its area is shrunk and that's why taps are not working. I give this widget size and added HitTestBehavior.translucent on GestureDetector but no luck.
Any idea how I can fit this button without losing its tap area?
Basic setup:
I have a ListView builder that generates a list based on a List.
Each element of the list is wrapped with a Hero() widget and had a unique tag.
List renders just fine, GestureDetector initiates a 'Details' page on tap, with same widget wrapped in Hero() widget with same tag, and animates just fine, as does the 'return' animation on Navigator.pop();
The problem is...
I allow the user to delete the list element on the details page, if they do this, when I close the page with .pop(), the Hero animation basically animates a blank box of the original size back over the top of the newly rendered (and shorter list) making it look like there are 'blanks' in the list.
I originally thought it was an issue with the state of the list and the list not updating, but lots of checking proves the list is being updated, and the widgets are being re-rendered exactly as they should, it's just that there's a blank box sitting on top of them because of the Hero animation caused by the deletion.
Remove the Hero() widget wrapper and it works fine.
Break the 'tag' so it no longer matches between the two pages and it's fine (but obviously doesn't animate when navigating to the Details page).
Obviously I can stop deletion and move to the main page to avoid the animation at all or remove the animation, but is there a 'correct' way yo do this?
Anyone else hitting the same?
What a quite interesting case you got there. Is your details page statefull? One thing i imagine you could do is to setState after the deletion, so in the rebuild the deleted hero widget wouldn't exists anymore, and when poping navigation the hero navigation won't be fired because it doesn't exist anymore.
What if instead of deleting the item from the list on the pop-up up page, when the user clicks delete on the pop-up page you send a flag/parameter back to the parent page to delete the record. That way the animation will play fine as the pop-up closes, and then you can animate out the deleted record.
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.