I want to hold the camera screen after clicking the image in the flutter.
Now I am holding the image using container, but its displaying mirror image.
Container(
child:
Center(child:
Image.file(new File(imagePath)))),
return new AspectRatio(
aspectRatio: controller.value.aspectRatio,
child: new CameraPreview(controller),
);
Add a Stack view with preview controller and list to display the captured images list and capture button to capture image.
Add the path to list, use the same list to populate in list view. after taking the no of pictures you need to have a submit button to pop the view.
here is the sample code camera_view_sample_code
Related
I've been wondering how to implement a really cool little feature I saw in the Algorand app. I've attached a picture to help illustrate what I mean.
The middle button of the navigation bar at the bottom animates the Send and Receive button onto the view, and then changes it's icon to a cross. These buttons persist when you navigate to other views through the other 4 bottom navigation bar items. And when you click the middle cross button, they disappear.
I tried for a bit to implement this in Flutter. My best attempt was creating my own Bottom Navigation Bar widget for my scaffold, containing the bottom icons and a couple buttons on top, but this seemed really janky. I'm not asking for specific code examples of how to get this done, just rather a point in the right direction of how to do this kind of thing.
Speaking of specific code, their code is actually open source, and the code for the bottom nav bar is here
https://github.com/algorand/algorand-wallet/blob/master/ios/Classes/ViewControllers/Core/Container/TabBar/TabBarController.swift
I've been reading it but unfortunately my Swift is not all that great, working through it line by line. I can make a custom bottom nav bar with Container and Row, and then figure out the onTap behaviours, but it's the presenting two buttons above it that's really blocking me.
Scaffold’s floatingActionButton parameter is exactly what you’re looking for.
Need two buttons? No problem, it doesn’t have to be a FloatingActionButton, it can be any widget, including a Row.
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
FloatingActionButton.extended(
icon: Icon(Icons.arrow_upward),
label: Text('Send'),
onPressed: (){},
backgroundColor: Colors.redAccent),
Padding(padding: EdgeInsets.symmetric(horizontal: 8)),
FloatingActionButton.extended(
icon: Icon(Icons.arrow_downward),
label: Text('Request'),
onPressed: (){},
backgroundColor: Colors.teal),
]
),
Then to trigger it with a button press, just make it conditional:
bool appear = false;
...
floatingActionButton: appear ? Row(...) : null
Then you can make it appear or disappear by changing the boolean in your button’s onPressed (and don’t forget to call setState).
I am new at Flutter. Your advice would be super appreciated!
I am trying to display a button at the bottom of a screen after a listview.
When I enter this code...I can perfectly display my listview. Please note there is no button yet in this code.
#override
Widget build(BuildContext context) {
return Scaffold(
body: SafeArea(
child: getTarotCards(),
),
);
}
Now, when I try to add in the Bottom Button which is a custom widget I made, I add in a column and a children widget so I can list the items I need to display.
I know that the problem is that the getTarotCards() is a method that returns a Listview so that's why I can't place it here (because I'm calling a function and not a widget.)
Does anyone know how I can call my method to display the listview and then display my button underneath this?
Right now when I run this card, my screen is blank and all I see is the black scaffold.
Thank you very much for your help! :)
You should make shrinkWrap (named parameter of ListView) to true in ListView if you are using ListView inside a Column
After adding InheritedWidget to app I recognize that ListView loses scroll position (selected item index) when I come back to list from details screen using Pop().
I know that widget can be rebuild any time but maybe someone can suggest solution without handling cache manually.
P.S.
Scroll position was fine before implementing InheritedWidget
no any code so a shot in the dark
try to add 'key'
like this
ListView(
key: const PageStorageKey<String>('some unique text'),
//other parameters
);
I made a Chat app, I made two Text widgets inside a Column widget, now I want to make the Chat message (the 2nd text Widget) Text Widget to go Vertically after filling the spaces horizontally, so what can I do, this is the image of the Chat screen
and What happens is this(image), the images are embedded because I'm a new user
The Code of it is this:-
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
/// USER NAME
Text(userName, style: Theme.of(context).textTheme.subtitle),
/// CHAT MESSAGE
Container(
margin: const EdgeInsets.only(top: 5.0),
child: Text(
theText,
maxLines: null,
style: Theme.of(context).textTheme.body2,
),
),
],
),
I expected the Code to work like the traditional Chat app's messages, the First text widget (USERNAME) worked but the 2nd one (the actual CHAT MESSAGE) didn't work as it Overflows by pixels, So how can I fix this and Make it like the traditional Chat Messages??
I resolved the problem! And here it is:
I just wrapped my whole Column widget with a Flexible widget and it resolved my problem and now I can add Multiline Messages!
I'm keeping the post as to any Newbie facing the same problem 'may' find this useful...
I want animate widgets like the below gif
But whats happening is like the below gif
I just added a color to the container to get a sense of the frame of parent container
How can we make the inner widgets to clip when moving out of parent widget?
I am using Transform to animate like projects.
Please let me know if any more info is required.
If you want your red container to clip overflow, you have to wrap it into a ClipRect.
new ClipRect(
child: new Container(color: Colors.red, child: myAnimationThing),
),