DEV Community

Soumya Ranjan Naik
Soumya Ranjan Naik

Posted on

Flutter is based on Adaptive or Responsive Design ?

I was learning flutter because I need to develop a few highly interactive websites and I found everyone was utilizing MediaQueries and Device Orientation to change size fixed by pixels on each Widget and called it Responsive design.

As far as I know that method is Adaptive design in which the elements change depending upon Device or Screen whereas in Responsive it should scale things i.e. make it smaller or Bigger depending on Resolution.

Did I making some mistake in understanding the concepts or Flutter is based on Adaptive instead of Responsive ?

Let's have a discussion on this topic.

Oldest comments (1)

Collapse
 
nombrekeff profile image
Keff

Hey there, might be a bit late but here is what I understand.

Flutter, like the web, actually lets you build your app in, either way, you can have responsive design, adaptive design, or both (they say that ideally, you should have both). There's some good info and videos on the topic on Flutter's docs, you can check them here if you're interested.

In respect to the difference between Adaptive and Responsive, from what I understand Adaptive design has a set of predefined layouts, and when it's run the browser or Flutter in this case will select the appropriate layout for that screen size. If you then resize the browser or window it will not affect the layout, whereas with Responsive design the page would respond to the changes and adapt. Either changing the size of some elements or showing/hiding some other ones.

Hope that makes some sense, if not here's a good comparison between the two.