Would you like to inspect the original subtitles? These are the user uploaded subtitles that are being translated:
1
00:00:00,600 --> 00:00:00,940
All right,
2
00:00:00,960 --> 00:00:05,830
So the first thing that I want to talk about is: "What exactly is Flutter?".
3
00:00:06,150 --> 00:00:12,000
And to be able to answer this question, we first have to put ourselves into the mind of a mobile app
4
00:00:12,000 --> 00:00:12,520
developer.
5
00:00:13,020 --> 00:00:14,170
So here's one.
6
00:00:14,190 --> 00:00:15,080
This is Bob.
7
00:00:15,120 --> 00:00:17,550
And he's an iOS developer.
8
00:00:17,550 --> 00:00:24,570
Now, Bob made this really cool app where instead of matching with other people, you get to match with
9
00:00:24,570 --> 00:00:29,460
foods! And you get to figure out what food you most want to eat.
10
00:00:29,550 --> 00:00:31,120
And it's a super popular app.
11
00:00:31,140 --> 00:00:34,560
Everybody loves it. But there's just one problem.
12
00:00:35,070 --> 00:00:40,950
It's only on iOS. So every other day he gets a question of: "When's it coming to Android?".
13
00:00:40,950 --> 00:00:42,570
"When is it coming to Android?"
14
00:00:42,600 --> 00:00:44,620
"When is it coming to Android?"
15
00:00:44,880 --> 00:00:52,940
And at some point, he finally has had enough and he decides to go and buy loads and loads of books. study
16
00:00:52,950 --> 00:01:00,390
Java. study Android development and finally, he's able to have both of these buttons on his website - "Get
17
00:01:00,390 --> 00:01:03,290
it on Google Play" and "Download on the App Store".
18
00:01:03,660 --> 00:01:08,430
So he now has the same app on the Google Play and the App Store.
19
00:01:08,440 --> 00:01:15,000
Now this is great for the users, but for Bob, it means that when he has any updates that he wants to make
20
00:01:15,000 --> 00:01:22,890
to the app or any bug fixes, he has to push those both to the Play Store as well as the App Store.
21
00:01:22,890 --> 00:01:26,070
So two places now instead of one.
22
00:01:26,070 --> 00:01:32,660
And he has to maintain two code bases. So that's a lot of work down the line.
23
00:01:32,670 --> 00:01:40,110
It's basically double the amount of work that he used to have. But that's not all because he gets complaints
24
00:01:40,110 --> 00:01:46,250
from users saying that "Hey in your app some of the layouts look really weird".
25
00:01:46,260 --> 00:01:47,670
"It doesn't look right."
26
00:01:47,670 --> 00:01:51,310
"Like why is this button like twice the size of everything else?"
27
00:01:51,330 --> 00:01:52,960
"What is wrong with your app?"
28
00:01:53,250 --> 00:02:01,020
Now, this is because not only does he have to support a huge array of different screen sizes and aspect
29
00:02:01,020 --> 00:02:10,440
ratios for the iOS ecosystem - the iPads, the iPhones, the older iPhones, but he also now has a whole
30
00:02:10,440 --> 00:02:17,730
bunch of Android devices. And because Android devices can be made by literally anybody, the number of
31
00:02:17,730 --> 00:02:20,910
different screen sizes is just massive.
32
00:02:20,910 --> 00:02:26,580
And it's really hard to keep on top of what are all of the different screen sizes in order to be able
33
00:02:26,580 --> 00:02:30,060
to design your app to look good on all of them.
34
00:02:31,530 --> 00:02:34,010
Now here's where Flutter comes in.
35
00:02:34,290 --> 00:02:41,640
The guys at Flutter had this question: "More and more so we're seeing screens everywhere.
36
00:02:41,640 --> 00:02:46,750
"There's screens on fridges. There's screens at the bus stop."
37
00:02:46,860 --> 00:02:54,920
"There's screens in your mirror. And they're all different aspect ratios and different screen sizes."
38
00:02:55,050 --> 00:03:04,320
"So why can't we create something that can intelligently and easily allow developers to design beautiful"
39
00:03:04,320 --> 00:03:08,950
"interfaces for all of these different types of screens?"
40
00:03:09,150 --> 00:03:11,320
And this is exactly what Flutter is.
41
00:03:11,340 --> 00:03:20,400
It's simply a tool kit that makes it easy for developers to design beautiful interfaces for all sorts
42
00:03:20,400 --> 00:03:23,250
of screen sizes and devices.
43
00:03:23,250 --> 00:03:30,510
And it comes with a whole bunch of pre-built widgets that make it easy to lay out your app. So straightforward
44
00:03:30,510 --> 00:03:36,780
things such as laying out your app with rows or with columns or stacks.
45
00:03:36,780 --> 00:03:43,110
And it borrows some of the concepts from web design where you can have things that are centred or have
46
00:03:43,110 --> 00:03:45,750
padding and margins.
47
00:03:45,750 --> 00:03:56,190
And what if you could use this system to design and develop for almost any device? Because all that Flutter
48
00:03:56,190 --> 00:04:06,180
does is, it asks for a blank window on the device, be it on Android or iOS or web or desktop.
49
00:04:06,240 --> 00:04:15,450
All it's asking for is just a simple blank window. And what Flutter will do is, it will draw onto that blank
50
00:04:15,450 --> 00:04:22,890
window whatever it is that needs to be rendered and whatever animations, or interactions, or changes.
51
00:04:23,010 --> 00:04:25,540
It's all painted on by Flutter.
52
00:04:26,220 --> 00:04:33,630
So this means that instead of having to make iOS apps the Apple way and make Android apps the Android
53
00:04:33,630 --> 00:04:41,460
way, you can simply use a whole bunch of pre-built widgets from Flutter, such as a floating action button
54
00:04:41,850 --> 00:04:44,490
or a linear progress indicator.
55
00:04:44,820 --> 00:04:52,200
And you can simply put these into your app, no matter which platform you're working on. And they've even
56
00:04:52,200 --> 00:04:55,980
designed widgets that look the part for each platform.
57
00:04:56,250 --> 00:05:03,720
So, for example, your alerts might look like this on your Android app, but you can also specify that if
58
00:05:03,720 --> 00:05:11,400
your app is being run on iOS, then they should look like this, making your app look like it was created
59
00:05:11,580 --> 00:05:13,470
in a native way.
60
00:05:13,470 --> 00:05:20,400
This is how Flutter works. You get access to a whole bunch of widgets so you can see these widgets as
61
00:05:20,580 --> 00:05:22,350
Lego blocks almost.
62
00:05:22,350 --> 00:05:30,390
And by plugging them together and customizing it you end up with your beautiful app that can be deployed
63
00:05:30,630 --> 00:05:31,650
almost anywhere.
64
00:05:32,520 --> 00:05:37,740
Let's take a look at how easy it can be working with widgets in real life.
65
00:05:37,740 --> 00:05:45,360
I've created a blank app. And I'm going to go ahead and add an app bar. And this is a pre-built widget
66
00:05:45,660 --> 00:05:47,430
which is built by Flutter.
67
00:05:47,880 --> 00:05:52,890
And as soon as I hit save, my app bar gets painted onto the screen.
68
00:05:52,890 --> 00:05:54,720
So I don't like it in blue.
69
00:05:54,750 --> 00:05:57,720
So let's customize it to change it to red.
70
00:05:58,290 --> 00:06:02,340
So now I added colors widget and I changed the color.
71
00:06:02,370 --> 00:06:06,780
So now let's add a text widget that adds a title to the app bar.
72
00:06:07,380 --> 00:06:13,710
And just like Lego, I've plugged together all my widgets and I've managed to build my app bar in a matter
73
00:06:13,710 --> 00:06:20,330
of seconds. And there's loads of different widgets that are pre-built.
74
00:06:20,380 --> 00:06:27,730
For example, if you wanted a floating action button, then we just create that widget. And we can customize
75
00:06:27,730 --> 00:06:34,330
it by changing its properties such as the background color or what should go inside it. Piece by piece,
76
00:06:34,480 --> 00:06:35,830
widget by widget,
77
00:06:35,970 --> 00:06:43,060
I can build up my app and customize it to my liking with very few lines of code.
78
00:06:43,190 --> 00:06:46,070
Now what if I wanted some functionality?
79
00:06:46,160 --> 00:06:52,370
Well, I can simply create a variable to keep track of, say, the number of donuts that I've eaten in a day
80
00:06:52,970 --> 00:07:01,580
and I can change my text field to embed that number variable in there. And then all that happens is when
81
00:07:01,580 --> 00:07:08,680
the user presses on the red button, then it will increase the number of doughnuts that I've eaten. And Flutter
82
00:07:08,690 --> 00:07:16,130
makes it incredibly easy to build a beautiful interface for our app using these widgets as well as allowing
83
00:07:16,130 --> 00:07:19,390
us to customize the widgets to our liking.
84
00:07:19,460 --> 00:07:26,690
And finally, building functionality on top of those widgets is also as simple as updating a number of
85
00:07:26,690 --> 00:07:29,750
variables. And that we're going to dive into.
86
00:07:30,620 --> 00:07:39,380
So now that I've created my doughnut counter app, the best part is I can now deploy that code to all sorts
87
00:07:39,380 --> 00:07:47,600
of different devices and platforms without having to rewrite the code or learn a new technology, a new
88
00:07:47,600 --> 00:07:49,730
skill, or a new programming language.
9200
Can't find what you're looking for?
Get subtitles in any language from opensubtitles.com, and translate them here.