Interview Questions for Flutter Developer
7 min readNov 18, 2021
Hello there!!,
First of all, Thank you so much for the great response to my previous article
Let’s start today’s topic with Basics…:)
- What is Flutter? Is it a language?
Flutter is not a programming language. It’s a software development kit (SDK) with prewritten code, consisting of ready-to-use and customizable widgets, as well as libraries, tools, and documentation that together serve to build cross-platform apps. - What is Dart? Why only Dart?
Dart is a client-optimized programming language developed by Google and launched in the year 2011. The programming language syntax is similar to Java & C++ and can be used to build mobile, desktop, server, and web applications. The Dart code compiles to native or JavaScript in order to run in the browser. - Advantages of Flutter
- Same UI and Business Logic in All Platforms. …
- Reduced Code Development Time. …
- Increased Time-to-Market Speed. …
- Similar to Native App Performance. …
- Custom, Animated UI of Any Complexity Available. …
- Own Rendering Engine. …
- Simple Platform-Specific Logic Implementation. …
- The Potential Ability to Go Beyond Mobile. - Build Process of Flutter
Using the Dart language allows Flutter to compile the source code ahead of time to native code. The engine’s C/C++code is compiled with Android’s NDK or iOS’ LLVM. Both pieces are wrapped in a “runner” Android and iOS project, resulting in an APK or IPA file respectively. - Limitations of Flutter
- Few third-party packages. …
- Inability to call Native APIs from Dart directly. …
- Requirement of Dart for development. …
- Lack of code push. …
- Little overall Support. …
- Few digital platforms. …
- Limited complexity. …
- Vector graphics and animations support. - What is State? Types of State
The state is the information that can be read synchronously when the widget is built and might change during the lifetime of the widget. State objects are created by the framework.
There are two conceptual types of state in any Flutter app. An ephemeral state can be implemented usingState
andsetState()
, and is often local to a single widget. The rest is your app state. Both types have their place in any Flutter app, and the split between the two depends on your own preference and the complexity of the app. - What is Widget?
Each element on the screen of the Flutter app is a widget. The view of the screen completely depends upon the choice and sequence of the widgets used to build the app. And the structure of the code of an app is a tree of widgets. - What is the Stateful and Stateless Widget?
The widgets whose state can not be altered once they are built are called stateless widgets. These widgets are immutable once they are built i.e any amount of change in the variables, icons, buttons, or retrieving data can not change the state of the app.
The widgets whose state can be altered once they are built are called stateful Widgets. These states are mutable and can be changed multiple times in their lifetime. This simply means the state of an app can change multiple times with different sets of variables, inputs, data.
https://www.geeksforgeeks.org/flutter-stateful-vs-stateless-widgets/ - What is the life cycle of Flutter Widget?
The life cycle of stateless widgets is simple; there’s only one stage: the build method. As soon as the widget gets built, the build method gets automatically called where you are supposed to create whatever appearance you want to add up in your application.
https://www.geeksforgeeks.org/life-cycle-of-flutter-widgets/#:~:text=The%20life%20cycle%20of%20stateless,add%20up%20in%20your%20application. - What is build()?
The flutter build method in flutter describes the user interface represented by this widget when it is inserted in the build context provided in the widget tree and the dependency of the widget is changed. - What are available trees in Flutter?
Widget tree, Element tree, and Render Object tree.
https://www.geeksforgeeks.org/flutter-widget-tree-and-element-tree/ - What are Ephemeral State and App State
Ephemeral State: When your state variables are inside of the Stateful widget, it's known as the ephemeral state.
App State: When your state variables are outside of the Stateful widget, it's known as App state. For managing ephemeral state you can only use the setState method.
https://stackoverflow.com/questions/60246075/what-is-called-as-ephemeral-state-and-app-state-in-flutter-application - Scheduler Binding v/s Widget Binding
Widgets Binding: The glue between the widgets layer and the Flutter engine. Scheduler Binding: This is also similar to WidgetBinding but it does not provide any life cycle callbacks. - How to initialize a parent widget from a child?
- Use of setState()?
We can use setState() to change the state of the component directly as well as through an arrow function. - What is Build Context?
A build context is nothing else but a reference to the location of a Widget within the tree structure of all the Widgets which are built. In short, think of BuildContext as the part of the Widgets tree where the Widget is attached to this tree. A build context only belongs to one widget. - What is Scaffolding?
The scaffold is a class in flutter which provides many widgets or we can say APIs like Drawer, SnackBar, BottomNavigationBar, FloatingActionButton, AppBar, etc. The scaffold will expand or occupy the whole device screen. - What is Material App?
MaterialApp
is a widget that introduces many interesting tools such asNavigator
orTheme
to help you develop your app.Material
is, on the other hand, a widget used to define a UI element respecting Material rules. It defines what elevation is, shape, and stuff. Then reused by many material widgets such asAppbar
orCard
orFloatingButton
. - How to check Degub/Release Mode?
if (kDebugMode)
doSomething(); - What are the supported databases in Flutter?
- Firebase Realtime Database
- hive
- ObjectBox
- sqflite
- Moor
https://objectbox.io/flutter-databases-sqflite-hive-objectbox-and-moor/ - What is Mixin?
Mixins in Dart are a way of using the code of a class again in multiple class hierarchies. Mixins can be used in two ways, the first case is when we want to make use of class code in such a way that the class doesn’t have any constructor and the object of the class is extended.
Have A Look https://www.topcoder.com/thrive/articles/dart-differences-between-extends-implements-and-mixin - What is Hook Widget?
Hooks are a way to share the same code with multiple widgets, code that is usually duplicated or hard to share between stateful widgets.
https://medium.com/flutter-community/flutter-hooks-say-goodbye-to-statefulwidget-and-reduce-boilerplate-code-8573d4720f9a#:~:text=Hooks%20are%20a%20way%20to,to%20share%20between%20stateful%20widgets. - How to provide Device Orientation Support?
https://docs.flutter.dev/cookbook/design/orientation - How to force the application to Portrait mode in a flutter
SystemChrome.setPreferredOrientations([
DeviceOrientation.portraitUp,
DeviceOrientation.portraitDown,
]); - How to provide Different Device Support?
https://stackoverflow.com/questions/49704497/how-to-make-flutter-app-responsive-according-to-different-screen-size - Packages for API Call
retrofit
http - Packages for State Management
https://docs.flutter.dev/development/data-and-backend/state-mgmt/options
Let’s check some Advance……
- What is Stream?
A Stream provides a way to receive a sequence of events. Each event is either a data event, also called an element of the stream, or an error event, which is a notification that something has failed. When a stream has emitted all its events, a single “done” event will notify the listener that the end has been reached. - What is a Safe Area?
If you’re developing an application using Flutter, avoiding content being clipped by system intrusions can be done by using the SafeArea widget. You can set on which sides the system intrusions should be avoided and also the minimum padding to be applied on each side. - Can Container have more than one child?
If you try to put more than one child in a container, you want to look at Row() or Column() class for linear ones. Stack() is used if you want to have floating children on top of each other. In the container can be an only child. - What is Cookbook?
This cookbook contains recipes that demonstrate how to solve common problems while writing Flutter apps. Each recipe is self-contained and can be used as a reference to help you build up an application.
https://docs.flutter.dev/cookbook - What is the use of pubspec.yaml?
The pubspec. yaml file is transversal to all apps and packages — it is where we add metadata to our project, stipulate the Dart and Flutter SDK constraints, manage the dependencies, and also set Flutter-specific configurations. - Performance issue between Stateful and Stateless widget?
StatefulWidget
is necessary for when the widget itself is maintaining its own state. In the example you gave, theProvider
package is handling the state for you, assuming you're using the correct provider type higher up the widget tree (for example,ChangeNotifierProvider
). There also doesn't seem to be anything in this code that would benefit from having access to the widget's lifecycle, so you wouldn't need access to methods likeinitState
ordispose
.
https://stackoverflow.com/questions/59309718/flutter-performance-of-statefulwidget-and-statelesswidget - Why does Listview inside Column, not work?
https://stackoverflow.com/questions/53797413/flutter-listview-crashes-inside-column - How to shift focus from one EditText to another Programmatically?
https://stackoverflow.com/questions/49410975/changing-focus-from-one-text-field-to-the-next-in-flutter - What are the Keys in Flutter?
https://www.raywenderlich.com/22416843-unlocking-your-flutter-widgets-with-keys - What are the Global Keys?
GlobalKeys
are like global variables: Try not to overuse them. There are almost always better ways to preserve the state globally using the right state management solution. - When to use double.infinity()?
I want to be as big as my parent allows (double.infinity)
I want to be as big as the screen (MediaQuery). - How to bind the list in reverse?
ListView.builder(
shrinkWrap: true,
reverse: true,
itemCount: 2,
itemBuilder: (context, index){
return listDesign(index);
},
), - What is Main-Axis v/s Cross-Axis?
MainAxis
is the axis for the Widget in which it is supposed to scroll.CrossAxis
is the one that is perpendicular to the main axis.
For Row:mainAxisAlignment
= Horizontal AxiscrossAxisAlignment
= Vertical Axis
For Column:mainAxisAlignment
= Vertical AxiscrossAxisAlignment
= Horizontal Axis
Keep Reading Keep Fluttering…..
Please Clap if it helped!! :)