Flutter 37 - FloatingActionButton Video Lecture | Flutter: Build beautiful native apps in record time - App Development

everybody this is Brian and welcome to
the 37th flutter tutorial man we're
getting close to 40 we crank it through
these and we're doing it very quickly
which shows just how fast and easy
flutter is I don't mean to sound all
evangelical about it but flutter is
actually pretty awesome so today we are
going to do the floating action button
it's a little red button here I'm sure
you've seen it like email applications
or maybe Facebook or something like that
so we're going to go here we're going to
use our live template which we created
in tutorial 35 and you should know what
all of this means we have our main we
have our my app which extends stateful
and we have the state of the my app if
you have no idea what any of those means
please rewind watch the previous
tutorials alright so now that we have
our bare basic application here what
we're going to do is start working on
the state so we're going to say string
whoops it will call this last press eco
and we're just going to say never so
what we're gonna do is really just print
on the screen when they actually press
the button so let's get this in here and
we'll say that's pressed I got to say
well I'm kind of typing this crud out
really really really surprised at the
feedback I've gotten on flutter for
something that's an alpha and not very
well known my inbox has been pretty well
flooded alright so now that we've got
kind of a rough idea of what this is
going to do how do we add the button
well in the scaffold this is why we love
the scaffold there's a floating action
button property and we just simply just
say like kind of like the drawer new
floating action button you notice how
there's a non press because this is a
button then we need to manage that
button press so we're going to just pop
that down pop that down so we can work
with this a little bit here and we're
going to say child new it cuz we want to
add icon in there I'm gonna say icons
dot really know what add timer why not
timer
and then we're gonna just change the
color so I'm gonna say background color
equal colors dot red why not and then we
just simply fill in the on pressed and
we need to make a function here so let's
put this back to null and this is where
the magic is really gonna happen here
we're going to say print just for debug
purposes and then we're going to say set
state and we're gonna say date/time
current equal new date time dot now that
we get the current time and then we're
just going to simply say last press
equal current dot to string just raw
unformatted to string there we go
and that should actually oh no we gotta
fill in our little unpress here
nothing's gonna happen and voila we will
run this in our emulator here pull our
emulator over while this is loading and
this should work without any problems so
one thing that I really love about
flutter while this is loading and it
seems like the more I do these tutorials
the more I fall in love with flutter is
that it's very streamlined it's very
easy to use it follows a very simple
design pattern you notice almost every
single tutorial has followed a similar
design pattern to the point I actually
had to make a live template so here's
our button and we click it you can see
there's our last pressed and there's
pressed one thing I haven't figured out
how to do and I see this in my email
program is you should be able to click
and drag that around the screen to
reposition it so if there's an element
here on the screen you need to tap
underneath it haven't quite figured out
how to do that that may be a future
tutorial I'm sure it's a simple
animation or something they seem to have
thought of everything with flutter so
anyways that is the floating action
button very simple very easy to use
if you found this tutorial helpful the
source code for it and all other
tutorials is out on my website void
rumps comm there's a link right out to
github and you can just crack that open
and it takes you right out to the
tutorials also if you're so inclined be
sure to join the void roams Facebook
group there's seventeen hundred and
growing other members out there we can
help you with all I mean not just
flutter but I mean all different
languages and last but not least if
you're still watching this site is a
hundred percent funded by your donations
that's why I do not have annoying
advertisements in the videos so if you
are working with a company or your
startup you have a few extra bucks feel
free to donate it and I will help fund
the website that's it thank you for
watching