The tutorial assumes that you are at least familiar with Android development and know what scary words like View, ViewGroup, Java, Kotlin mean.
- Overview of Flutter
- Installing Flutter
- Working with an editor
- Learning Dart
- Flutter introductory resources
- Architecture and state management
- Dependency Injection
- Navigation & routing
- Network requests and Serialization
- Persistence
- Reactive/Rx
- Android functionality and corresponding plugins
- Activity/Fragment?
- Lifecycle?
- Orientation change?
- Declarative vs Imperative
- Android views and their corresponding Flutter widgets
- Hint on an EditText
- Custom Views/Canvas drawing
- Gesture and click listeners
- Glide/Picasso/Fresco(Image loading)?
- Animations
- Resource management
- Theming
- Gradle
- Plugins/Libraries
- Local notifications
- Firebase
- Communicating with native platform
- NDK
- Background processing
- Testing and profiling
- Flavors and deployment
- Samples and tutorials
- Community
-
Tensor Programming excellent programming videos, regularly posts Flutter tutorials
Basically Flutter world is split between BLoC/Rx(kind of like MVVM) and Redux.
While there's no Dagger 2 in Flutter, there's inject.dart.
Flutter uses Navigator for navigation.
Handling intents from external applications
No, there's no Retrofit or Gson/Moshi in Flutter.
-
To interact with SQLite you use sqflite plugin
Dart is a reactive language out of the box, you can either use Dart's Streams or RxDart if you're familiar with ReactiveX.
Both activities and fragments are represented as a Widget in Flutter.
Read more: What are the equivalent of activities and fragments in Flutter?
How do I listen to Android activity lifecycle events?
How do I handle landscape transitions in Flutter?
In the imperative style, you would typically go to ViewB’s owner and retrieve the instance b using selectors or with findViewById or similar, and invoke mutations on it (and implicitly invalidate it). For example:
// Imperative style
b.setColor(red)
b.clearChildren()
ViewC c3 = new ViewC(...)
b.add(c3)
In the declarative style, view configurations (such as Flutter’s Widgets) are immutable and are only lightweight “blueprints”. To change the UI, a Widget triggers a rebuild on itself (most commonly by calling setState() on StatefulWidgets in Flutter) and constructs a new Widget subtree.
// Declarative style
return ViewB(
color: red,
child: ViewC(...),
)
Why Flutter uses declarative UI
Flutter contains much more widgets than Android SDK, you can discover them here and in Widget index.
The most common Android views and their corresponding Flutter widgets are here:
To add a hint to an EditText(TextField) you add InputDecoration to it:
body: Center(
child: TextField(
decoration: InputDecoration(hintText: "This is a hint"),
)
)
Flutter has similar to Android Canvas API.
To create custom widgets you compose smaller widgets.
Flutter is able to load images from URL out of the box, all you have to do is use the Image.network constructor, like this:
Image.network(
'https://raw.githubusercontent.com/flutter/website/master/src/_includes/code/layout/lakes/images/lake.jpg',
)
It also supports gifs!
Unfortunately, Image.network does not support placeholders and/or caching. To achieve those, please see the following recipes:
Flutter uses Dart's own build system, and the Pub package manager. You can read more about here.
Packages allow you to use Flutter packages or access underlying platform features in a form of a library.
- Dart pub(like Jcenter in Java world)
- Official Flutter plugins from Flutter repo
For local notifications you would have to rely on a 3rd party plugin.
To Log in with Facebook, use flutter_facebook_login plugin.
How do I use the NDK in my Flutter application?
- Offloading tasks to a background thread
- Background processes
- Executing Dart in the Background with Flutter Plugins and Geofencing
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent