0

Flutter widgets look way bigger in Chrome compared to app run on a desktop (in my case on Linux). I'd like to either scale down web or scale up desktop app to make all the widgets look exactly the same.

I've already tried setting visualDensity or using Transform.scale() wrapper but both don't solve the problem. I know I can add a const ratio (different for web and desktop) and multiply every width, height, text size etc. by that value, but I feel there must be a simpler solution.

Take a look at web (left) and desktop (right)

enter image description here

tomrozb
  • 25,773
  • 31
  • 101
  • 122
  • Have a look at this package: https://pub.dev/packages/sizer – CoderUni Mar 26 '21 at 10:30
  • @Uni it's a similar solution to the one I mentioned with multiplying every size by a specified ratio. I'm looking for something more generic, something that doesn't require changes to every place sizes are used – tomrozb Mar 26 '21 at 11:12
  • I don't get what you mean by "something that doesn't require changes to every place sizes are used". Are you looking for something like this: https://www.youtube.com/watch?v=IYDVcriKjsw – CoderUni Mar 26 '21 at 11:24
  • @Uni no. I just want to have Container(width: 50, height: 50) look exactly the same on web & desktop. I don't want to do any additional calculations like "width: 50 * ratio" to make it look the same – tomrozb Mar 26 '21 at 11:35
  • I don't think thats possible. You need to apply calculations to make it look the same. Screen sizes, density, and ratio differs from one device to another. – CoderUni Mar 26 '21 at 12:18
  • both screenshots are from the same computer box? – pskink Mar 26 '21 at 12:22
  • @pskink yes. Desktop app and a browser side by side – tomrozb Mar 26 '21 at 12:46
  • and the browser is a Google chrome with the default 100% zoom? what if user use Firefox for example? or any other supported browser? I think it is a "tilting at windmills" – pskink Mar 26 '21 at 12:58
  • @pskink it's at 100%. Opened the webpage in Opera browser and it looks exactly the same as in Chrome. You can try to open default project in browser and as a desktop app and see the issue – tomrozb Mar 26 '21 at 13:51
  • Does this answer your question? [How to make flutter web size like app size](https://stackoverflow.com/questions/64183766/how-to-make-flutter-web-size-like-app-size) – Hossein Yousefpour Feb 07 '22 at 09:31

0 Answers0