DEV Community

Learning Flutter - Part 1 - Intro

rhymes on September 24, 2018

I started learning Flutter today through Udacity's course titled Build Native Mobile Apps with Flutter. The course uses Android Studio but I'm foll...
Collapse
 
defman profile image
Sergey Kislyakov

favouriting Android and Material Design but I might be wrong on this

Kinda. IIRC, they've updated their Cupertino theme recently, but Apple doesn't change that much in design terms between iOS releases, unlike Google.

Does Flutter apps feel native? In terms of performance, styles, etc. Does it bring Node.js with it or it's native mostly?

Btw, I wonder how does their 2D engine handles iOS blur and stuff. If you know, please let me know :)

Collapse
 
rhymes profile image
rhymes

Kinda. IIRC, they've updated their Cupertino theme recently, but Apple doesn't change that much in design terms between iOS releases, unlike Google.

Well, that's good to know. Tracking Google changes might be easier since the two teams are in the same company :-D

Does Flutter apps feel native? In terms of performance, styles, etc.

There are already a few Flutter apps in the world (probably more than in the showcase): flutter.io/showcase/ - the app Reflectly seems to be working well, haven't tried it yet

Btw, I wonder how does their 2D engine handles iOS blur and stuff. If you know, please let me know :)

I googleed "iOS blur" and it seems you can do something like that with Flutter stackoverflow.com/questions/490556... - is this what you're talking about?

Flutter uses a 2D Engine called Skia and adds "shells" for Android and iOS. See github.com/flutter/engine/wiki

Game engines are already popping up: SpriteWidget and Flame

If you think about it, Flutter itself works similarly to a 2D game engine. It repaints areas that need repainting through Skia :D

I'm learning more about Flutter even by answering this :D

Collapse
 
defman profile image
Sergey Kislyakov

is this what you're talking about?

I'm not sure how it works in iOS, but whenever I have a pop-up in iOS, everything behind it is blurred. That's what I'm talking about.

img

Thread Thread
 
rhymes profile image
rhymes

It seems more a behavior controlled by the operating systems than the app but maybe you can replicate it inside your own app. It's just a guess.

Thread Thread
 
defman profile image
Sergey Kislyakov

Could you test it please? I think it's just a matter of changing a theme in your app from Material Design to Cupertino.

Thread Thread
 
rhymes profile image
rhymes

I don't know how, I don't have an iPhone...

I'll check tonight if I can come up with demo that could work on the emulator or something.

Thread Thread
 
rhymes profile image
rhymes

@defman , I did a test. The dialog blurs the background. I think this is the issue when they implemented it: github.com/flutter/flutter/pull/18381

Screenshots from the iOS Simulator:

Screenshot from my Android Phone:

Since widgets are rendered by a 2D library you can effectively use iOS widgets on Android and viceversa, even if you shouldn't :D

Collapse
 
creativ_bracket profile image
Jermaine

Hey rhymes, good to see you writing about Flutter. I've also taken the Udacity course and have just fleshed out the skeleton for an app I'm working on in little time.

Looking forward to your next post.

Collapse
 
dtranmobil profile image
dtranmobil

Thanks for this, I am doing the same thing but with a different course by Maximilian. Good luck and excited to see where you take this!

Collapse
 
rhymes profile image
rhymes

Let me know how that is, I learned a lot from his Vue.js course!

Collapse
 
kris profile image
0xAirdropfarmer

This is a great article on its own. Sharing the learning portfolio of one developer on flutter will help others a lot. Though you pointed out some of the bad aspects of flutter, I think these aspects will be dealt with by flutter. Flutter is something big and every app developer should experience it once. There are lots of flutter templates in the market that will help you get a wholesome experience of flutter development.

Collapse
 
rhymes profile image
rhymes

Definitely, it's also an articles that's more than 2 years old. I'm quite sure that a walkthrough like that done now would have a better experience overall :)

Flutter is a big framework!

Collapse
 
andy profile image
Andy Zhao (he/him)

Nice, I signed up for the nanodegree course a few weeks back. Been dragging my feet to complete the setup, but I finished it today after seeing your post! 🙌

Collapse
 
rhymes profile image
rhymes

Nice! A wave of new Flutter dev(toer)s :D