What is mean by Flutter is a Declarative Framework
Flutter Knowledge Sharing #44
So far, I have discussed 43 Flutter topics. We have learned essential topics such as widgets, state management, and so on. First of all, we should understand Imperative and Declarative programming. Then we should go to intermediate topics, and Before that, I believe you should know what the Flutter declarative is.
Imperative and Declarative Programming
I can tell you that imperative programming shows you how to write code, and declarative programming shows you what you want to get from the code. I will explain an example below.
We have an app that says ‘hello’ in the middle of the screen; an imperative solution would be for the code to tell the app to go change that component(TextView), so basically go in and maybe have a function(setText), and it takes that text and changes it as you want.
The declarative solution is entirely different. Most of the time, In declared, a solution tells a state that it wants to see another text, then updating that state. The set state causes a rebuild, and then on the screen, you should see your new text. The change is not just bound with the component.
The difference is that the imperative describes the app or the specific component of what you want to do and what you want to change. Here it is a text, but in declarative, we tell what we want to change.
What is the Declarative mean in Flutter?
So let’s this explain via the Flutter and dart. As you know, in Flutter, everything is a widget. The whole application is wondering as a widget tree. As well as every stateful widget has a state and combination of states. I have given you comprehensive knowledge about state management in the following article.
In the beginning, when you start a new project, you will get the following screen. It’s a simple counter application.
Flutter considers the count text widget as a logical entity, and it will convert to a physical entity to show in the UI screen. First, the Text widget shows the value as define in the state. Therefore we think of it as a simple equation as follows.
UI = f(state)The function will build the UI, which describes the state. In this case, the state says to set the 0 as the text widget.
What happens when the user hits the floating action button, It just changes the state as follows. The setState method says to the Flutter, build the changes according to its body.
setState(() {
_counter++;
});Therefore the declarative framework means, It just shows the current state of the widget on the UI. So this is the concept of Flutter declarative. As this simple example, every other complex changes also happen as same. This idea can be taken as an advantage of Flutter. We are implicitly using this concept in all our Flutter applications.
Happy Coding !!!
Found this post helpful? Kindly tap the 👏 button below! :)
