Home > Net >  How to set different values to a property based on the device orientation
How to set different values to a property based on the device orientation

Time:11-22

I would like to change the top property value of the Positioned widget according to screen orientation.

I didn't know how to do it.

Can anyone help?

CodePudding user response:

user MediaQuery.of(context).orientation
It can respond to the orientation of the device.

Positioned(
  top: MediaQuery.of(context).orientation == Orientation.portrait ? portraitValue : landScapeValue,
child: //your code
);

CodePudding user response:

As from the official flutter article, you can use the OrientationBuilder to manage your widgets based on the device orientation like this:

  OrientationBuilder(
  builder: (context, orientation) {
    return Positioned(
      top: orientation == Orientation.portrait ? 10 : 50,
      child: /*...0*/
    );
  },
),

change 10 and 50 with your values.

And if you're willing to get the orientation of the device in other places other than widgets in your app, like methods, for example, you can use the MediaQuery.of(context).orientation to get the actual orientation of the device.

printOrientation() {
  print(MediaQuery.of(context).orientation);
 }

Check this for more info:

OrientationBuilder()

MediaQuery.of(context).orientation

  • Related