0

I define a square like following： Center(child: Container(width: 100, height: 100, color: Colors.red));

I test it on three handsets: Xiaomi MI 10, Xiaomi MI 6, and iPhone 6S.

on MI 10 and MI 6, the square size looks just the same. but on iPhone 6S, the square looks obviously smaller than MI 10 and MI 6. so the question is: How can I get the same screen size square on Android and IOS?

Hero
  • 1
  • try to give dimensions with respect to the device size using mediaQuery. – meditat Jan 15 '21 at 07:45
  • 2
    This is common issue you can use mediaQuery or you can refer to this given link - https://stackoverflow.com/questions/49553402/flutter-screen-size – Zeeking786 Jan 15 '21 at 07:57
  • But I DO want to have the exact same physical square screen size on different platform， for example, 3cm x 3cm. Using MediaQuery seems cannot have such effect. – Hero Jan 17 '21 at 03:02

1 Answers1

0

When you have done is given constant height and width which will create problems on different devices as other devices have different dimensions. You should use Media Query to give height and width as it will set these properties according to the device size. You should be doing it like this.

Container(
 height: MediaQuery.of(context).size.width * 0.65,
 width: MediaQuery.of(context).size.width * 0.65,
  ),
Usman Akhlaq
  • 481
  • 1
  • 3
  • 9
  • 2
    But I DO want to have the exact same physical square screen size on different platform， for example, 3cm x 3cm. Using MediaQuery seems cannot have such effect. – Hero Jan 17 '21 at 03:02