Flutter

When was the stable version of Flutter released?

December 2019.

What are widgets?

Everything in Flutter is a widget, but what exactly is a widget? A widget is a user interface element.

What’s a difference between stateless and stateful widgets?

Stateless widgets have their state created only once — therefore, the build method is called only once as well.

Stateful widgets have their state explicitly created, and it can be modified during the lifetime of the widget.

What’s the lifecycle of a ‘StatefulWidget’?

createState() — a method in a StatefulWidget that’s called immediately and should return a State object for the widget

— a method in a that’s called immediately and should return a object for the widget initState() — the first method called in the State object after the widget is created

— the first method called in the object after the widget is created didChangeDependencies() — called immediately after initState() the first time the widget is built

— called immediately after the first time the widget is built build() — very similar to the one from the StatelessWidget . It’s called right after didChangeDependencies() . It’s called every single time the UI needs to render and returns a widget’s tree.

— very similar to the one from the . It’s called right after . It’s called every single time the UI needs to render and returns a widget’s tree. didUpdateWidget() — it’s called when the parent widget changes and needs to redraw its UI

— it’s called when the parent widget changes and needs to redraw its UI deactivate() — called before dispose() , when this object is removed from the tree

— called before , when this object is removed from the tree dispose() — called when deallocating the whole widget and its state

What’s a pubspec.yml file?

It’s a file where you can provide all the dependencies (optional and required — e.g., plugins, Dart version, font, images) of your Flutter project. It’s also a place where you configure the project’s name and description.

What’s a hot reload and a hot restart? What’s the difference?

The hot-reload feature allows you to quickly reload the code on a running app. It takes less time than hot restart, as the hot restart destroys and recreates all states in the app as well (and the whole widget tree is completely rebuilt).

What’s an ‘InheritedWidget’?

It’s a special kind of widget that only holds data — it doesn’t describe the user interface. It defines a context at the root of a subtree, and it can efficiently provide this context to every widget down the tree.

Watch this video to understand the whole concept — I think it’s well explained there.

How can Flutter communicate with native frameworks in Objective-C/Swift/Kotlin/Java?

Through plugins. To call any native code, we need to create a bridge between the native code and Flutter.

What’s a ‘SafeArea’ widget for?

It’s a widget that makes it easily to place our widgets in a portion of the view that’s unobscured by bars and other content like status bars.

Is Flutter only for mobile apps?

No, it’s possible to build web applications as well — although it’s still in beta and not officially released yet.

What are the different ways to create navigation?

There are three ways to create navigation in Flutter:

Direct navigation with MaterialPageRoute (or similar)

(or similar) Static navigation with a map route — where you create a routes map in the MaterialApp and then push it by using its name

map in the and then push it by using its name Dynamic navigation which generates routes — i.e., implementing onGenerateRoute callback in the MaterialApp class

What are slivers? Give some examples.

You’re on a good start if you already noticed they’re not called silvers. A sliver is a portion of a scrollable area. You can use slivers to achieve custom scrolling effects. That means you can, for example, have a ListView and GridView scroll together. It’d be possible to do something similar with a basic scroll as well, but slivers are performing much better in such cases.

How can we embed a regular widget (e.g., a container) within a sliver?

We can embed a container within SliverToBoxAdapter that can be used as a child of the slivers.

What are tween animations?

Tween animations is short for in-betweening. In tween animations, we define the beginning and the end of the animation, and the framework itself calculates how to transition the widget to fulfill values.

What architectures are you familiar with, and which one do you prefer?

So it’s quite up to you. You should know at least one if you’ve ever created an app in Flutter. If not, you might want to read about them a little bit — e.g., BLoC, Redux.

What are keys, and when do you use them?

A key is an identifier that can be used for widgets, elements, and semantic nodes. Keys can be useful if you want to, for example, preserve a state when widgets move around in your widget tree. That means, if you use the key on a ScrollView , you can preserve the scroll position when modifying a collection.

How do you execute code only in certain modes (release, debug, profile)?

You can use constants from the Foundation package to check what mode the app is running in: kReleaseMode , kProfileMode , or kDebugMode .

What’s a difference between the debug and profile modes?

The debug mode is used for debugging the application. However, in the profile mode, only some debugging ability is maintained — just enough to profile your app’s performance.

When do you use 'double.infinity’ ?

It’s used when you want to specify the widget should be as big as a parent.

How do you create a widget that looks different in iOS and Android?

You can use the flutter_platform_widgets plugin, which makes things easier to handle, or you can check the platform manually by doing:

Platform.isIOS from dart:io package

or

if(Theme.of(context).platform == TargetPlatform.iOS)

Then, create/configure widgets depending on it.

How do you make HTTP requests in Flutter?

The easiest way is to use the HTTP package ( import ‘package:http/http.dart’ as http; ).

This has a convenient method for making a request:

http.get(‘https://jsonplaceholder.typicode.com/albums/1');

This returns a Future<http.Response> .

How do you use hexadecimal colors?

const Color(0xFF000000);

How to create a TextField with initial value?

We need to set a controller with an initial value — TextEditingController(text: “Initial Text”) .

Is there any way to dismiss the keyboard programatically?

FocusScope.of(context).unfocus();

What are the ways to add a ‘ListView’ to a column?

We need to either explicitly set the height of the ListView , use the shrinkWrap property on the ListView , or wrap the ListView with an Expanded widget.

Which one you use depends on your design.

What’s the reason behind text with a yellow double underline?

It means an instance of the theme is missing as a parent.

Can we use SVG files as images?

Yes, the flutter_svg plugin allows it.

How do you load an image from the network?

To show images from an URL, we can use the Image.network() constructor.

How do you programatically scroll a 'ScrollView' widget?

You need to create a controller, ScrollController , and assign it to the ScrollView . Then, we can call the animateTo method (or another similar method) on the controller whenever we want to scroll.

How do you override the back-button action?

We can use the WillPopScope widget for this.

What’s the purpose of the 'reverse‘’ property on a 'ListView’ widget?

It shows the items on the list in reversed order. We could reverse the array with the items as well, but this one makes the code cleaner.

How do you set a widget’s size based on the screen size?

MediaQuery.of(context).size

What’s the command for updating all of the plugins?

It’s flutter pub upgrade .

What’s Flutter tree shaking?

It means that all the code we don’t actually use (dead code) won’t be compiled. Thanks to that, we can use big libraries without including all the unused code in our apps.

Is Flutter actually native?

The Flutter application is compiled into a native ARM and x86 libraries, so, technically, it’s native.