I am learning Flutter. The version I am using is Flutter 1.24.0-10.2.pre • channel dev.
I am working on a project that could run on Windows 10 and Android. Therefore I use the dev channel. The project is a notebook, each note has a title, content and tags. I use a ListView to show the titles.
Is it possible to show an edit icon on that row and covers parts of the title when user tap the title? The icon is hidden when the row is not highlighted, tapped.
I did try to put a Scaffold inside a Scaffold, but it fail.
Thank you very much!
If you use a stateful widget, then onTap: () setState(() => listViewTileTabbed[index] = true),
and in the tile you also add
leading: listViewTileTabbed[index] ? Text('Edit') : null,
Related
I have one question regarding Flutter UI. You guys know what this is called in flutter at "Nutrition Fact" part as my picture shown below? The keyword or package that I can search regarding that part. Hope u guys can help me.
Image Reference
It is called Bottom Sheet.
There are so many dart packages but any one of two can be use for your example.
First : solid_bottom_sheet
Second : modal_bottom_sheet
It looks like a rounded container with a row widget. Row widget has 2 children: Text("Nutritional Fact") and IconButton. MainAxisAlignment of row is set to MainAxisAlignment.spaceBetween.IconButton's onpressed parameter might show a BottomModalSheet to display the fact.
Total noob here.
I'm making an app menu in Android Studio, using Flutter/dart as my code base. I need to make a series of horizontal buttons laid out in a vertical column.
The button design is essentially an outline button. White button but with a grey outline.
Would it be best to put these buttons in a ListView and have OutLineButtons as the buttons OR have them in a column and the children of that column be rows with the buttons inside?
Appreciate the advice.
An image i pulled from google to illustrate the layout of what i'm looking for
welcome to the Flutter world.
You can use the Column class to do that. [Here is the doc]
Inside that Column You can add more widget as many as you want.
Example:
Column(
children: <Widget>[
//Your first menu widget
//Your second menu widget
//Your third menu widget
],
)
You can read the docs or look for tutorials for more information. Happy creating
I have a showModalBottomScreen activated displaying several images in GridView.
Here's my App Screen with BottomModalSheet on
All of those images are Draggable
Here's the Draggable Image
return Container(child: LongPressDraggable(data: img,feedback: img,child: img));
What I need my app to do is : When I start to drag one of the images, the Bottom Modal Sheet should close(pop) and I must be able to submit the draggable onto a drag target. But the Bottom Modal Sheet closes and I am unable to retain the draggable.
This is what I used:
onDragStarted: ()=> Navigator.of(context).pop()
The error message is get in my debug console: OPTS_INPUT: First frame was drawed before optimized, so skip!
How do I overcome this?
Perhaps you should create a PersistentBottomSheetController controller inside your widget, along with GlobalKey<ScaffoldState> key for your widget's scaffold ( used to control the showModalBottomSheet ) .
And change onDragStarted:() => controller.close()
If you could provide more details about your app, maybe I would be of more help.
I added Row widget with rendering on stack widget. I actually want to add more container, but it shows when I click on IconButton. After clicking it does not shows on screen. So how is possible in Flutter ?
Any suggestion?
you could create a stack widget and when the IconButton is pressed you call a function to display the new container( which probably is inside the stack widget you are going to implement)
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.